Support » Themes and Templates » JavaScript enqueuing in header correct?

  • Loading several scripts in the header. Somehow the slider built into the theme does not slide and no JavaScript errors are shown. So I wonder if I am enqueueing all script correctly. Here is the part of the header that loads all except for what NextGen adds later on for galleries + two or three more other plugins on other pages

    <?php
    	// Includes the jQuery framework
    	if( !is_admin()){
    		wp_deregister_script('jquery');
    		wp_register_script('jquery', ($themePath ."js/jquery-1.4.min.js"), false, '1.4.2');
    		wp_enqueue_script('jquery');
    	}
    
    	// calls hook to WordPress head functions
    	wp_head();
    	?>
    
    	<!-- Feed link / Pingback link -->
    	<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS2 Feed" href="<?php bloginfo('rss2_url'); ?>" />
    	<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
    
    	<!-- Favorites icon -->
    	<link rel="shortcut icon" href="<?php echo $themePath ?>images/favicon.ico" />
    
    	<!-- Style sheets -->
    	<link rel="stylesheet" type="text/css" href="<?php echo $cssPath ?>css/reset.min.css" />
    	<link rel="stylesheet" type="text/css" href="<?php echo $cssPath ?>css/menu.min.css" />
    	<link rel="stylesheet" type="text/css" href="<?php echo $cssPath ?>js/fancybox/jquery.fancybox-1.3.4.css" />
    	<link rel="stylesheet" type="text/css" href="<?php echo $cssPath ?>css/tooltip.min.css" />
    	<link rel="stylesheet" type="text/css" href="<?php echo $cssPath ?>style-default.css" />
    	<link rel="stylesheet" type="text/css" href="<?php echo $cssPath ?>jg-style-customizations.css" />
    
    	<!-- jQuery utilities -->
    	<script type="text/javascript">
    		var themePath = '<?php echo $themePath ?>'; // for js functions
    	</script>
    	<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
    	<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
    	<script type="text/javascript" src="<?php echo $themePath ?>js/jquery.easing.1.3.min.js"></script>
    	<script type="text/javascript" src="<?php echo $themePath ?>js/hoverIntent.min.js"></script>
    	<script type="text/javascript" src="<?php echo $themePath ?>js/jquery.bgiframe.min.js"></script>
    	<!-- Drop down menus -->
    	<script type="text/javascript" src="<?php echo $themePath ?>js/superfish.min.js"></script>
    	<script type="text/javascript" src="<?php echo $themePath ?>js/supersubs.min.js"></script>
    	<!-- <script type="text/javascript" src="<?php echo $themePath ?>js/jquery.curvycorners.packed.js"></script> -->
    
    	<!-- AJAX Form submission -->
    	<script type="text/javascript" src="<?php echo $themePath ?>js/jquery.form.js"></script>
    
    ?>

    Does this seem correct?

