Editing javascript in header

  • cflan12

    (@cflan12)


    12 years, 6 months ago

    I want to add async attributes to certain scripts that are causing a slow render in the head of my page, suggested by google page insights. Opening the page source I can see

    <script type=’text/javascript’ src=’http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js?ver=1.3.2′></script&gt;
    <script type=’text/javascript’ src=’wp-content/plugins/mailchimp/js/scrollTo.js?ver=1.3′></script>

    and any other scripts I want to add my async attribute too. But when I attempt to edit the header file on the theme editor, its

    <script type=”text/javascript” src=”<?php bloginfo(‘template_url’); ?>/js/font_museo_sans.js”></script>
    <script type=”text/javascript” src=”<?php bloginfo(‘template_url’); ?>/js/jquery.cycle.all.min.js”></script>
    <script type=”text/javascript” src=”<?php bloginfo(‘template_url’); ?>/js/scrolltopcontrol.js”></script>
    <script type=”text/javascript” src=”<?php bloginfo(‘template_url’); ?>/js/preload.js”></script>

    Can anyone point me in the direction of information regarding editing this in the header? Thank you

Viewing 1 replies (of 1 total)
  • Christopher Anderton

    (@anderton)

    12 years, 6 months ago

    Cheers.

    1. The Jquery version you like to use is quite old.
    2. Don’t ever use the Google Jquery in WordPress (if you don’t have a really legit reason to). I know many who does, and the net is full of tutorials how you use Google CDN Jquery instead of the WordPress core one. It could break plugins and core functions in WordPress in worst case, it’s also blocked in some countries.

    3. As for the scripts. Don’t load them directly in the header. They should be enqueued in your themes functions.php so they load correctly and don’t create conflicts.

    More reading on this at wpbeginner and the WordPress Codex

    For example. Open your functions.php file located in the theme folder. Look in it to see if the theme developer has left any hints of how to accomplish what you want.

    Here is a quick example how it can look:
    http://pastebin.com/EE97ixpB

Viewing 1 replies (of 1 total)

The topic ‘Editing javascript in header’ is closed to new replies.