Icon on blocks title

Posted in: Newspaper
Post count: 9

Hi!
Can you please let us know how can we add an icon or symbol next to blocks title?
Thanks!

Post count: 22421

Hi,
Unfortunately the theme has no settings for this so it will have to be made custom. The php methodf and editing the theme files will prove to be way more complicated so css is the easier choice. You can use font awesome 4 menus to get icons and add them through css.
You will need to assign a custom class to the row of your block like so: http://screencast.com/t/CZ8lKS4g
The you ca use this css to apply the icon:
http://screencast.com/t/aJvQGaRI3e
.mycustomclass .block-title span:after{
content: "\F050";
font-family: FontAwesome;
margin-left:15px;
position:absolute;
top:7px;
color:black
}

The content: “\xxx” is the icon itself and this can be change to any from this list:
https://fortawesome.github.io/Font-Awesome/cheatsheet/
You have to get only the font number (after F) for every font.
Hope this helps.
Thank you!

Post count: 9

Perfect!! Thank you! 🙂

Post count: 45

Hello – can you confirm that this method still works? Not having any luck with it… Just wondering if it’s my site 🙂

Post count: 22421

I confirm this still works I have just tested it again: http://screencast.com/t/e8yA7w9tucir

Post count: 45

Hmm… I must be doing something wrong. I’ve added a custom class of rbrlock to the ROW that I’d like the icon to show on.

Then I’ve added this into my Custom CSS tab:

.rbrlock .block-title span:after{
content: "\F050";
font-family: FontAwesome;
margin-left:15px;
position:absolute;
top:7px;
color:black
}

No luck. Also tried removing the Custom Class from the row and placing it in the Column or even the particular text block, still no luck.

If I inspect the code there doesn’t appear to be any addition of the span:after{ CSS code…

Is there a way I can PM you my staging site to see if I’m simply screwing something up? 🙂

Thx.

Post count: 22421

Hi,

Here it is again with your class to it: http://screencast.com/t/m0rlD2rg9u3Hhttp://screencast.com/t/xvrSFwObm
Check any other code in the theme panel custom css box beforehand though as if the previous code is no properly closed, the current code will not work . Check any open tags.

Thank you!

Post count: 45

Must be an unclosed tag in my CSS because when I dropped it at the top, it works 😉

Thank you so much for your stellar support. Second to none!

Viewing 8 posts - 1 through 8 (of 8 total)
The forum ‘Newspaper’ is closed to new topics and replies.