jQuery in Wordpress Sidebar

Discussion in 'jQuery' started by Mafia Penguin, Apr 23, 2011.

  1. #1
    Hi everyone, for some reason the JQuery attributes in the sidebar of my website only work on the homepage. Every other page the code doesn't work. :confused:

    Me (of course) being new to jQuery have no idea what to make of this.

    All the related code is written in a php sidebar widget.

    <div class="art-advo">Advanced Options</div>
    
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript">
    $(document).ready(function()
    {
      //hide the all of the element with class msg_body
      $(".content_body").hide();
      //toggle the componenet with class msg_body
      $(".msg_head").click(function()
      {
        $(this).next(".content_body").slideToggle(600);
      });
    });
    
    </script>
    
    <div class="msg_list">
    <div class="msg_head"><div class="msg_head_genres"></div></div>
    <div class="content_body">
    <div class="art-genredescription">Define your search result by selecting between any genres of your choice! </div>
    
    
    <div class="art-genrecontent">
    <Input type = 'Checkbox' Name ='ch1' value="word" style="float: left; margin-bottom: 2px; margin-top: 6px; width: 15px; height: 15px"/><?PHP print $ch1; ?><a href="http://www.filmhammer.com/category/all"><div class="art-genrecontenttitle"><?php wp_list_categories('show_count=1&include=89&title_li='); ?></div><a href="http://www.filmhammer.com/?random&random_cat_id=89"  title="Random"><div class="art-genrerandom"></div></a>
    </div>
    
    <div class="art-genrefooter">Have a favorite? Vote for it here.</div>
    </div>
    
    
    
    <div class="msg_head">Year</div>
    <div class="content_body">
    orem ipsum dolor sit amet, consectetuer adipiscing elit orem ipsum dolor sit amet, consectetuer adipiscing elit
    </div>
    <div class="msg_head">Run-Time</div>
    <div class="content_body">
    orem ipsum dolor sit amet, consectetuer adipiscing elit orem ipsum dolor sit amet, consectetuer adipiscing elit
    </div>
    </div>
    
    <div class="art-searchdivide"> </div>
    
    <form method="get" id="searchform" action="<?php bloginfo('url'); ?>/">
    <span class="art-button-wrapper">
    		<span class="l"> </span>
    		<span class="r"> </span>
    		<input class="art-button" type="submit" name="search" value="<?php _e('Search', 'kubrick'); ?>"/>
    </span>	
    
    
    
    </form>
    
    
    PHP:
    If there's anything else needed to solve this issue then i'll try and provide it.

    Thanks for your help. :)
     
    Mafia Penguin, Apr 23, 2011 IP
  2. Mafia Penguin

    Mafia Penguin Peon

    Messages:
    64
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Mafia Penguin, Apr 23, 2011 IP
  3. artus.systems

    artus.systems Well-Known Member

    Messages:
    87
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    103
    #3
    It is because jquery is not found in inner pages.
     
    artus.systems, Apr 25, 2011 IP
  4. Mafia Penguin

    Mafia Penguin Peon

    Messages:
    64
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Ah ok, i tried inserting the code into other php files, header/footer/index.php (as they are used throughout my site) but it still didn't work.

    How do i get it to work on the inner pages then?
     
    Mafia Penguin, Apr 26, 2011 IP
  5. artus.systems

    artus.systems Well-Known Member

    Messages:
    87
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    103
    #5
    Please change the path of jquery to
    <script type='text/javascript' src='<?php echo get_bloginfo('siteurl')?>"/wp-includes/js/jquery.js?ver=1.4.4";'></script>

    this should work
     
    artus.systems, Apr 26, 2011 IP
  6. Mafia Penguin

    Mafia Penguin Peon

    Messages:
    64
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Didn't work. :/

    For some reason whenever i give that piece of java-script code a source it refuses to work at all.

    I tried what you recommended, and tried the following after looking around online...
    <script type="text/javascript" src="<?php bloginfo('site'); ?>/wp-includes/js/jquery/jquery.js" > 
    PHP:
    Not sure what's going wrong here 2bh, it seems right.
     
    Mafia Penguin, Apr 26, 2011 IP
  7. artus.systems

    artus.systems Well-Known Member

    Messages:
    87
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    103
    #7
    artus.systems, Apr 26, 2011 IP