Jump to content
Sign in to follow this  
pagerun

FontAwesome Code Disappears When changing in "Visual" view in editor

Recommended Posts

pagerun    0
pagerun

In the text view Im creating the following code

 

<ul class="icons">

<li><i class="icon-ok"></i> Lists</li>

<li><i class="icon-ok"></i> Buttons</li>

<li><i class="icon-ok"></i> Button groups</li>

<li><i class="icon-ok"></i> Navigation</li>

<li><i class="icon-ok"></i> Prepended form inputs</li>

</ul>

 

As per the FontAwesome code.

 

But when I click on Visual view and the back to Text View in the content editor, the the code for the ticks disappears. 

 

That is  this part:    <i class="icon-ok"></i>   disappears.

 

Is this a bug?   Is there a way to fix this ?

 

THanks

Share this post


Link to post
Share on other sites
Simon    247
Simon

The visual editor does not recognise <I> as valid code and strips it.

Also there is no need to escape your quotes like that

Share this post


Link to post
Share on other sites
pagerun    0
pagerun

what do you mean "escape your quotes".

 

I pretty much have to add that code in throughout my entire page (I have a lot of ticks), every time I use the visual editor.  So is there a solution to this problem?  

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

To put it very simple, the Visual editor for Wordpress is rubbish and the first thing I do after I have finished the installation of Wordpress, is to disable the visual editor.

 

So don't use the visual editor, it causes of kinds of issue with HTML, especially switching from one to the other. If you disable the visual editor, this should resolve your issue.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
Simon    247
Simon

The element <I> is not supported by the wp visual editor.

There is no fix or workaround other than do not use the visual editor with HTML

Share this post


Link to post
Share on other sites
bbudeck    0
bbudeck

I have the same problem. Even installing plugins that promise to "keep your HTML untouched" didn't prevent WP from deleting an empty <i> tag. I found that if the <i> tags enclosed some content (whitespace is not working) the visual editor mode won't delete it (WP 3.5.1). At least for me :)

So now I use <i class="icon-book"><span style="color: #fff;">.</span></i> - pretty crappy workaround. Authors in Visual mode still delete this "invisible" content by accident.
I would love to see someone write a shortcode for this: [i class="icon-book"] so far nothing like this seems to be available or I didn't get it running.

I wonder if this would collide with the pagelines css class already in use though.

 

Share this post


Link to post
Share on other sites
bbudeck    0
bbudeck

perfect, thank you Danny. just bought the Plugin and going to install.

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

No problem, happy to help!


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
dalia    0
dalia

Hi, Bought this plugin yesterday, just what i was looking for by the way! 

 

I was wondering where I can find the list of possible css? I don't wan't to create any new if something good already exists

 

I have by the way just tested using these short codes in the header of the pagelines boxes and it works!!! Will make my life easier!

Thanks to the creator

D

Share this post


Link to post
Share on other sites
James B    436
James B

Hi Dalia,

 

I don't think there is a list of the css used in the plugin. But you can check with the author on their product support forum, they might be able to advise further. http://www.pagelines.com/forum/forum/68-store-products/ just select the plugin/section from the drop down and that will assign it to the relevant developer :-)


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

  • Similar Content

    • gregbroxton
      By gregbroxton+
      The Font Awesome 'Brand icons' do not render on the mobile version of this site.
      The other Font Awesome icons render fine, but the "Brand icons" do not render at all when viewed on mobile.
      Everything works normally when viewed on the PC.
      Any ideas why the brand icons will not render in the mobile version?
      The site is using DMS2 with all updates
      gregbroxton.com
    • bartoncollege
      By bartoncollege
      I was perusing the master list of Font Awesome icons at http://fortawesome.github.io/Font-Awesome/icons/ and noticed that there are many new ones that are not available in iBox's dropdown menu.  Will these be added in the next DMS update?
      Thanks.
      Ken.
    • abuzzelli
      By abuzzelli+
      Trying to display social icons in the footer of http://brkichdesign.com/NewSite/. All are working but yelp. It's right after the pinterest icon, it's there but not showing up. Any ideas why?
    • webmktco
      By webmktco+
      Website URL: http://www.schrumpfdds.com/
      Framework Version: DMS 1.1.9
      WordPress Version: 4.1.1
       
      I noticed that the Font Awesome version in my theme is 3.2.1.
       
      Can you tell me how I can update the FA version? Or is that not possible?
    • webmktco
      By webmktco+
      I can't get the Yelp icon to display.  It seems my development site has an older version of Font Awesome (according the FA developer).
       
      How can I update FA to the most recent version?
       
      WordPress Version
      4.0.1
      Framework Version
      2.1.9.1
      PHP Version
      5.4
      http://forsythdentalpartners.myddsdev.com/  

×