I'm trying to add a Font-Awsome icon to a button I added to tinyMCE thus:
ed.addButton('youtube', {
title: 'Add Video' ,
icon: 'icon-youtube',
onclick: function () {
//do stuff here...
}
using an image like the docs suggest was not acceptable but for some reason I am not able to make this work. any ideas?
this CSS based solution seems to work nicely:
i.mce-i-[FONT-AWESOME-CLASSNAME]:before { // FONT-AWESOME-CLASSNAME e.g. "icon-youtube"
content: "[FONT-AWESOME-CONTENT]"; // FONT-AWESOME-CONTENT e.g. "\f166"
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
text-decoration: inherit;
color: #000;
font-size: 1.5em;
padding-right: 0.5em;
position: absolute;
top: 15%;
left: 0;
}
it is based on matt-royal's answer on this stack exchange wordpress thread