Shortcode to add icons from Font Awesome

[lorne17]

Hello there,

I am new here and just getting my feet wet with Swift Ideas themes and more specifically FlexForm.

I’m curious how I can get font-awesome icons loaded in? I am setting up my homepage here: http://lab-design.com/wordpress and using the icon shortcode in the menu. However not ALL the font-awesome icons are listed to place above my title centered.

I have used this code: [icon image="road" size="medium" cont="no" float="none"] and that works, but if I change “road” to say “users” it just shows blank. How can I get access to ALL font-awesome fonts? Forgive me if this has been asked, I couldn’t find it in the forums.

Thanks,
Lrone

[lorne17]

Oh and I also tried this: <i class="fa fa-camera-retro"></i> fa-camera-retro

That didn’t work either. It just shows “fa-camera-retro”

[Rui Guerreiro – SUPPORT]

Hi,

Flexform is still not using the latest Font Awesome version, here is that topic.

Update for Flexform for WP 4 and Font Awesome 4.2?

Instead of “fa” you should use “icon”. So the Retro camera will be “icon-camera-retro”

-Rui

[lorne17]

Ok I have called in the icons and able to adjust the size, but I can’t get it to center? Any ideas:

<h3 class="fa icon-camera-retro icon-2x" align="center"></h3>

I don’t have to use H3, that’s just what I decided to use until I get it working right. Is there any shortcode built-in to the template that I can use? Cuz when I use the Visual builder instead of HTML in WordPress, it doesn’t show the icon, so you don’t know it’s actually there until you view the page.

Thanks,
Lorne

[Rui Guerreiro – SUPPORT]

You should use the tag,

<i class="fa icon-camera-retro icon-2x" align="center"></i> 

Check here the list of icons
http://fortawesome.github.io/Font-Awesome/3.2.1/icons/

-Rui

[lorne17]

Ok so I put that in the text editor and when I save the swift page creator, then publish the site, that line of code: <i class="fa icon-camera-retro icon-2x" align="center"></i> turns into ` ‘. What am I missing? This isn’t rocket science but I can’t figure it out!

Also, is there a shortcode I can put in the Visual editor, so I can actually see where these are, otherwise you don’t know where they are without looking at the HTML code.

Thanks,
Lorne

[lorne17]

Ok I’m a moron,

I could have sworn I tried this first thing, but apparently it didn’t work. I changed the actual shortcode: [icon image="camera-retro" size="medium" cont="no" float="none"] and by changing just the image title it worked fine. I thought I did that to start but apparently I did not do it correctly. This satisfies my need for a shortcode and all icons are same color and can be changed.

Thanks for the help! It got me to my solution 🙂
Lorne

[Mohammad – SUPPORT]

Hi,
Please try to use this plugin https://wordpress.org/plugins/font-awesome/. Hope that should help to you.
Thanks
Mohammad