June 29, 201511 yr Its been a while since I've built anything in WP, and it's going fine so far. One question I have, is how do you move Javascript files out of a template into the footer?In Craft you can do it using tags like the below, and it automatically places them in the footer for you. These tags can be inside any template. {% set myJs %} _gaq.push([ "_trackEvent", "Search", "{{ searchTerm|e('js') }}" ]); {% endset %} {% includeJs myJs %} I'm looking for something similar that doesn't use the <?php get_footer ?> thing, as it seems to completely mess up templates, with some plugins including up to 10 random JS and CSS files. I've decided to add the dependancies in myself, instead of getting WP to add them automatically, and the mark-up is much cleaner as a result. Basically, on certain templates there are scripts that I need, but not on others (such as form validation for the contact template). I need to find a way of being able to include these scripts on certain templates only. Any ideas?
June 30, 201511 yr If I'm understanding what you want correctly (really quite new to both Wordpress and PHP), wp_enqueue_script allows you to place scripts in the footer (https://codex.wordpress.org/Function_Reference/wp_enqueue_script )? This is some code I'm using in my functions.php file: if ( is_home() || is_page('reviews') || is_single() ) { wp_enqueue_script( 'archmove', get_template_directory_uri() . '/scripts/archmove.js', array(), false, true); } The last 'true' being where you set it to be placed after the closing body tag. The script in my theme is only loaded on the blog page, and a few others which need it. Edited June 30, 201511 yr by rhubarblover
June 30, 201511 yr For example here, I deregister WP default jQuery (Which loads in the header) and I load Google's 2.1.3 CDN version in the footer. wp_deregister_script('jquery'); wp_enqueue_script( 'jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js', '', '', true ); The last argument passed to the wp_enqueue_script function, which I have set to true dictates whether or not the script gets output in wp_footer() or wp_head() true for the former, false for the latter. Hope that helps I don't seem to get all the crap in the footer you talk about, but then I'm not really using any plugins besides the AFC stuff and Yoast. For loading them only on certain templates you can use the wp_register_script() function and then use the wp_enqueue_script inside of an 'if' block to enqueue the registerd script. Here's my example for loading in Google maps just on a contact page: wp_register_script( 'googlemaps', 'http://maps.google.com/maps/api/js?sensor=false&libraries=places', '', '', true ); if ( is_page_template( 'page-contact.php' ) ) { wp_enqueue_script('googlemaps'); } Edited June 30, 201511 yr by rbrtsmith
June 30, 201511 yr Author Thanks for the replies. In the end I decided the WP method wasn't going to work with inline JS too, or without a lot of hassle. Ideally I wanted this in my templates so other developers know what templates explicitly add which files. Functions.php can lack clarity sometimes. I installed the Twig templating engine (http://twig.sensiolabs.org/) in the end. I can use something like this instead. It's probably better for us in the long run because We use Craft, which also uses Twig, so we have a unified way of writing templates on both systems. base.twig <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Hello</title> </head> <body> {% block content %} {% endblock %} {% block footerJs %} {% endblock %} </body> </html> template.twig {% extends "base.twig" %} {% block content %} <div class="Content"> </div> {% endblock %} {% block footerJs %} <script>console.log('gary numan');</script> {% endblock %}
Create an account or sign in to comment