Jump to content


Photo
- - - - -

Font Awesome Not Displaying Correctly

fontawesome

Best Answer jsharpe2001 , 18 October 2013 - 07:00 PM

Thanks for the suggestion, but I just decided to not use font awesome in lists and I've been able to work around some of the other issues.

 

Even with all plugins deactivated, this display issue with font awesome in lists still persists. I've also noticed that if I toggle from the HTML editor on a page with font awesome to the normal wordpress visual editor, Wordpress will strip the font awesome code from the HTML editor.

 

Like I said, I'm working around it and just saving working in the html editor and saving the code offline in case I (or another admin) accidentally toggles over to the visual editor. Very weird, but not that big a deal. 

Go to the full post


  • Please log in to reply
3 replies to this topic

#1 jsharpe2001

jsharpe2001

    Member

  • Members
  • 21 posts
  • LocationBrooklyn, NY
  • Framework Version:2.4.4
  • Country: Country Flag

Posted 14 October 2013 - 02:14 PM

I'm getting some wonkiness using fontawesome. Two issues that I can discern: 1. Icons used on the fixed navbar menu items display as squares in Google Chrome, but only on pages where I'm using font awesome elsewhere on the page (see 

Please Login or Register to see this Hidden Content

 for example of the latter). 2. When used in a list, the font awesome icon doesn't replace the unstyled bullet - both appear on the page. I'm using this list in a Content Box in a sidebar. This issue is consistent across browsers. 

 

This is the first time I've used font awesome, but I'm under the impression that it should work fine out of the box in pagelines framework.

 

It appears that the first issue with Chrome may have something to do with a conflict with NextGen, since I can resolve by deactivating the nextgen plugin, but I'm not sure how to resolve the conflict. I would try to tackle that myself, but even with all plugins deactivated, I'm still getting the second error, which leads me to think there is something I need to do within pagelines to resolve both issues.

 

A search through the forums didn't yield any workable solutions. Thoughts?

 

Thanks!



#2 greenfly

greenfly

    Advocate

  • Members

  • 3268 posts
  • LocationManchester, England
  • Framework Version:latest
  • Country: Country Flag

Posted 17 October 2013 - 04:34 PM

Hello Jsharpe. 

 

Try deactivating all plugins and then reactivate one by one. It may not be nextgen conflicting itself, it may be a conflict between that and another plugin. 



#3 jsharpe2001

jsharpe2001

    Member

  • Members
  • 21 posts
  • LocationBrooklyn, NY
  • Framework Version:2.4.4
  • Country: Country Flag

Posted 18 October 2013 - 07:00 PM   Best Answer

Thanks for the suggestion, but I just decided to not use font awesome in lists and I've been able to work around some of the other issues.

 

Even with all plugins deactivated, this display issue with font awesome in lists still persists. I've also noticed that if I toggle from the HTML editor on a page with font awesome to the normal wordpress visual editor, Wordpress will strip the font awesome code from the HTML editor.

 

Like I said, I'm working around it and just saving working in the html editor and saving the code offline in case I (or another admin) accidentally toggles over to the visual editor. Very weird, but not that big a deal. 



#4 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 19 October 2013 - 03:22 AM

Thanks for letting us know.

 

I've been able to use it in lists, but found it's much simpler, easier and less cumbersome to just include the code in the actual list item text detail, and display: none; for the actual bullet.  This also gave me the ability to use any icon I desired for each particular list item. I can even change their color this way, on an individual basis.

 

It is possible to apply font awesome icons as bullets, but I've never seen this done easily.







Also tagged with one or more of these keywords: fontawesome