0

Im currently trying to integrate a superfish menu into my wordpress theme, however it seems to be disappearing. I believe i have coded the js and the css correctly... can someone give me a pointer as to whats up? Or how to integrate into the functions.php

FURTHER UPDATE*

Ok.... so i put the functions back into my header.php as below:

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><?php bloginfo('name'); ?> <?php if ( is_single() ) { ?> &raquo; Blog Archive <?php } ?> <?php wp_title(); ?></title>
<meta name="keywords" content="Holiday, free CSS template, clean, neat, aqua, white, templatemo" />
<meta name="description" content="Holiday is a clean and neat free CSS template using aqua and white colors." />
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" />
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">     </script>
<script type="text/javascript" charset="utf-8"></script>
<?php function my_theme_scripts() {
wp_register_script( 'jquery' );
wp_enqueue_script( 'superfish', 'js/superfish.js', array( 'jquery' ) );
}    
add_action('init', 'my_theme_scripts');
?>

<script> 

$(document).ready(function(){ 
    $("ul.sf-menu").superfish(); 
}); 
</script>

<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'sf-menu', ) ); ?> 
1
  • BTW please note that the superfish.css is being called in my style.css via a @import rule... but it is there....
    – Kirsty
    Nov 19, 2012 at 18:43

2 Answers 2

1

You might want to take a look at the wp_enqueue_script() documentation and modify your code to follow standard WordPress practice. Then look at your output and verify that your JS is being loaded.

19
  • Hi Stephen, i take it that the enqueue script goes in the functions file?
    – Kirsty
    Nov 19, 2012 at 18:43
  • Yes, wp_enqueue_script() calls belong in functions.php, inside a callback hooked into an appropriate action hook. But more importantly, your actual script does not account for jQuery no-conflict mode, which WordPress enforces. Nov 19, 2012 at 18:45
  • See Chip's comment above.
    – Steve
    Nov 19, 2012 at 18:46
  • Hi Chip, Thanks for this... so for example if im calling this JS script.... Will it be like this for example <?php function my_scripts_method() { wp_enqueue_script( 'custom-script', get_template_directory_uri() . '/js/custom_script.js', array('jquery') ); } add_action('wp_enqueue_scripts', 'my_scripts_method'); ?>
    – Kirsty
    Nov 19, 2012 at 18:47
  • Hi guys, can you check out the above and see if i have written that right?
    – Kirsty
    Nov 19, 2012 at 18:51
1

You're also going to run into trouble due to this line in header.php:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">     </script>

You're loading an old version of jQuery, and then enqueueing the core-bundled version of jQuery. So, you've got two, probably incompatible, jQuery libraries loaded at the same time.

Get rid of the hard-coded jQuery script link, and just use the core-bundled version that you enqueue.

3
  • oh right ok...... i will try that... is it because its trying to load two different types of jquery?
    – Kirsty
    Nov 19, 2012 at 22:15
  • well i removed that and and it stopped loading the js altogether, even thou its in the functions file :S
    – Kirsty
    Nov 19, 2012 at 22:17
  • Do you have a live link to the rendered output? Nov 19, 2012 at 22:50

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.