Viewing 3 replies - 1 through 3 (of 3 total)
  • Chip Bennett

    (@chipbennett)

    Theme Review Admin

    You should be using wp_enqueue_script() to enqueue scripts in the header.

    Add something like this to functions.php:

    function mytheme_enqueue_scripts() {
         wp_enqueue_script( 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js' );
         wp_enqueue_script( get_stylesheet_directory_uri() . '/js/jquery.easing.1.3.min.js' );
         wp_enqueue_script( get_stylesheet_directory_uri() . '/js/hoverIntent.min.js' );
         wp_enqueue_script( get_stylesheet_directory_uri() . '/js/jquery.bgiframe.min.js' );
         wp_enqueue_script( get_stylesheet_directory_uri() . '/js/superfish.min.js' );
         wp_enqueue_script( get_stylesheet_directory_uri() . '/js/supersubs.min.js' );
         wp_enqueue_script( get_stylesheet_directory_uri() . '/js/jquery.curvycorners.packed.js' );
         wp_enqueue_script( get_stylesheet_directory_uri() . '/js/jquery.form.js' );
    }
    add_action( 'wp_head', 'mytheme_enqueue_scripts' );

    p.s. that is a TON of javascript/jQuery files to be including. Your problem might simply be conflicts among all those scripts…

    Thanks for the feedback Chip. Will try to enqueue them like this or reduce scripts used.

    Have this in functions now:

    if( !is_admin()){
    	function mytheme_enqueue_scripts() {
    	wp_enqueue_script( get_stylesheet_directory_uri() . '/js/hoverIntent.min.js' );
    	wp_enqueue_script( get_stylesheet_directory_uri() . '/js/jquery.bgiframe.min.js' );
    	wp_enqueue_script( get_stylesheet_directory_uri() . '/js/superfish.min.js' );
    	wp_enqueue_script( get_stylesheet_directory_uri() . '/js/supersubs.min.js' );
    	wp_deregister_script('jquery');
    	wp_register_script('jquery', ($themePath ."js/jquery-1.4.min.js"), false, '1.4.2');
    	wp_enqueue_script('jquery');
        wp_enqueue_script( 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js' );
        wp_enqueue_script( get_stylesheet_directory_uri() . '/js/jquery.easing.1.3.min.js' );
         wp_enqueue_script( get_stylesheet_directory_uri() . '/js/jquery.form.js' );
    }
    add_action( 'wp_head', 'mytheme_enqueue_scripts' );
    }

    + bizarre PHP errors:

    vedata_event\";a:1:{s:32:\"40cd750bba9870f18aada2478b24840a\";a:3:{s:8:\"schedule\";s:5:\"daily\";s:4:\"args\";a:0:{}s:8:\"interval\";i:86400;}}}i:1298597211;a:1:{s:18:\"mca_savedata_event\";a:1:{s:32:\"40cd750bba9870f18aada2478b24840a\";a:3:{s:8:\"schedule\";s:5:\"daily\";s:4:\"args\";a:0:{}s:8:\"interval\";i:86400;}}}i:1298597213;a:1:{s:18:\"mca_savedata_event\";a:1:{s:32:\"40cd750bba9870f18aada2478b24840a\";a:3:{s:8:\"schedule\";s:5:\"daily\";s:4:\"args\";a:0:{}s:8:\"interval\";i:86400;}}}i:1298599013;a:1:{s:18:\"mca_savedata_event\";a:1:{s:32:\"40cd750bba9870f18aada2478b24840a\";a:3:{s:8:\"schedule\";s:5:\"daily\";s:4:\"args\";a:0:{}s:8:\"interval\";i:86400;}}}i:1298599016;a:1:{s:18:\"mca_savedata_event\";a:1:{s:32:\"40cd750bba9870f18aada2478b24840a\";a:3:{s:8:\"schedule\";s:5:\"daily\";s:4:\"args\";a:0:{}s:8:\"interval\";i:86400;}}}i:1298599898;a:1:{s:18:\"mca_savedata_event\";a:1:{s:32:\"40cd750bba9870f18aada2478b24840a\";a:3:{s:8:\"schedule\";s:5:\"daily\";s:4:\"args\";a:0:{}s:8:\"interval\";i:86400;}}}i:1298599904;a:1:{s:18:\"mca_savedata_event\";a:1:{s:32:\"40cd750bba9870f18aada2478b24840a\";a:3:{s:8:\"schedule\";s:5:\"daily\";s:4:\"args\";a:0:{}s:8:\"interval\";i:86400;}}}s:7:\"version\";i:2;}' WHERE <code>option_name</code> = 'cron' made by call_user_func_array, wp_reschedule_event, wp_schedule_event, _set_cron_array, update_option
    [24-Feb-2011 12:17:42] PHP Fatal error:  Allowed memory size of 134217728 bytes exhausted (tried to allocate 3362177 bytes) in /opt/local/www/clients/site/wp-includes/wp-db.php on line 785

    Memory limit = 128 M at the moment..
    Somehow the scripts don’t seem to load on the site though. Maybe I should retire for the day and try again tomorrow..

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘JavaScript enqueuing in header correct?’ is closed to new replies.