How do i use fontawesome icons in TinyMce editor?

I’m trying to add a youtube button in TinyMce editor.

here is a portion of the js file which is in the js folder of the theme directory.

ed.addButton('youtube', {
            title : 'YouTube',
            image : url+'/youtube.png',
            onclick : function() {
               var id = prompt("Video id", "");
               var text = prompt("Video Heading", "");

               if (text != null && text != ''){
                  if (id != null && id != '')
                     ed.execCommand('mceInsertContent', false, '[yt id="'+id+'"]'+text+'[/yt]');
               }
               else{
                  if (id != null && id != '')
                     ed.execCommand('mceInsertContent', false, '[yt posts="'+id+'"]');
               }
            }
         });

In place of image : url+'/youtube.png' i’m trying to use text :''

But in text editor insted of font awesome icon , it is just showing as a text as it is.
Where should i place the font awesome file and how should i call it and how to use it in TinyMce?

Read more here: How do i use fontawesome icons in TinyMce editor?

Leave a Reply

Your email address will not be published. Required fields are marked *