[Plugin: jQuery Lightbox] Encoding js options using wp_enqueue_script

  • ctree

    (@ctree)


    15 years, 4 months ago

    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)
  • zkorwin

    (@zkorwin)

    15 years, 2 months ago

    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.