Blog Documentation Book a Demo
Please upgrade here. These earlier versions are no longer being updated and have security issues.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

adding javascript to the head tag

leafboxtealeafboxtea New
edited January 2011 in Vanilla 2.0 - 2.8
@mark @tim or anyone in the know....

How do I add a javascript bit into the head? I'm trying to deploy Typekit fonts onto my Vanilla install and I need to embed this:

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

I've been looking around through the file structure, but I can't see the logical place to put it. I tried default.master.tpl in my theme, but I broke things and got a Bonk error.
Tagged:

Comments

  • leafboxtealeafboxtea New
    This was how I added it to default.master.tpl

    <head> {asset name='Head'} <div><script type="text/javascript" src="http://use.typekit.com/tlo4aer.js"></script> <script type="text/javascript">try{Typekit.load();}catch(e){}</script></div> </head>

    I also tried it without the div tag and it still broke. Is this the right place/method for it?
  • MarkMark Vanilla Staff
    The problem with putting javascript directly into a .tpl file is that the tpl extension means that smarty will pick up the file and parse it as a template. Smarty syntax uses curly braces, so javascript breaks things. The workaround is to wrap anything you don't want smarty to parse with {literal} tags. So, for your example: 

    {asset name='Head'}
    {literal}

    try{Typekit.load();}catch(e){}

    {/literal}
  • leafboxtealeafboxtea New
    @mark thanks for the tip! That worked out well. Don't know if its the best method, but the script is loading properly and all the functions are there.

    Vanilla with Typekit fonts in place.... http://leafboxtea.com/discuss

    Now, if I can just convince someone to write a plugin to to insert the code into the head it would be even easier http://vanillaforums.org/discussion/14415/plugin-request-typekit-fonts
  • CablespiderCablespider New
    Where else could javascript be included? I tried this with Shadowbox and it sort of worked. The image popped but caused other problems.
  • oliverraduneroliverraduner ✭✭
    edited January 2011
    @leafboxtea Through a plugin, you can add JavaScript to the header using a code like this:
    public function Base_Render_Before(&$Sender) { // Your JS Code... $JavaScript = ' <script type="text/javascript"> document.onclick = alert("you clicked"); </script>'; // Send it to the Header of the page $Sender->Head->AddString($JavaScript); }

    But one question to @Mark regarding this: if I have a couple plugins that add JS to the page - is it possible to kind of "merge" them in one <script></script>-element? Multiple plugins means now f.eg. multiple jQuery ready.functions. It works, but doesn't look too pretty...
  • MarkMark Vanilla Staff
    @oliverraduner - There's no way to do that right now since all plugins are "islands" and need to rely on nothing but the core and themselves. It *could* be worth considering adding something to core like Head->AddjQueryString() that makes sure everything echoed is wrapped in the jquery ready function. Worth thinking about.

    A tidier solution is to just put all of your js into it's own file, and include that. Of course people who like to have less includes would balk at that, but it is more visually pleasing to nerds like me who like to read html code :)
  • CablespiderCablespider New
    edited January 2011
    Posted in wrong thread. Sorry.
Sign In or Register to comment.