Jose Pardilla

Hi,

You just missed a tiny step, when you insert the pictures in the post, look for an option that makes them link directly to the jpg file. Your are linking to an attachment, so fancybox can’t make them work.

Here you can see a little tutorial by graph Paper Press on how to upload galleries that will work on the plugin. ??

You have to search where you wordpress theme is inserting its javascript from, check first if the theme has an options page in the wordpress admin panel, it might have a field to edit the JS there. If it’s not the case which is probable, you will have to look in functions.php in the theme folder.

Here’s some example code, with the fancybox call from your theme and another one for you to edit. Or you can just leave one call if you prefer though.

var $j = jQuery.noConflict();

$j(document).ready(function() {

	var thumbnails = 'a:has(img)[href$=".jpg"],a:has(img)[href$=".JPG"]'; // variable with extensions we want to support
	$j(thumbnails).addClass("fancybox").attr("rel","fancybox"); // add class="fancybox" to all links that match the extension criteria

	// custom fancybox call
	$j("a.fancybox").fancybox({
		'autoScale': false,
		'titleShow': true,
		'titlePosition': 'inside',
		'centerOnScroll': true,
		'hideOnContentClick': false
	});

	// Original fancybox call from theme
	$j("a.full").fancybox({
		'autoScale': false,
		'titleShow': true,
		'titlePosition': 'inside',
		'centerOnScroll': true,
		'hideOnContentClick': false
	});

});

$j(document).bind("contextmenu",function(e){
	return false;
});

Hi,

This is an interesting question, maybe it would even be a nice option for the fancybox for wordpress plugin but i don’t want to add too many confusing options unless i’m sure it will be helpful.

I could make a little plugin that uses jQuery to hide all except the first image, but i can’t say when i’ll have time to work on it.

For a temporal fix, though, you could try something more rudimentary.

Using the fancybox for wordpress plugin i assume you already have the gallery working and you need to hide all but one image.

A little CSS that hides all images uploaded to your posts, adding this to your themes style.css:

// Hide images from posts
.entry-content a img{display:none}
.show{display:block!important}

Now all images linked in your posts would be hidden and when you create a post you would have to manually edit the HTML of one of the images adding class=”show” to it. That way only that picture would show.

Problem is that this is a bit invasive and i would not recommend it unless you are desperate or you only needed on a few posts.

Hi,

As i said by mail:

Your theme already includes fancybox, it’s loading the file: https://doodlegoose.com/wp-content/themes/fotofolio-landscape/js/fancybox/jquery.fancybox-1.3.0.pack.js

If you want to use the plugin you can disable that call but you will have to check that the theme doesn’t break when removing the duplicate fancybox.

Or you can disable the plugin and use the fancybox installation from your theme, and customize it if necessary editing the theme files. In the theme, fancybox might be loaded from the file functions.php.

———

Now relying your last email, fancybox itself doesn’t detect all images in your blog unless your theme’s implementation of fancybox tells it to do so.

You can do something like that with this JS code:

var thumbnails = 'a:has(img)[href$=".jpg"]';
jQuery(thumbnails).addClass("fancybox").attr("rel","fancybox");

This a short version of what fancybox for wordpress uses to auto-detect image links.

This way you would add the fancybox class to all links that contain a thumbnail and link to a bigger picture. Then you execute fancybox on the fancybox class:

jQuery("a.fancybox").fancybox();

Then just manually configure any settings you want following this documentation. https://fancybox.net/api

Hi,

This option is not yet in the options page because it requires a newer fancybox version, the plugin still uses and older one. This and a lot of new options are coming soon in a future update. ??

I think the problem is still being caused by an ads script but i can’t help without digging further into the source files.

With a link to the page where you are trying this, i could take a look and let you know if there’s anything wrong.

In future versions of the plugin i’m planing to add an option so that additional fancybox calls can be done, which might help you with this as well.

