====== About the FoxyBox ====== Note: What we're calling "FoxyBox" is a ~~slightly~~ modified version of Cody Lindley's [[http://jquery.com/demo/thickbox/|Thickbox]]. Thickbox is amazing, but we modified it to make it easier to use with FoxyCart. (Defaults to iframe display mode. Default height and width. Removed much of the unnecessary code to keep the filesizes smaller. Etc.) ====== Modifying FoxyBox ====== ===== Changing the FoxyBox Size ===== To change the size of your cart, there are two methods. ==== The Easy Way ==== === 0.3.1+ === Just add some code to the '''' section of your template, //above// your ''foxycart_includes.js'' call:

You can override this with the method below if you really want to. === 0.3.0 and earlier === Pass in ''x:width'' and/or ''x:height'' parameters in your cart links like this (line break added for legibility):



	Buy Me!

Or, if you're using a form:

The ''x:'' prefix effectively tells the cart to ignore the value. Otherwise it would be added as a product option. ===== Changing the Loading Image ===== This is quite easy as well. First you should grab an image from something like [[http://www.ajaxload.info/|ajaxload.info]] and stick it on your own server. Then define ''fc_tb_pathToImage'' in your '''', //before// your ''foxycart_includes.js'' call:

This could easily be combined with the above to yield something like this:

====== Using FoxyBox with Dynamically Loaded Links ====== If you're adding ''a.foxycart'' elements after the page loads (via AJAX, for example), the new elements won't have the foxybox behavior attached to the ''onclick'' event. You can re-add the foxybox actions to your elements by running ''fc_tb_init('a.foxycart');'' after any new elements are added. Note that if you call ''fc_tb_init()'' multiple times it'll load the thickbox multiple times (which is bad and looks weird), you might want to strip the ''onclick'' events that get added with each init prior to running the init again. So it'd look like this:


$j('a.foxycart').unbind('click');
fc_tb_init('a.foxycart');

====== Using FoxyBox with Image Maps ====== FoxyBox normally only binds to links and forms. To bind the FoxyBox to image maps, simple add this to your head section, below the calls to ''foxycart_includes.js'' and any other FoxyCart javascript you may be calling: