adding scripts to a child theme

[PFX]

I have the Exec Pro Theme and have the Genesis Extender Plugin to help with some coding.
I have been trying to add the following scrips to the site before I really start building the whole thing out.

jQueryUi (jquery-ui.min.js)
TwitterBootstrap (bootstrap.min.js)
Isotope (isotope.pkgd.min.js)

Please note that I have followed various tutorials but every time it breaks the site so obviously getting it completely wrong somehow. I just want to load these into the site so I can access when building out the site.

I understand that we need to put the wp-enqueue-script in our functions.php file of our child theme and I know that many tuts recommended also adding this after the footer to improve the site loading. I have been adding various code snippets into the 'Functions' section of the Genesis Extender plugin so that this information loads into a custom-functions-php file so I don't mess with the original files.

Could someone please help me get the right the code I need to load these into Exec Pro Theme - and where I put that code?

Thanks very much

http://www.positivefxstudio.co.uk

[Brad Dalton]

Here's several examples of how to load scripts http://wpsites.net/web-design/best-ways-to-load-scripts-in-wordpress/

---

Tutorials for StudioPress Themes.

[PFX]

Hi Brad
Thanks for the quick response - I've had a look at that info and in registering the script it states:

add_action( 'wp_enqueue_scripts', 'wpsites_register_load_script' );
/**
* @author Brad Dalton - WP Sites
* @example http://wp.me/p1lTu0-a40
*/
function wpsites_register_load_script() {
wp_register_script( 'your-script', get_stylesheet_directory_uri() . '/js/your-script.js' );

wp_enqueue_script( 'your-script' );

}

I have tried to add this but seem to be coming across a problem as it keeps breaking the site. So below I am pasting what I would put, using the code above with one of the scripts I want to load - can you please check if I am doing anything wrong?
I have taken the 'jQueryUI' script as an example:

add_action( 'wp_enqueue_scripts', 'wpsites_register_load_script' );
/**
* @author Brad Dalton - WP Sites
* @example http://wp.me/p1lTu0-a40
*/
function wpsites_register_load_script() {
wp_register_script( 'jquery-ui.min.js', get_stylesheet_directory_uri() . '/js/jquery-ui.min.js' );

wp_enqueue_script( 'jquery-ui.min.js' );

}

Also, do I need to put this code in every time for each script or is there a shorter way to do this?

Thanks for your help.

[PFX]

Hi Brad
Unfortunately I tried this code as per your article but all that did is put all of the text from this script at the top or bottom of a page - it didn't actually load anything.
I tried adding it to functions.php - in the header/footer areas as you recommend - all giving the same result.

I can't seem to work out where I am going wrong exactly.

Thanks
Paula

[Brad Dalton]

Because you are using a plugin to add custom functions rather than the child themes functions file, you will need to ask for support on the plugins forum as i do not have access to the Genesis Extender Plugin.

From what i know about it, you may need to add the code to the plugins custom functions file as it may override the child theme files.

---

Tutorials for StudioPress Themes.

[PFX]

Thanks again for the reply. I found a 'developers' forum where 'adding scripts' was discussed in great detail. Long story short, I have managed to at least register two of the scripts for now in the custom functions area of the Genesis Extender Plugin

so far it hasn't broke the site - which is at least one step forward.

I have been able to use the proper code as you suggested above and I understand that I can load the script per page or with conditional tags by using the 'wp enqueue' code that you put above.

So I do believe I have had some partial success in at least registering the scripts. I won't know until I build out the page content to know if I have had total success or not - but from this forum I have understood things a little better.

Thanks again for your help - much appreciated!

[PFX]

Hi Brad

Actually I thought it might help if I showed you what I did incase I run into errors later

I loaded this code in to 'custom-functions.php' (via the Genesis Extender plugin):

<?php
add_action( 'wp_enqueue_scripts', 'wppfx_load_javascript_files' );

function wppfx_load_javascript_files() {

wp_register_script( 'bootstrap', get_template_directory_uri() . '/themes/executive-pro/bootstrap/js/bootstrap.js', array('jquery'), '3.3.0', true );
wp_register_script( 'isotope', get_template_directory_uri() . '/themes/executive-pro/isotope.docs/isotope.pkgd.min.js', array('jquery'), '2.0.1', true );

}
?>

I understand by adding the array('jquery') and the numbers that follow is to help keep the site up-to-date with latest versions.

Also I didn't FTP the whole folder, I was only loading up the .js file to my themes folder - so I think this may have been effecting things as well.

So I will be executing this code when I want the script to load on a page:

<?php
wp_enqueue_script( ‘nameofscript’ );
if (is_front-page) ()) {
wp_enqueue_script( ‘nameofscript’ );
}
?>

Hopefully that will work and I will try to come back to this forum and update incase anyone else has a similar problem.

Thanks again

[Brad Dalton]

Just one thing

You will need to change

get_template_directory_uri()

This is for parent themes

to

get_stylesheet_directory_uri()

This is for child themes

---

Tutorials for StudioPress Themes.

[Author]

Posts