pogidude Posted October 21, 2013 Share Posted October 21, 2013 I don't know what the general stand is on this, but for me, I really like how in WordPress scripts and styles can be queued, and in the header and footer (via wp_head() and wp_footer() respectively) they are loaded with their dependencies sorted out. Then, anytime before the template is output, you can do a call to: wp_enqueue_script('script-name-id', '/url/to/script.js', array('dependency-script-id', 'jquery'), "version", true); and you can be sure that the script will be loaded AFTER "dependency.js" and "jquery.js" has been loaded. And oh, the last parameter specifies whether the script should be loaded in the <head> or in the footer (or wherever wp_footer() is in the theme). Now, I understand for many situations, this may seem like overkill especially if you are loading the same scripts/styles on all the pages. But there are situations where you need a script only for *that* page and don't want it loading on all other pages. if you're using only one view template to output your pages, then that means you'll need to create another view template which includes the specific script/style on this page. 1 Link to comment Share on other sites More sharing options...
Wanze Posted October 21, 2013 Share Posted October 21, 2013 I'm not sure I understand fully: With your qp_enqueue_script function, how do you solve the problem of loading a script only for a specific page? I think you still need an additional if? // Only load script for Page with name 'pw-rocks' if ($page->name == 'pw-rocks') $config->scripts->add('blub.js'); 1 Link to comment Share on other sites More sharing options...
applab Posted October 22, 2013 Share Posted October 22, 2013 Hi pogidude, This won't handle dependencies but will allow you to load scripts on per-page basis... In your master template place the following code <?php foreach($config->scripts->unique() as $file) echo "\n\t<script type='text/javascript' src='$file'></script>"; ?> In your partial templates add $config->scripts->append("/path/to/script.js"); You can also do the same with styles: // in master <?php foreach($config->styles->unique() as $file) echo "\n\t<link type='text/css' href='$file' rel='stylesheet' />"; ?> // in sub-template $config->styles->append("/path/to/style.css"); Link to comment Share on other sites More sharing options...
pogidude Posted October 23, 2013 Author Share Posted October 23, 2013 thanks @wanze and @applab. I do use $config->styles and scripts to add my stuff - unless I'm using "getThumb()" in the page (from the Thumbnails module). Here's one of the issues about using $config->styles/scripts to store your assets files http://processwire.com/talk/topic/4740-jqueryfancybox-script-loading-by-itself-in-frontend/ Basically, modules can inadvertently "add" styles/scripts to your frontend (especially autoload modules). In that thread above, I was pulling the body content (which used the getThumb() function) BEFORE the whole view template was loaded. Meaning getThumb() - which also instantiates Imagefield module which in turn loads the JqueryFancybox module - was run before the whole foreach($config->styles/scripts) thing. Anyway, this could probably be fixed with module creators doing something along the lines of: if(CHECK_IF_IN_ADMIN){ //load modules } but yeah, what I really would want is the dependencies thing. and also a way to specify whether the script should go in the *footer* or in the *head*. Link to comment Share on other sites More sharing options...
Martijn Geerts Posted October 23, 2013 Share Posted October 23, 2013 You can clean that array, before you gonna use it. Or you can make your own array. $cssfiles = new FilenameArray; $cssfiles->add("/site/templates/css/middle.css"); $cssfiles->append("/site/templates/css/last.css"); $cssfiles->prepend("/site/templates/css/first.css"); Link to comment Share on other sites More sharing options...
pogidude Posted October 23, 2013 Author Share Posted October 23, 2013 nice @martijn this one is new to me. how do you *clean* the $config->scripts array? Link to comment Share on other sites More sharing options...
Martijn Geerts Posted October 23, 2013 Share Posted October 23, 2013 $config->styles->remove("/path-of/other/styles/you/dont/want/file.css"); or : $config->styles->removeAll(); 1 Link to comment Share on other sites More sharing options...
pogidude Posted October 23, 2013 Author Share Posted October 23, 2013 very nice to learn new things! 1 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now