Skip to content

Instantly share code, notes, and snippets.

@tomjn
Created September 10, 2012 10:22
Show Gist options
  • Save tomjn/3690149 to your computer and use it in GitHub Desktop.
Save tomjn/3690149 to your computer and use it in GitHub Desktop.
Typekit fonts for TinyMCE editor plugin
add_filter("mce_external_plugins", "tomjn_mce_external_plugins");
function tomjn_mce_external_plugins($plugin_array){
$plugin_array['typekit'] = get_template_directory_uri().'/typekit.tinymce.js';
return $plugin_array;
}
(function() {
tinymce.create('tinymce.plugins.typekit', {
init: function(ed, url) {
ed.onPreInit.add(function(ed) {
// Get the DOM document object for the IFRAME
var doc = ed.getDoc();
// Create the script we will add to the header asynchronously
var jscript = "(function() {\n\
var config = {\n\
kitId: 'xxxxxxx'\n\
};\n\
var d = false;\n\
var tk = document.createElement('script');\n\
tk.src = '//use.typekit.net/' + config.kitId + '.js';\n\
tk.type = 'text/javascript';\n\
tk.async = 'true';\n\
tk.onload = tk.onreadystatechange = function() {\n\
var rs = this.readyState;\n\
if (d || rs && rs != 'complete' && rs != 'loaded') return;\n\
d = true;\n\
try { Typekit.load(config); } catch (e) {}\n\
};\n\
var s = document.getElementsByTagName('script')[0];\n\
s.parentNode.insertBefore(tk, s);\n\
})();";
// Create a script element and insert the TypeKit code into it
var script = doc.createElement("script");
script.type = "text/javascript";
script.appendChild(doc.createTextNode(jscript));
// Add the script to the header
doc.getElementsByTagName('head')[0].appendChild(script);
});
},
getInfo: function() {
return {
longname: 'TypeKit For TinyMCE',
author: 'Tom J Nowell',
authorurl: 'http://tomjn.com/',
infourl: 'http://twitter.com/tarendai',
version: "1.1"
};
}
});
tinymce.PluginManager.add('typekit', tinymce.plugins.typekit);
})();
@JoshRiser
Copy link

TinyMCE has since deprecated the onPreInit function in version 4.x, which WordPress now uses. It doesn't cause any errors, in fact it still works, but there is a log in the console stating that it is deprecated (giving no optimal solution, leaving it to me to save the day).

Replacing line 4 in typekit.tinymce.js with this will ensure future compatibility:

            ed.on('PreInit', function(e) {

Documentation on the on('PreInit') function is here.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment