Description
FancyBox for WordPress is a WP plugin that uses jQuery to display images when clicked, without reloading the page. It uses FancyBox by Janis Skarnelis.
Instalation
- Decompress fancybox-for-wordpress.zip to your desktop
- Upload fancybox-for-wordpress folder to the plugins directory in your blog’s FTP, like this:
yourblog.com/wp-content/plugins/fancybox-for-wordpress/
- Activate the plugin
How to use the plugin
Actually you’re done! Once activated, each time you load your blog, the plugin will your search for direct links to JPG, PNG or GIF images and will apply the effect on them. The FancyBox effecto won’t be applied to text link though, only images linking to images.
More info
For a changelog, todo list, and more information, go to the plugin page in WordPress.org.
Images Demo
Here’s simple WordPress gallery, no code has been edited, the FancyBox for WordPress looks the code generated by WordPress and figures the rest out based on the options you set in the plugin’s admin page.
Content Demos
And here there are a few links featuring other FancyBox uses: Iframe content, Inline content and Ajax calls. Below each link you will find the code used to make it happen.
This link displays some Ajax data
<a class="fancybox" href="../../../descargas/ajax.txt">This link displays some Ajax data</a>
This link opens another page in an Iframe
<a class="fancybox iframe" href="http://www.google.com/">This link opens another page in an Iframe</a>
This link shows some inline content in a FancyBox window
<a class="fancybox" href="#testube">This link shows some inline content in a FancyBox window</a>
<div style="display:none" id="testube">
<object width="425" height="344">
<param name="movie" value="http://www.youtube.com/v/01C4RPEinM4&hl=es&fs=1&color1=0x006699&color2=0x54abd6"></param>
<param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube.com/v/01C4RPEinM4&hl=es&fs=1&color1=0x006699&color2=0x54abd6"
type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed>
</object>
</div>
If you want to keep up to date with this plugin you can follow me on Twitter
Download
FancyBox for WordPress at WordPress.org Plugins






