I don’t know if you already resolved this, but, here it the solution that worked for me :
– first, upload your fancybox files into your theme directory and link it in your theme (in header.php `<link type=”text/css” rel=”stylesheet” href=”<?php bloginfo(‘template_url’); ?>/js/fancybox/jquery.fancybox-1.2.6.css” />
<script type=”text/javascript” src=”<?php bloginfo(‘template_url’); ?>/js/fancybox/jquery.fancybox-1.2.6.js”></script>)`) – as you can see, I uploaded the fancybox files in js directory.
– second, go to plugin admin > gallery > options > effects, and from dropdown menu select “Custom” and in textfield enter this: class=”myfancybox” rel=”%GALLERY_NAME%”.
– third, in header (between head tags) enter JQuery inline code, like this:
<script type='text/javascript'>
$(document).ready(function() {
$("a.myfancybox").fancybox({ 'zoomSpeedIn': 500, 'zoomSpeedOut': 500, 'overlayShow':true,'overlayOpacity':0.3 });
});
</script>
Inside fancybox function there are options like zoomSpeedIn and many other options (check FancyBox site for list of all options) which you can modify …
Hope this helps,
Bye
Anydog,
Thanks for taking the time to spell this out. Very clear and very helpful!
Scott
Got partway there but it’s not quite working. Some of my goofs may help others get this far, and maybe someone can help get me the rest of the way!
1. I mistakenly loaded the files from the FancyBox WP plugin. Fixed that and downloaded from http://fancybox.net/ instead. Put the fancybox folder into wp-custom/themes/my-theme/js.
2. Edited my theme header.php file to add
<link type="text/css" rel="stylesheet" href="<?php bloginfo('template_url'); ?>/js/fancybox/jquery.fancybox-1.2.6.css" />
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/fancybox/jquery.fancybox-1.2.6.js"></script>
This didn’t work ‘cuz FancyBox is now up to 1.3.0; edited the above.
3. As you said,
go to plugin admin > gallery > options > effects, and from dropdown menu select “Custom” and in textfield enter this: class=”myfancybox” rel=”%GALLERY_NAME%”
4. As you said, added the JQuery inline code between the <head> tags. I’m assuming this was to be in my theme header.php. So my header.php now has
<!-- to use fancybox with nextgen gallery per http://wordpress.org/support/topic/315052 -->
<link type="text/css" rel="stylesheet" href="<?php bloginfo('template_url'); ?>/js/fancybox/jquery.fancybox-1.3.0.css" />
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/fancybox/jquery.fancybox-1.3.0.js"></script>
<script type='text/javascript'>
$(document).ready(function() {
$("a.myfancybox").fancybox({ 'zoomSpeedIn': 500, 'zoomSpeedOut': 500, 'overlayShow':true,'overlayOpacity':0.3 });
});
</script>
And the NG gallery is displayed using the WP default. 🙁
I’m still working on it, but any suggestions will be appreciated! Will post here if I figure it out.
OK, figured it out! My theme doesn’t use JQuery. So I had to add the following line to the header prior to the FancyBox script calls:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.1.min.js"></script>
WORKS!
One more bit of info I discovered … the “zoomspeed” parameters are no longer used with the current version of FancyBox. See http://fancybox.net/api for the up-to-date ones.
Anydog, thanks again for posting this solution — I wouldn’t have known where to start!
Hi you all!
Did I get you right, that you did NOT install one of the several “FancyBox for WordPress” Plugins but made it to make ngg run the original js files from http://fancybox.net ?! If so (I follwed McDonna steps three times but the effect would only show up with one of the plugins installed, so to speak: alle the inserted lines didn´t effect at all): does your solution support the mousewheel option ?! (-> “If the mouse wheel plugin is included in the page then FancyBox will respond to mouse wheel events as well”)
Keen on your answers! Thanks, bye, Sebastian
– second, go to plugin admin > gallery > options > effects, and from dropdown menu select “Custom” and in textfield enter this: class=”myfancybox” rel=”%GALLERY_NAME%”.
I don’t understand this part. WHERE is the Plugin admin? I’ve looked everywhere. THANKS for helping out a rookie!
©
Why is it after you give up and ask for help, that you invariably figure it out yourself? For anyone who is stuck like I was:
In the NextGen Gallery menu on the left, bottom; Click “Options” and then the top tab “Effects.”
©
Sebastian,
Yes, I installed the original js files from fancybox.net; I did not install any FancyBox plugins.
And yes, it does work with the mouse wheel.
Hope this helps …
heya Anydog and McDonna
Just wanted to come back and say thanks! Between you both I managed to get this effect to work and it looks great.
cheers
©
