Develop Reference

Where should custom javascript be injected into a Wordpress theme?

I am helping a friend build a wordpress site using a purchased custom theme as his parent theme. There is also a child theme.
I've written some javascript to listen for clicks on specific links, and to change CSS in response to them. I can make this work in another environment, but we're trying to figure out how to get it to execute in Wordpress.
We have tried putting it in the index.php (most logical source to me, since that's to me that makes the most sense, but obviously WordPress works differently).
So all I am trying to figure out is, where in wordpress do you put the script tag (where you put code, not referencing jQuery we already have that)?

the index.php script will only load the WordPress framework and run it, you need to add your js code in the theme/template files.
a little quote from the official word press site:
JavaScript in Template Files
The safe and recommended method of adding
JavaScript to a WordPress generated page, and WordPress Theme or
Plugin, is by using wp_enqueue_script(). This function includes the
script if it hasn't already been included, and safely handles
dependencies.
you can read more here
In my opinion, the best is that you should create a js file with the code you want to run and upload to your theme/template folder, and then add it with a script tag as the link i've provided explains.
And my advice is to not embed the code directly in the template file but load it from a javascript file.
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/pathto/yourscript.js"></script>

You can do that in different ways:
Including the script in your footer for example
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/pathto/yourscript.js"></script>
Or using the wp_enqueue_script function, more info.

jQuery tabs not working properly in Magento

I've been trying to create a set of tabs in Magento using the following plugin:
http://os.alfajango.com/easytabs/
After setting it all up, adding the HTML, CSS & javascript the tabs seem to not work correctly instead they sort of act like anchor points on the page.
I've added this to the header of the site:
<script type="text/javascript" src="/javascripts/jquery.hashchange.min.js"></script>
<script type="text/javascript" src="/javascripts/jquery.easytabs.min.js"></script>
And I believe all the files are in the correct place / linked to in the right way.
The jQuery isn't in the above because when I added it to the header there were loads of conflicts as I believe Magento already includes the jQuery library.
Here's an example of the tab so far:
http://bit.ly/1hT1Xa0
Thanks for any help :)

You have to invoke easytabs by adding
$('#tab-container').easytabs();
// try with no conflict if not working
jQuery.noConflict();
jQuery('#tab-container').easytabs();
see more details tab at demo site.

jQuery breaking other javascript

The CMS I use (Liferay) is dependent on jQuery to do a lot of things.
When I recently added new functionality to our site through the use of fancybox, I find that this breaks all other jQuery functionality on the page. If I take out the initial jQuery library import I use for fancybox, the other functionality works, but fancybox does not. Here is the code in question:
<!-- Add jQuery library -->
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
I've tried adding jQuery.noConflict(); to various parts of the code, but to no avail. I feel like this should be the correct solution, I'm just not sure exactly where to put it. Unless someone has a different possible solution, while keeping the fancybox functionality. I've been stuck on this awhile now, I'm kind of at a loss of what to try next.
Thanks in advance,
Noah
EDIT: Here is a pastebin of the page source code: http://pastebin.com/NA5WKrMW#. Line 81 is where I'm trying my jQuery import for fancybox purposes.

You have to add the noConflict right after the script tag:
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
var jQuery_latest = $.noConflict(true);
</script>
EDIT:
Make sure you're initializing fancybox using the correct jQuery:
jQuery_latest(document).ready(function() {
jQuery_latest(your_element_here).fancybox();
});

javascript conflict in Joomla

Can anyone help I am getting what seems to be conflicting Javascript in a Joomla site I am making. When the following scrip is added to the site I cannot add a listing in mosets tree
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js" type="text/javascript"></script>
If i take this code out the listing works as it should in Mosets tree but the Slider and other items are effected on the home page
http://mybridespace.co.uk
I have tried no-conflict script but this doesn't seem to work well.
Any ideas would be appreciated.

jQuery interfering with Twitter bootstrap carousel

While creating a website using Twitter Bootstrap's carousel, it seems that some scripts are interfering from it auto-sliding when the website is loaded. But it works fine once you click one of the controls in the carousel. It then slides every 5 seconds, the default time.
I'd rather not post a jsfiddle because of the size, so the production website will have to do (not sure if this is against the rules - otherwise I'll delete it).
Now there are some plugins I'm using (Newsletter and Contact Form 7) which also include scripts from jQuery. I'm not sure how to implement the noconflict from jQuery, or if it will even help.
Can anyone spot the problem?

I got this working by saving a copy of your site to my local drive, I moved the bootstrap .js file to the bottom of the file right above </body> and called the carousel manually so it ends up looking like this
<script type="text/javascript" src="./PRO-Intermediair Your Next Step!_files/bootstrap.min.js"></script>
<script type="text/javascript">
$('.carousel').carousel();
</script>
</body></html>
edit
I posted a copy so you can see http://tctel.com/pro/