Support » Plugins » [Plugin: jQuery Lightbox] Encoding js options using wp_enqueue_script

  • I have an interesting url encoding issue using ‘wp_enqueue_script’ to apply options to the current version (1.3.5) of the jquery lightbox plugin:

    this code

    wp_enqueue_script('jquerylightbox', $path.'/jquery.lightbox.packed.js?download_link=false&show_linkback=false&text.info=Photo&text.closeInfo=Click anywhere outside image to close', array('jquery'), '1.3.5');

    translates into this on the page:

    <script type='text/javascript' src='[...]/wp-content/plugins/jquery-lightbox-balupton-edition/js/jquery.lightbox.packed.js?download_link=false&show_linkback=false&text_info=Photo&text_closeInfo=Click+anywhere+outside+image+to+close&ver=1.3.5'></script>

    ‘wp_enqueue_script’ is doing some url encoding of its own – although you can’t see it in this example because the forum is eating the ampersand conversions, the ampersands are in fact converted to “& # 3 8 ; ” and spaces become “+” (as you can see). Unfortunately, it also converts the dots between ‘text.info’ and ‘text.closeInfo’ to underscores. Strangely, it leaves alone the dots in the file path at the beginning and in the version info at the end of the string – it just eats the ones in the options part. I need the dots to apply the options to the page – how can I make sure they stay dots and won’t be converted to underscores?

    Is this a problem with my code, or with wp_enqueue_script, or with the jquery plugin?

    Note: The jquery plugin options are explained here:
    http://www.balupton.com/sandbox/jquery_lightbox/jquery_lightbox/readme.txt

    P.S. This forum is eating the encodings too 🙂 I’ve added some spaces to illustrate my point.

Viewing 1 replies (of 1 total)
  • If you’re still interested in an answer to this, I think I happened upon one when I was trying to fix another problem I ran into with this plugin.

    You can change the options you’re trying to change in the jquery.lightbox.js file, which look like this:

    // Options
    
    		constructed:		false,
    
    		src:				null,		// the source location of our js file
    		baseurl:			null,
    
    		files: {
    			// If you are doing a repack with packer (http://dean.edwards.name/packer/) then append ".packed" onto the js and css files before you pack it.
    			js: {
    				lightbox:	'js/jquery.lightbox.js',
    				colorBlend:	'js/jquery.color.js'
    			},
    			css: {
    				lightbox:	'css/jquery.lightbox.css'
    			},
    			images: {
    				prev:		'images/prev.gif',
    				next:		'images/next.gif',
    				blank:		'images/blank.gif',
    				loading:	'images/loading.gif'
    			}
    		},
    
    		text: {
    			// For translating
    			image:		'Image',
    			of:			'of',
    			close:		'Close X',
    			closeInfo:	'You can also click anywhere outside the image to close.',
    			download:	'Direct link to download the image.',
    			help: {
    				close:		'Click to close',
    				interact:	'Hover to interact'
    			},
    			about: {
    				text: 	'jQuery Lightbox Plugin (balupton edition)',
    				title:	'Licenced under the GNU Affero General Public License.',
    				link:	'http://jquery.com/plugins/project/jquerylightbox_bal'
    			}
    		},
    
    		keys: {
    			close:	'c',
    			prev:	'p',
    			next:	'n'
    		},
    
    		handlers: {
    			// For custom actions
    			show:	null
    		},
    
    		opacity:		0.9,
    		padding:		null,		// if null - autodetect
    
    		speed:			400,		// Duration of effect, milliseconds
    
    		rel:			'lightbox',	// What to look for in the rels
    
    		auto_relify:	true,		// should we automaticly do the rels?
    
    		auto_scroll:	'follow',	// should the lightbox scroll with the page? follow, disabled, ignore
    		auto_resize:	true,		// true or false
    
    		ie6:			null,		// are we ie6?
    		ie6_support:	true,		// have ie6 support
    		ie6_upgrade:	true,		// show ie6 upgrade message
    
    		colorBlend:		null,		// null - auto-detect, true - force, false - no
    
    		download_link:	true,		// Display the download link
    
    		show_linkback:		true,	// true, false
    		show_info:			'auto',	// auto - automaticly handle, true - force
    		show_extended_info:	'auto',	// auto - automaticly handle, true - force	
    
    		// names of the options that can be modified
    		options:	['auto_scroll', 'auto_resize', 'download_link', 'show_info', 'show_extended_info', 'ie6_support', 'ie6_upgrade', 'colorBlend', 'baseurl', 'files', 'text', 'show_linkback', 'keys', 'opacity', 'padding', 'speed', 'rel', 'auto_relify'],

    In order to make the changes to the jquery.lightbox.js file appear on your site, however, you first have to open up the jquery-lightbox.php file and change:
    wp_enqueue_script('jquerylightbox', $path.'/jquery.lightbox.packed.js', array('jquery'), '1.3.5');

    to:
    wp_enqueue_script('jquerylightbox', $path.'/jquery.lightbox.js', array('jquery'), '1.3.5');

    and the changes should be reflected.

Viewing 1 replies (of 1 total)
  • The topic ‘[Plugin: jQuery Lightbox] Encoding js options using wp_enqueue_script’ is closed to new replies.