FancyBox

Fancybox is a popular Lightbox-effect based on jQuery. This plugin allows you to easily implement the Fancybox-effect on the HTML-content that you want.

FancyBox is a combination of JavaScript, CSS and some images that allow you to create a modal effect using the JavaScript framework jQuery. This Joomla! plugin integrates FancyBox in your favorite CMS Joomla!.

 

Joomla! extension

Details

PriceSee Packages
Current version 1.3.2 (Stable)
Requirements
Joomla! 2.5.0 or higher
Joomla! 3.0.0 or higher
PHP 5.2.8 or higher
DownloadLogin to access this download for free
SupportSupport Forum
LicenseGNU/GPL (General Public License)
This extension is also listed in the Joomla! Extension Directory

Screenshots

About FancyBox

FancyBox is written and maintained on the website fancyapps.com. All credits go to the original creators of FancyBox. If you like FancyBox, you can donate. Please do not donate to us, but to creators of FancyBox instead.

All work of FancyBox itself is the work of Janis Skarnelis, and holds his copyright.

Installation

  1. To install this plugin, download it from this page to your computer.
  2. Then install the ZIP file from within the Joomla! Administrator as a normal extension.
  3. Next go to the Plugin Manager to enable this system-plugin. It is listed as "System - FancyBox".

You do not need to download FancyBox from the FancyBox website.

Free for non-commercial use

Note that the license of the Fancybox v2 library (included with our plugin-version 1.3.0 and later) is free for non-commercial use. If you want to use Fancybox as a company, you are asked to pay a fee. See the Fancybox project site for more details. Yireo requires you no additional fee to run Fancybox in Joomla!.

Basic parameters

The plugin is ment for webdesigners and therefor requires knowledge of HTML. Within the plugin parameters you can find the following options:

  • HTML elements: List of elements that Fancybox should be applied on (required)
  • Hide on click: When enabled, the Fancybox modal box can be closed through a mouse-click (optional)
  • Enable mousewheel: When enabled, you can scroll the Fancybox modal box with the mousewheel (optional)
  • Transition: Which effect to apply on the appearance of the modal box (optional)
  • Speed: Which speed to apply on the appearance of the modal box (optional)

Instead of relying on specific HTML markup like a rel-attribute (which is used by many other modal effects), the FancyBox plugin allows you to configure specific HTML elements. You'll need to review your own HTML source-code to see which elements should be identified. In most cases, the FancyBox-effect needs an anchor-tag with a title and a link to be activated:

a.lightbox, a.product_image, a#my_image, a.simplelists_link, a[rel=lightbox]

For each element, a new jQuery-line is added to the source-code of the page.

Advanced parameters

Within the plugin settings, you can also find the following advanced parameters:

  • Options: Textarea allowing you to add additional parameters. Options are in the form of padding=20 - each option is on a new line.
  • Use Google API: Use the Google network to serve the jQuery library
  • Load CSS: Disable this, if you want to include the Fancybox CSS in your own template instead
  • Load jQuery: Disable this, if jQuery is already loaded by another extension
  • Load Fancybox, Mousewheel, Easing, etc: Disable this, if this feature is already loaded by another extension
  • Exclude components: List of components that Fancybox should not be applied on
  • jQuery namespace: Set to $j by default. Modify this, if this plugin conflicts with another jQuery-enabled
  • Content-type: Allowing you to load AJAX, movies and such as well

Why FancyBox?

The main reason for us to integrate FancyBox in a Joomla! plugin, is to offer a simple Lightbox-like effect for MageBridge, our bridge extension that integrates Magento in Joomla!. As an effort to bypass JavaScript-conflicts between MooTools and ProtoType, a third framework - jQuery - is introduced which does not conflict with neither MooTools nor ProtoType. jQuery is loaded in the compatibility mode.

So, the FancyBox was primarily designed to work with MageBridge, but it might serve other purposes as well.

Need help? Post on our forum

More extensions

GoogleTranslateGoogleTranslate
More control over your translations Less expensive than hiring translators Much faster than frontend translations

TweetSchedulerTweetScheduler
Social marketing requires you often to be online. But when running promotions, TweetScheduler allows you to post tweets in advance! Support for Twitter, Facebook and LinkedIn.

Google OptimizerGoogle Optimizer
Google Optimizer allows you to tune conversion by adding flags within various pages of your site. This plugin allows you to simply add Google Optimizer to Joomla!.

About Yireo

Yireo tries to help webdevelopers build successful Joomla! and Magento sites.

More about Yireo