@Th3 ProphetMan
I disabled all plugins and tried three different themes. No success
Looks like that was it!!
removed!
Can you optimize the js and css please?
for faster site loading. perhaps make only one js file and only one css file and compress them, would be great!
@Tobi: I don’t know what else might be causing it but i think it may have to do with Fancybox itself, you can search here or ask if someone has seen something similar before http://groups.google.com/group/fancybox
Perhaps this can help you a little bit:
http://groups.google.com/group/fancybox/browse_thread/thread/8a7a724b5d6166d7#
Hi there,
First of all thank you to bring the power of fancybox into Wordpress. Such a great plugin! However, i experienced a little problem with IE 8.
Fancybox pop up normally and then close leaving nothing on the screen except the image title.
I’ve got this error :
[code]
Agent utilisateur : Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.0; WOW64; Trident/4.0; GTB6.3; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; .NET CLR 3.5.30729; .NET CLR 3.0.30618)
Horodateur : Wed, 30 Dec 2009 09:45:00 UTC
Message : '0.style' a la valeur Null ou n'est pas un objet.
Ligne : 1
Caractère : 8464
Code : 0
URI : http://www.madeinasia.be/wp-content/plugins/fancybox-for-wordpress/js/jquery.fancybox-1.2.6.min.js?ver=2.9
[/code]
Any advices will be really appreciated.
Thanks in advance,
Jk_
Hi
I get this 404 request:
http://cyberbrahma.com/wp-content/plugins/fancybox-for-wordpress/js/javascript:false;
Can you please help me find out what is happening.
S.K
Hi There!
Thanks, i love this plugin!
I have a question, is there a way to get my iframe content to adjust to the screen? In the galleries tab, at the plugin settings, i can change the iframe size, but in pixels, is there a way to change is to “%”?
Thanks a lot!
Happy New Year
Von
How can I create a gallery?
wow, that’s just I needed!
thank you very much man!
cheers from istanbul…
Fancybox for Wordpress is working fine for me, except for iFrames.
The box opens, but there is no content – it’s just plain white. It doesn’t matter whether I use a local page or one from another site
Please can you give me some hints of where to start looking to fix this. I am using the latest version of yuor plugin.
Thanks
Gracias por su plugin!
Sin embargo, encuentro un bug de que aparecen blancos espacios en ambos lados del “caption box” cuando haga clic en los imagenes. Si es posible prestar una mirada en easta página: http://www.xn--pdr21bi4ifz5d.com/official-press/201001085658.htm y arreglarlo? Gracias.
does anyone know how to size the pop out Content boxes?
Hi,
I have installed your plugin but I don’t understand why it’s doesn’t work on my blog.
Exemple : http://www.lapommecroquee.com/2009/12/31/le-site-des-12-jours-de-cadeaux-itunes-prend-de-lavance/
When I clic on the shoot screen, the biggest image open on a new window…
Thanks for your help
Are there any options for the iframe?
for example can I change the width or height?
How do I get it to show the post title instead of the image title?
Is there a way to load the fancybox plugin on page load? I’ve been searching around for this but not being much of a coder I can’t seem to figure out the necessary javascript to get the page to get Fancybox to load on page load.
I’ve been checking out this page, but how would I implement this on a wordpress site?
Oops sorry, here is the link:
http://stackoverflow.com/questions/807271/how-to-launch-jquery-fancybox-on-page-load
Hi — I am using fancybox plugin and I was wondering if it is possible to display multiple image galleries on a single page…I see some people talking about doing this on the google thread about this plugin but there is no clear documentation describing how to implement…
is this possible to do? If so can someone help me out with a link to some documentation or instructions?
Thanks so much!
AJ
I had fancybox working on my site (using the Mystique theme). I changed to a different theme, then changed back and now I can’t get fancybox to work on any theme. I tried deactivating/activating, and uninstalling/reinstalling. Can anyone help?
Thanks!
Hi!
I am using your plugin and I made Croatian translation for it. You can contact me or download translation from my blog.
Bye.
I would love to see the option to change the title position from outer to inner (any maybe overlap)! I find it much cleaner look and it is a feature of the original plug in.
Above are some examples of code to use for inline and iframe content, but where do you put it in Wordpress? I’ve tried putting it in the Edit image area and in the post html no luck.
What I want to do is link a thumbnail to a website or a Vimeo video. Images display fine.
I’m using a theme from Graph Paper Press.
Thanks! Love the plugin! Hope I can get it to work.
How to set the Image Title inside or over?
Is it possible?
Hi, this is a really nice plugin!
Is there a chance to integrate a donwload link to the image that is currently viewed inside fancybox? I know that you could just right-click and download, but you know users!
Thanks for your answer and once again: really a nice job!
Best regards Sascha
Do rephrase my question… Is ist possible to add HTML Code to the title? Or is there another way of adding a downloadlink? Of course it would be best not to touch the plugin due to update issues…
Thanks in advance for your answer
Sascha
Nice plugin, but I think I found a bug: when selecting opacity on a system with a different locale set in PHP, the opacity 0.3 is translated by PHP to 0,3 which fails in the JS (“‘overlayOpacity’: 0,1″)
I solved the problem by changing $overlayArray to use string instead of floats.
How do you resize the iframe window??
Thanks for the plugin. One question – When I try to use the fancy box close function (parent.$.fancybox.close();) to close an iframed page, nothing happens.
Any ideas?
The plug-in didn’t work when I installed it (it didn’t do a single thing, the code of the plug-in didn’t get inserted). This fixed it for me, add:
“”
to your header.php (before the tag).
The plug-in needs a ‘hook’ to start, it solved the problem for me!
The plug-in didn’t work when I installed it (it didn’t do a single thing, the code of the plug-in didn’t get inserted). This fixed it for me, add:
*
to your header.php (before the tag).
The plug-in needs a ‘hook’ to start, it solved the problem for me!
* DON’T include the FIRST ‘.’ !! I had to put it in because otherwise the comment gets stripped
Is there a way to put the image title over insteed of under ?
over the image, bottom
Hey’a,
Thanks for the great plugin. I use it on a number of sites I do, but on the latest one, I have a pickle!
How can I get the fancybox to resize according to a DIV/iframe size rather than the predetermined size in the settings?
Hi.
I tried to use your PlugIn for an WP-Login and it works, but i want to resize because it didn’t do it automatic.
Here is my code, what can I do to (auto) resize?
LogIn
Username
Passwort
Merken
<input type="submit" name="wp-submit" id="wp-submit" value="” tabindex=”100″ />
<input type="hidden" name="redirect_to" value="” />
Can you help? Thanks…