how to work with scripts in wordpress

I have this 3 tabbed box in wordpress that I want to dispaly content in. The weird thing is that the box works perfect on my computer. I set the box up using wamp on the theme that I am working on. But when I upload the theme to the internet, the tabs stop working. I am using jquery to run the box. I think it has something to do with wp_head. Is there a special way to call the scripts in the head section so that it doesn’t interfere with wp_head?

I installed wamp on my computer. I installed wordpress and then purchased a theme here. I installed that theme into the wordpress that is running on my computer through wamp. I then downloaded the database for a site that is online right now. This allowed me to make an exact duplicate of the site on my computer. I then used that duplicate to modify the theme I purchased here to the owners specs. Just added some things she wanted. This is a friend of mine.

So her site running online and an exact duplicate of the site running on my computer through wamp.

I made a tabbed box to display posts. I used custom code found online to pull the posts from categories to display them in the tabbed boxes. the idea is that when you click the tab, it would display the post in that box. This is run by jquery. This all works on wamp.

The code works perfect on my computer, but when I upload it to the web, the tabs stop working. After hours of googling, I came to the conclusion that the wp_head() function must be causing the problem. I tried removing the wp_head to see what would happen. didn’t work, tried re uploading the code, didn’t work. I tried using something called
wp_enqueue_script as found on this site http://www.lost-in-code.com/platforms/wordpress/wordpress-using-javascript-libraries-with-your-plugin-or-theme/ didn’t work. The site I am talking about is http://www.wilsonwrites.com You can see the tabs on the homepage. It’s like the tabs.js file that runs the tabs isn’t working. You can download the tabs code that I am using here http://www.wilsonwrites.com/tabs.zip This zip file contains the actually demo of the code. I modified that code where needed to get it working for my needs.

SUMMARY

1. the tabs.js file isn’t running the tabs, this does work on my computer just not online

2. all the code needed to run the tabs is present. I just dragged and dropped from my computer to the themes folder online. If it works locally, it should work online. It doesn’t

3. After searching the codex and online. I have come to the conclusion that the wp_head() is loading jquery libraries in the wp_includes folder. This could be causing it. I have not been able to find a way around it.

4. Removing the wp_head from the header.php didn’t fix it.

5. I tried both bloginfo(‘template_directory’); and stylesheet_directory and then the absolute link to the files and that didn’t work.

6. I have found jquery code in the wp_includes folder. Tried using that instead of uploading the scripts to the js folder inside the theme folder. didn’t work.

7. Tried disabling all running plugins to see if that had anything to do with it. Didn’t work.

Thanks for taking the time to help.

This would make a very good tutorial for the next day of the designing wordpress series. How to run javascript. It seems to difficult

Post Reply

<strong></strong> to make things bold
<em></em> to emphasize
<ul><li> or <ol><li> to make lists
<h3> or <h4> to make headings
<pre></pre> for code blocks
<code></code> for a few words of code
<a></a> for links
<img> to paste in an image (it'll need to be hosted somewhere else though)
<blockquote></blockquote> to quote somebody