Getsimple 3.1 Script/ Style queuing

[n00dles101]

Hi All,

For the next release of GetSimple 3.1 we are introducing Script and Style queuing on the system to allow Theme and Plugin writers to include your own Javascript and styles easily with your plugin distributions.

This will also give us a standard way of loading standard script such as JQuery, JQuery-UI, fancybox etc... and ensure that only one copy of each is loaded.

GetSimple 3.1 comes preconfigured with the following scripts and styles preconfigured ready for queuing on your pages.

Scripts

• jquery - CDN version of Jquery
  
• jquery-ui - CDN version of JQuery UI
  
• fancybox - Fancybox lighbox script
  
• getsimple - GetSimple site Javascript
  

Styles

• getsimple - Getsimple Site CSS
  

By default Jquery, Fancybox & Getsimple scripts and the Getsimpel Stylesheet are loaded on the back-end pages.

We recommend that if you are including your own scripts and styles that you store them in a seperate folder in your plugin folder, /my_plugin_folder/js for your javascript files /my_plugin_folder/css for your stylesheets

Scripts

To register your script with the system use the following in your plugin.

Code:

register_script($handle, $src, $ver, $in_footer=FALSE)

Where
$handle = unique name for your script.
$src = src location of your script.
$ver = version of your script file
$in_footer = whether to load the script after the footer.

So for example to register a script from your plugin folder use:

Code:

register_script('myscript', $SITEURL.'plugins/myplugin/myscript.js', '0.1', FALSE);

To load the script for use on the back-end pages you need to queue it.

Code:

queue_script('myscript', GSBACK);  
// use GSFRONT to load a script with your theme, GSBOTH for theme and Admin

If your plugin requires say JQuery on the frontend just queue it

Code:

queue_script('myscript', GSFRONT);

Styles

Styles are registered and queued in the same way as scripts.

Code:

register_style($handle, $src, $ver, $media)

Where
$handle = unique name for your style.
$src = src location of your style.
$ver = version of your file
$media = Media type for CSS file

Then just queue your style for use with the system

Code:

queue_style('mystyle', GSBACK);  
// use GSFRONT to load a script with your theme, GSBOTH for theme and Admin

Themes

Theme writers should also register scripts/styles instead of hardcoding them into the theme as we can ensure that only one copy of the scripts are loaded.



Please let us know if you any suggestions or comments on the new system .

Mike...

[mikeh]

Hi All,

For the next release of GetSimple 3.1 we are introducing Script and Style queuing on the system to allow Theme and Plugin writers to include your own Javascript and styles easily with your plugin distributions.

This will also give us a standard way of loading standard script such as JQuery, JQuery-UI, fancybox etc... and ensure that only one copy of each is loaded.

GetSimple 3.1 comes preconfigured with the following scripts and styles preconfigured ready for queuing on your pages.

Scripts

• jquery - CDN version of Jquery
  
• jquery-ui - CDN version of JQuery UI
  
• fancybox - Fancybox lighbox script
  
• getsimple - GetSimple site Javascript
  

Styles

• getsimple - Getsimple Site CSS
  

By default Jquery, Fancybox & Getsimple scripts and the Getsimpel Stylesheet are loaded on the back-end pages.

We recommend that if you are including your own scripts and styles that you store them in a seperate folder in your plugin folder, /my_plugin_folder/js for your javascript files /my_plugin_folder/css for your stylesheets

Scripts

To register your script with the system use the following in your plugin.

Code:

register_script($handle, $src, $ver, $in_footer=FALSE)

Where
$handle = unique name for your script.
$src = src location of your script.
$ver = version of your script file
$in_footer = whether to load the script after the footer.

So for example to register a script from your plugin folder use:

Code:

register_script('myscript', $SITEURL.'plugins/myplugin/myscript.js', '0.1', FALSE);

To load the script for use on the back-end pages you need to queue it.

Code:

queue_script('myscript', GSBACK);  
// use GSFRONT to load a script with your theme, GSBOTH for theme and Admin

If your plugin requires say JQuery on the frontend just queue it

Code:

queue_script('myscript', GSFRONT);

Styles

Styles are registered and queued in the same way as scripts.

Code:

register_style($handle, $src, $ver, $media)

Where
$handle = unique name for your style.
$src = src location of your style.
$ver = version of your file
$media = Media type for CSS file

Then just queue your style for use with the system

Code:

queue_style('mystyle', GSBACK);  
// use GSFRONT to load a script with your theme, GSBOTH for theme and Admin

Themes

Theme writers should also register scripts/styles instead of hardcoding them into the theme as we can ensure that only one copy of the scripts are loaded.



Please let us know if you any suggestions or comments on the new system .

Mike...

Great job. Will this effect existing plugins?

[n00dles101]

no existing plugins will still be fine.

Going forward we want all plugins/theme must use the queing system.

[bandrzej]

no existing plugins will still be fine.

Going forward we want all plugins/theme must use the queing system.

Where is this querying system located in the default install? CDN is not allowed in my workplace, and it also breaks any SSL enabled sites by making a non-secure request.

[marrco]

CDN is not allowed in my workplace, and it also breaks any SSL enabled sites by making a non-secure request.

can't comment that cdn is not allowed in your workplace. That means ou can't see large part of the internet. About the SSL part you are right, you should call jquery via https (and that's supported) so:
http://ajax.googleapis.com/ajax/libs/jqu...ery.min.js
becomes
https://ajax.googleapis.com/ajax/libs/jq...ery.min.js

or if you prefer to load the latest 1.7.x you can use
http://ajax.googleapis.com/ajax/libs/jqu...ery.min.js
or the SSL via https copy at:
https://ajax.googleapis.com/ajax/libs/jq...ery.min.js

[Carlos]

CDN is not allowed in my workplace, and it also breaks any SSL enabled sites by making a non-secure request.

Add this to your gsconfig.php file:

Code:

# Disable loading of external CDN versions of scripts (jQuery/jQueryUI)
define("GSNOCDN",true);

[shawn_a]

stupid question

when I check my source code i see this

Code:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js?v=1.7.1"></script>

Is it supposed to be missing the protocol ?

[n00dles101]

Depending on the protocol used by your website, http, https etc, it will use the same protocol than your website is using.

caters for people using https

[timme]

Greate job !
As a hint: it's necessary to add a .htacess file in your plugin subfolders to allow the access of the style or javascript files via the browser.

Content of the .htaccess should look like:

Code:

Allow from all

[teazmo]

Greate job !
As a hint: it's necessary to add a .htacess file in your plugin subfolders to allow the access of the style or javascript files via the browser.

Content of the .htaccess should look like:

Code:

Allow from all

Hey timme! Thanks for pointing that out! Someone should add this hint to the wiki part.

teazmo