Using Typekit font library

46 views
Skip to first unread message

Alexander Obuhovich

unread,
Sep 5, 2012, 6:00:21 AM9/5/12
to Development In-Portal
There is an Adobe website called Typekit - https://typekit.com/, which allows you to use custom nice looking fonts on your website.

To use it you need first to generate a typekit and then it it's ID in following JavaScript code that should be present on all pages:

<script type="text/javascript" src="//use.typekit.com/TYPEKIT_ID_HERE.js"></script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>


However, when you try to edit content blocks of website, these nice fonts won't be working inside CKEditor. To make them work we need some extra JavaScript code to be added into Admin Console:

CKEDITOR.on(
'instanceReady',
function(ev) {
var $script = document.createElement('script'),
$editor_instance = CKEDITOR.instances[ev.editor.name];

$script.onload = function() {
try{$editor_instance.window.$.Typekit.load();}catch(e){}
};

$editor_instance.document.getHead().$.appendChild($script);
}
);

As you can see both code fragments share TYPEKIT_ID_HERE, which we can move out into a new system setting. When preset we can make CKEditor use it automatically.


--
Best Regards,

http://www.in-portal.com
http://www.alex-time.com

Dmitry A.

unread,
Sep 16, 2012, 12:36:07 AM9/16/12
to in-por...@googlegroups.com
Hi Alex,


Yes, I agree we should have new System Configuration setting created for this. Would you please create a task for this in In-Portal 5.2.1


Thanks.

DA

Alexander Obuhovich

unread,
Sep 16, 2012, 7:56:10 AM9/16/12
to in-por...@googlegroups.com

Alexander Obuhovich

unread,
Oct 19, 2012, 10:14:32 AM10/19/12
to in-por...@googlegroups.com
Here are the patches.

Ready for testing.
typekit_core_feat.patch
typekit_themes_feat.patch
Reply all
Reply to author
Forward
0 new messages