You have jQuery loaded twice. You should remove it from the theme files, or even better, load it with wp_enqueue_script() (https://codex.www.ads-software.com/Function_Reference/wp_enqueue_script) from the theme’s functions.php file.

There’s an additional jQuery call that gives a 404 (file not found) because it’s loaded with out a full URL: <script src="jquery.min.js" type="text/javascript"></script>. That should go away as well, but since there’s no url path i can’t tell if it’s loaded by the theme as well or by another plugin.

Hope that helps.

Hi,

In your themes folder look for js/header.js.php

If your theme installation is up to date you should see this:

jQuery(document).ready(function($) {

$('.multi-sidebar').tabs();

<?php if (!function_exists('pixopoint_menu')) : ?>
$('.sf-menu').superfish({autoArrows: true, speed: 'fast', dropShadows: 'true'});
<?php endif ?>

<?php if (is_singular()) : ?>
$('#commentform').validate();
<?php endif ?>

<?php do_action('arras_custom_scripts') ?>

});

You can try to replace with:

jQuery(document).ready(function($) {

jQuery('.multi-sidebar').tabs();

<?php if (!function_exists('pixopoint_menu')) : ?>
jQuery('.sf-menu').superfish({autoArrows: true, speed: 'fast', dropShadows: 'true'});
<?php endif ?>

<?php if (is_singular()) : ?>
jQuery('#commentform').validate();
<?php endif ?>

<?php do_action('arras_custom_scripts') ?>

});

That might help.

Open file youtube-with-fancy-zoom.php and comment line 184:

Replace:

$g_ywfz_pp = $g_ywfz_pp . '<script type="text/javascript" src="'.$g_ywfz_pluginurl.'includes/jquery.min.js"></script>';

With:

//$g_ywfz_pp = $g_ywfz_pp . '<script type="text/javascript" src="'.$g_ywfz_pluginurl.'includes/jquery.min.js"></script>';

I have also let the author know about this so he can fix it in future versions of his plugin: https://www.ads-software.com/support/topic/plugin-youtube-with-fancy-zoom-plugin-should-use-wp_enqueue_script?replies=0#post-1892563

Only thing left i can think of is that the theme’s js doesn’t support current jQuery version, the version included by the theme, 1.2.1, is quite old actually. Being a premium theme they really should be able to help you with that.

Other option although less likely to help is try disabling other plugins that may interfere.

If none of that helps you can also contact me at [email protected] and i can take a look at the whole blog and get it updated and fixed for a reasonable fee.

Adding the code i mentioned to the header won’t help because you don’t need to make sure jquery loads – it’s already loading twice and you need to make sure it loads only once.

You should undo that change in the header and do the following:

You have to remove the jquery script from the footer, so take a look at footer.php and look for this:

<script type="text/javascript" src="https://www.ho1designs.com/wp-content/themes/flashnews/includes/js/jquery-1.2.1.pack.js"></script>

If you can’t find that, there might be a PHP include or function that prints the scripts, in which case you should try luck searching in functions.php

When you find the line instead of just removing you may want to replace it with <?php wp_enqueue_script("jquery"); ?> so that jquery is still loaded even if you stopped using plugins in the future.

PS: Sorry i misspelled the function name, it is wp_enqueue_script()

Hi,

At first i was thinking of two possibilities, one being that it is caused by some options in the fancybox call with null value.

I’m uploading 2.7.5 with a fix that makes this cleaner by entirely omitting that option if not needed, which might help in your case.

But i’ve also noticed in your site’s source code a second call to jquery in the footer, with the following url: https://www.ho1designs.com/wp-content/themes/flashnews/includes/js/jquery-1.2.1.pack.js

jQuery can’t be loaded twice in a website: To prevent jQuery being called several times by plugins and themes, WordPress has a function called wp_script_enqueue() of which you can further read here for example: https://digwp.com/2009/06/including-jquery-in-wordpress-the-right-way/

You will have to remove that from the theme’s source files (might be in footer.php) and contact the theme author to fix it in future releases of the theme.

There’s a setting for this in the options page but i’ve tried now on my blog and didn’t work, so i’ll check this method instead.