Nunchuck Skills: Hack Your Head

There are times when I need to use a particular script or style sheet temporarily and only on a portion of the site. This is especially true with a blog.

For example, if you use SyntaxHighlighter, you could use up to 21 brush scripts, plus the core script and theme style sheet. That makes for a lot of references in the head tag.  That is why I almost always add the following inside the <head> tag in my top lever master page between the style sheet and script references.

<asp:ContentPlaceHolder Id="head" runat="server">
<!-- extra references load from child -->
</asp:ContentPlaceHolder>

This allows me to specify any extra/temporary css or script references in the child template. In this example I even passed in the javascript function to generate a lightbox.

<asp:Content ContentPlaceHolderID="head" runat="server">
    <link href="/css/temp.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="/scripts/jquery.lightbox-0.5.min.js"></script>
    <script type="text/javascript">
    $(function() {
        $('#gallery a').lightBox();
    });
    </script>
</asp:Content>

I know this isn't groundbreaking, but it is a really great tip for anyone just starting out with Umbraco or master pages.

About Me

I am a Founder and Managing Partner of Trio Technologies and Trio Merchant Services in Abilene, Texas. I have a beautiful wife and two incredible sons.

Popular

Blogroll

Bookmarks