Days
Hours
Minutes
Seconds
x

New Froala Editor v5.0.0 is here โ€“ Learn More

Skip to content
Froala Documentation

Miscellaneous

Font Awesome

Try it yourself:


Edit in JSFiddle

HTML

<div id="froala-editor">
  <h3>Start using the loved Font Awesome icons with the Froala WYSIWYG Editor content. <i class="fa fa-star fr-deletable">&nbsp;</i></h3>
  <p>Inserting icons in your text has never been easier. With the Font Awesome plugin, you can now add any of the FA icons and add a twist to your content. You can also control the icons that you display by using the <code>fontAwesomeSets</code> option.</p>
</div>

CSS

<!-- Include Font Awesome CSS. -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />

JAVASCRIPT

<!-- Include Font Awesome plugin JS. -->
<script type="text/javascript" src="../js/third_party/font_awesome.min.js"></script>
<script>
  new FroalaEditor('div#froala-editor', {
    toolbarButtons: ['fontAwesome']
  })
</script>
Sign up

Download the code by signing up for our newsletter

Sign up

Download the code by signing up for our newsletter

Note: By registering, you confirm that you agree to the processing of your personal data by Froala, Inc. - Froala as described in the Privacy Statement. Froala, Inc. - Froala is part of the Idera group and may share your information with its parent company Idera, Inc., and its affiliates. For further details on how your data is used, stored, and shared, please review our Privacy Statement.