Feature box: icon won't show - Forum | JoomShaper
Solved SP Page Builder

Feature box: icon won't show

Asked by Eric Klunder 5 years ago Last activity 5 years ago

After adding a feature box to a page I want to add an icon from the icon list (icons starting with fa-). When i select an icon, it shows as a small rectalgular box and sometimes it doesn't show at all. I that last case the title drops a line so it looks that something is placed, but it is not visible. Setting color to make it visible ( assuming the icon has the same colour as the background) doesn't change things.
Can you help?

Accepted answer

Marked as the solution
Mehtaz Afsana Borsha Staff
5 years ago

HI,
Could you please give me that specific page link and also give me a screenshot of your issue
Thank you

12 more replies

Oldest first Newest first Most helpful
Eric Klunder Asked this
5 years ago

Hi, thanks for your anwser.
Herewith the link to the page: www.autohistorica.nl/index.php/component/sppagebuilder/?view=page&id=78

I added three feature boxes: In the first the added icon (fa-ups) shows as an rectacular box, in the second the icon shows normal, and in the third the icon (fa-user-friends) is placed ( text drops a line when placed) but nothing visible at all. The strange thing is that some icons do show up, but most don't. All the three icons are placed in the same way and all the other settings in the left settings menu are not touched.

I made a screenshot, but that is the same as the link above. I can't upload the screenshot inhere?

Hope you can help me .

Regards,
Eric

Eric Klunder Asked this
5 years ago · edited

Hi,

I checked and css file compression is OFF

Hope you can help me out.

Mehtaz Afsana Borsha Staff
5 years ago

Keep a backup and make this portion again.

Eric Klunder Asked this
5 years ago

Hello Mehtaz Afsama Borsha,

I did make a whole new page with a new feature box. Same problems. Some Icons won't show.
Then i went to the pre-installed page Feature Box and tried to change one of the icons there to one I knew wouldn't show on my own pages. same result: icon won't show. So nothing wrong with the feature box as add-on, but i looks like the icon isn't present

Icons seem to be a font I found out. Can it be the font isn't installed propperly or incomplete?
Please help.

Paul Frankowski Senior Staff
5 years ago · edited

Hoi Eric,
in general it's problem when Font Awesome 4.7 meets Font Awesome 5.0.x on this same subpage - FA developer made this mess, and we still have to "clean" it, brrr.

In your case I suggest using:

#sp-main-body .fa-user-friends::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
}

Please add it in template options - custom code - Custom CSS

Eric Klunder Asked this
5 years ago

Hello Paul,

Ok, that did the trick! Thanks!!

But looking at the code, does that mean I have to put in the same code everytime I want to use an other icon that doesn't show? Not ideal, but can be done.

Better would be a piece of code that bypasses FA 4.7 in total in favour of 5.0.x. Is that possible?

Thanks in advance.
Eric

Paul Frankowski Senior Staff
5 years ago

Hopefully only for few icons, not for all.
In general the best way would be remove FA 4.7 from your template then SPPB would use only FA 5.x and no compatibility problems at all.

Eric Klunder Asked this
5 years ago

Ok.
When I want to delete Fa 4.7 from the template, is that a simple job and how is it be done?
I assume you have to delete some code somewhere in the CSS of the template. I am not a pro but have some understanding of CSS. I found a file: font-awesome.min.css. In there FA 4.7 is mentioned in several URL's ( */@font-face{font-family:'FontAwesome';src:url('../fonts/fontawesome-webfont.eot?v=4.7.0'); etc, etc..

Paul Frankowski Senior Staff
5 years ago

If we talk about file from template folder, just CLEAN whole content from it. Make is empty file.
Then FA would be loaded from SPPB only.

Log in to reply.