Cufon SF 4.x - Sitefinity - General Discussions

All Replies

Posted by Community Admin on 24-Jan-2011 00:00

Hello!

My first question in this forum.

Im trying to setup Cufon in my master page.
When i used Cufon in 3.x my setup was like this, but it does not work in 4.x:

<%@ Master Language="C#" %>
<%@ Register Assembly="Telerik.Cms.Web.UI" Namespace="Telerik.Cms.Web.UI" TagPrefix="sf" %>
....
<body>
    <sf:JsFileLink ID="JsFileLink1" runat="server" FileName="ajax.googleapis.com/.../jquery.min.js" />
    <sf:JsFileLink ID="JsFileLink2" runat="server" FileName="~/cufon/cufon-yui.js" />
    <sf:JsFileLink ID="JsFileLink3" runat="server" FileName="~/cufon/Netto_500-Netto-Bold_700.font.js" />
    <script type="text/javascript">
        Cufon.replace('h1');
        Cufon.replace('#logo h2');
    </script>
....
</body>

does anyone have a good example of how to set up Cufon in 4.x?

/Magnus

Posted by Community Admin on 24-Jan-2011 00:00

You could possibly use the "ResourceLinks" control rather than the "JsFileLink" control. The register tag would be as follows:

<%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sf" %>

<sf:ResourceLinks id="resourceLinks" runat="server">

<sf:ResourceFile Name="~/cufon/cufon-yui.js" Static="True" />

</sf:ResourceLinks>

Another option is to just use the "RadScriptBlock" control inside your head tag.

<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">

<script type='text/javascript' src='<%= this.ResolveUrl("~/cufon/cufon-yui.js") %>'></script>

</telerik:RadScriptBlock>

The telerik tag prefix should be already registered for the site via the web.config file.

Posted by Community Admin on 24-Jan-2011 00:00

You need to make sure the jquery\cufon scripts are loading in the proper order in the header, which I've found is usually the issue. I don't have access to an instance right now, but in reflector Telerik.Sitefinity.WEb.UI.PublicControls has the JavaScriptEmbedControl, so use that and specify the ScriptEmbedPosition property to load the script in the header.

I would probably not use the resourcelink control personally...I'm not sure I'd want an extra 60k+ loading in the same request, and I'm not sure how much say you'd have the order in which the scripts come down (jQuery+Cufon+Font)

Also to save on size, combine your cufon.js and font file (just cut out the font and paste it into the bottom of the cufon file.

Also, to get better performance from it add
Cufon.now(); to the bottom of your script (helps avoid popping)

FYI Cufon is awesome if nobody else is using it....start using it :)

Posted by Community Admin on 24-Jan-2011 00:00

@Richard Baugh: Thank you very much, your the king Richard! =)
Your first solution work fine.

/Magnus

Posted by Community Admin on 24-Jan-2011 00:00

@Steve: Thank you for your tips!

This thread is closed