Hide some emojis from picker and content

peopleinside

@clarkwinkelmann Hi, I want disallow an emoticons because I don't like my community have it.
How I can do? Can suggest as issue to add a feature like this.

The emoticons I want forbid feel to me vulgar.
Any .htaccess rules I can have for block a specific URL?

From the web console I can see the web address of this emoticon but I don't know how I can forbid this external emoticon only.

Any suggestion will be appreciated.
I don't know if I can post this bad (for me) emoticon here but is included in the plugin.

clarkwinkelmann

peopleinside that's not going to be a feature of this extension. All this extension does is add the EmojiOneArea library to Flarum.

If you want to hide one particular emoji from the picker, you might be able to achieve it with custom CSS. Obviously users will still be able to insert it into the post using other ways.

To filter what's allowed in the post you'll need some kind of filter extension, which this extension isn't.

peopleinside

clarkwinkelmann I tried to look in browser console but seems I can only hide all emoji.
I think there is no way to block just one offensive emoji.

clarkwinkelmann

peopleinside to hide an emoji in the EmojiOneArea picker you can use something like

.emojibtn[data-name=":heart_eyes:"] { display: none !important; }

You can find the data-name by looking with the developer tools, or you should also be able to find it with online emoji search tools.

It's not as easy to hide something from Flarum's own emoji picker (the one that pops up when typing :). I unfortunately don't have any suggestion how to hide something from that one.

peopleinside

clarkwinkelmann thank you for the reply.
This is a screen that show the emojii I want hide and under the developer tool.

Is showed the URL where the emojii is taken from the plugin but there is no emojii name to put as :heart_eyes

Ah OK maybe find the name... will try.
Not working...

I tried

.emojibtn[data-name=":middle_finger:"] { display: none !important; }

cleared cache but still show

clarkwinkelmann

peopleinside I was explaining how to hide it from the picker that my extension uses.

If you want to hide it when it's already posted, I suppose you could target the src value with a CSS rule. That's outside of the scope of this extension.

peopleinside

clarkwinkelmann Thanks it works, I misunderstood and was looking on post.
The CSS that hide in the extension is enough, thank you!

Any idea how I can hide also the same emojii when user type : followed by the emoji name? This is from Flarum emojii extension. I still have the same vulgar emoticon there.

clarkwinkelmann

peopleinside I have not seen any selector that could be used for that. You can either hide the image via src, but the entry will still be selectable, it just will be a row with nothing visible in it. Or you can fork the extension to add some classes/attributes or alter the emoji list.

peopleinside

clarkwinkelmann You can either hide the image via src

Thanks for the answer. I don't know what you mean with You can either hide the image via src.
What I have to do for do that?

clarkwinkelmann

peopleinside using the CSS attribute selector, like I've done above for the data- attribute. img[src=https://thepath] { display: none; }

peopleinside

clarkwinkelmann

img[src="https://thepath"] { display: none; }

Thank you very much, adding "" between URL works.

clarkwinkelmann

Good to know!

I have split the thread since it's not entirely specific to this extension and might be useful for other situations.