Including jQuery FancyBox

  • Paolo

    (@mazta)


    14 years ago

    I can’t make FancyBox work.

    <?php wp_enqueue_script("jquery"); ?>

<?php wp_head(); ?>

<script type="text/javascript" src="./fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
	<script type="text/javascript" src="./fancybox/jquery.fancybox-1.3.4.pack.js"></script>
	<link rel="stylesheet" type="text/css" href="./fancybox/jquery.fancybox-1.3.4.css" media="screen" />
	<script type="text/javascript">
		var $j = jQuery.noConflict();
		$j(document).ready(function() {
			$j("a[rel=example_group]").fancybox({
				'transitionIn'		: 'none',
				'transitionOut'		: 'none',
				'titlePosition' 	: 'over',
				'titleFormat'		: function(title, currentArray, currentIndex, currentOpts) {
					return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';
				}
			});
		});
	</script>

    Here I called the wp_enqueue_script before the wp_head and FancyBox jQuery JavaScript after that. I also put the jQuery into “no conflict” mode to be safe. Then paste the FancyBox files in the Theme Folder.

    <a rel="example_group" href="#.jpg"><img class="size-thumbnail wp-image-158" title="pool" src="#.jpg" width="150" height="150" />

    In admin panel, after adding image I put rel=”example_group” on the link. I don’t know if im doing this right, newbie here.

    Appreciate your help.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter Paolo

    (@mazta)

    I believe it’s conflict, cause I have this Booking Calendar Plugin.
    If I put the FancyBox jQuery Javascript the Calendar disappears.

    You should use functions.php and action hooks to include your scripts.

    It’s probably a js error as you mention, maybe some plugin loads jquery wrong, instead of using wp_enqueue_Script. In that case jquery would be loaded twice causing the problem.

    Also, you should use wp_register_script & wp_enqueue_script for any js file you want to include, and do it from functions, that way your theme modifications can be cleaner and centralized in functions.php

    Thread Starter Paolo

    (@mazta)

    I only have a little knowledge on this, Please disregard the jQuery.

    Im using FancyBox Plugin but when I insert the Gallery it does now work, but it works in single images. Galleries images links to attachments.

    Any idea sir?

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Including jQuery FancyBox’ is closed to new replies.