Wordpress and jquery

admin

Administrator
Staff member
I have never messed with wordpress much and am real stuck. I am trying to add a video playlist/gallery via jquery. Not a wordpress plugin. I am not even sure what I am doing wrong and am hoping someone could help me through it please. The site is here, <a href="http://okaysewwhat.com/" rel="nofollow noreferrer">http://okaysewwhat.com/</a> it is just a skeleton now since this does not work yet.
The jquery plugin I am using is this, <a href="http://www.geckonewmedia.com/blog/2009/8/14/jquery-youtube-playlist-plugin---youtubeplaylist" rel="nofollow noreferrer">http://www.geckonewmedia.com/blog/2009/8/14/jquery-youtube-playlist-plugin---youtubeplaylist</a>

Ok so I have inside the header.php of wordpress, added this to call the stylesheet for the youtube part,

Code:
&lt;link rel="stylesheet" type="text/css" media="all" href="&lt;?phpbloginfo('stylesheet_url'); ?&gt;/youtube.css" /&gt;

then after that is this part, you can see what I added,

Code:
    &lt;?php


        wp_enqueue_script("jquery");

        if ( is_singular() ) wp_enqueue_script( 'comment-reply' );



        wp_head(); 

        global $options;
        foreach ($options as $value) {
             if (get_settings( $value['id'] ) === FALSE) { $$value['id'] = $value['std']; } else { $$value['id'] = get_settings( $value['id'] ); }
        }
    ?&gt;

&lt;script src="&lt;?php bloginfo('template_directory'); ?&gt;/jquery.youtubeplaylist.js" type="text/javascript" charset="utf-8"&gt;&lt;/script&gt;


&lt;script type="text/ecmascript"&gt;
jQuery.noConflict();

    $(function() {
        $("ul.demo2").ytplaylist({addThumbs:true, autoPlay: false, holderId: 'ytvideo2'});
    });

&lt;/script&gt;

Inside index.php I added, right under the wordpress main_col div,

Code:
&lt;?php include (TEMPLATEPATH . '/tube.php'); ?&gt;

and all that is in tube.php is the list of vids,

Code:
&lt;code&gt;
    &lt;div class="yt_holder"&gt;
    &lt;div id="ytvideo2"&gt;&lt;/div&gt;
    &lt;ul class="demo2"&gt;
        &lt;li&gt;&lt;a href="http://www.youtube.com/watch?v=QBBWKvY-VDc"&gt;Video 1&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="http://www.youtube.com/watch?v=ZXMQqLnRhRI"&gt;Video 2&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href="http://www.youtube.com/watch?v=Wvo-g_JvURI"&gt;Video 3&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
&lt;/div&gt;
&lt;/code&gt;

I hope this is not too convoluded, I aploogize, I am just so lost in this I do not understand it anymore. All that displays is a list like you would get from the ul above.<br>
And firebug gives me the error

Code:
Firebug's log limit has been reached. %S entries not shown.     Preferences  
$ is not a function
okaysewwhat.com()okaysewwhat.com (line 40)
[Break on this error] $(function() {\n

which I dont get either. I would appreciate any tips guys, thank you so much.