Adding Icon in Announcement

jobbatam · June 2016

How add icon like this?

thank you all

vrijvlinder · June 2016

Try this, you can replace the url to the image

span.Tag.Tag-Announcement{
background-image: url('https://www.vanillaforums.org/plugins/EmojiExtender/emoji/little/+1.png');
background-repeat: no-repeat;
background-position:2px;
padding-left: 20px;
}

jobbatam · June 2016

thanks mr @vrijvlinder
Can i use font awesomeone?

vrijvlinder · June 2016

Probably but you would need a different code try this see if it works

span.Tag.Tag-Announcement::before{
content: "\f29b";
padding:2px;
margin-right: 3px;
}

jobbatam · June 2016

@vrijvlinder said:
Probably but you would need a different code try this see if it works
span.Tag.Tag-Announcement::before{
content: "\f29b";
padding:2px;
margin-right: 3px;
}

I tried this code, but icon not show, any suggestions?

vrijvlinder · June 2016

Did you install font awesome ? Coz it won't work unless you already have . If you don't have it go to the website and get it.

Vanillaplus · June 2016

@vrijvlinder said:
Try this, you can replace the url to the image

span.Tag.Tag-Announcement{
background-image: url('https://www.vanillaforums.org/plugins/EmojiExtender/emoji/little/+1.png');
background-repeat: no-repeat;
background-position:2px;
padding-left: 20px;
}

is working fine.

jobbatam · June 2016

@vrijvlinder said:
Did you install font awesome ? Coz it won't work unless you already have . If you don't have it go to the website and get it.

with add on or manually? where i need to start for install FA? i tried search in discussions but i don't found...

vrijvlinder · June 2016

Go to the Font Awesome website and get the information there. Font Awesome is not part of vanilla there is no add-on yet.

Go to their website http://fontawesome.io/icons/ and read the documentation . It explains everything. or Google Font Awesome, or how to use Font Awesome? , or How does Font Awesome work ?

Adding Icon in Announcement

Comments