Using multiple jQuery versions with Shopify

Sometimes you install plugins, addons and tweaks to Shopify which use specific versions of jQuery. Sometimes this breaks every other script written in a theme. I’m writting this as a note to myself mostly but may help others.

A good example in my case is working on a theme which uses jquery 1.4.2 for most of the theme’s goodies.

If you try to install the latest, let’s say fancybox it may use a newer version. Instead of fixing every function in the existing theme which you should do but many people can’t afford, you can try this.

		{{ 'jquery-1.7.2.min.js' | asset_url | script_tag }}

		 {{ 'jquery.fancybox.css' | asset_url | stylesheet_tag }}
		 {{ 'jquery.fancybox.pack.js' | asset_url | script_tag }}

		 {{ 'jquery.fancybox-thumbs.css' | asset_url | stylesheet_tag }}
		 {{ 'jquery.fancybox-thumbs.js' | asset_url | script_tag }}
		
		<script type="text/javascript">
		
		var jQuery_1_7_2 = $.noConflict(true); //open jquery 1.7.2 noconflict
		
		(function($) { //wrap with a function


			$(document).ready(function() {
				$(".various").fancybox({
					maxWidth	: 800,
					maxHeight	: 600,
					fitToView	: false,
					width		: '70%',
					height		: '70%',
					autoSize	: false,
					closeClick	: false,
					openEffect	: 'none',
					closeEffect	: 'none'
				});
			});


		})(jQuery_1_7_2); //close the jquery 1.7.2 wrapper function
		</script>