Running javascript in a child theme. Works in jsfiddle

Question

Here is the JSFiddle http://jsfiddle.net/thornwalker/3LQjS/

I'm trying to get it to run on my wordpress blog and having no luck. My skill is novice at best, but up until now I've been able to muddle through.

This is the code I have in my functions.php (in my main theme, if I copy the functions.php to my child theme it won't run.)

function videoswitch() {
wp_enqueue_script('videoswitch', get_template_directory_uri() . '/js/videoswitch.js',
array('jquery')
);
}
add_action('wp_enqueue_scripts', 'videoswitch');

Finally, here's the videoswitch.js

jQuery(document).ready(function($){

var directionsVar = '<video autoplay="" loop=""><source src="directionsVid.mp4" type="video/mp4"></video>';

var storyVar = '<video autoplay="" loop=""><source src="storyVid.mp4" type="video/mp4"></video>';

$("#directions").hover(function () {
$("#video-container").empty();
$("#video-container").append(directionsVar);
});

$("#story").click(function () {
$("#video-container").empty();
$("#video-container").append(storyVar);
});
});

Any help would be greatly appreciated.

I honestly don't know how to check if it does. I see an error in inspect element that looks like it's trying to load the javascript from the parent theme and the child theme URLs all combined. — Thornwalker
– Thornwalker, Commented Feb 4, 2014 at 13:30
get_template_directory_uri() always refers to the parent theme. Is this what you want? — fuxia
– fuxia ♦, Commented Feb 4, 2014 at 13:34
Ah, no. videoswitch.js is in a subdirectory of the child theme. Should I be using get_stylesheet_uri() in that case? Since it's not a stylesheet I found that confusing. — Thornwalker
– Thornwalker, Commented Feb 4, 2014 at 13:35
Check the page source with Chrome Developer Tools/FireBug/etc. and look for the file or any 404s. And you should use get_stylesheet_directory_uri(). — kaiser
– kaiser, Commented Feb 4, 2014 at 13:40

fuxia · Accepted Answer · 2014-02-04 14:01:01Z

0

Use get_stylesheet_directory_uri() to get URLs for the child theme.

get_template_directory_uri() always refers to the parent theme.

If there is no parent theme, both functions will return the same result.

Note that both functions do not add a trailing slash, you have to do that in your code.

answered Feb 4, 2014 at 14:01

fuxia♦

107k39 gold badges256 silver badges463 bronze badges

Add a comment |

Stack Exchange Network

Running javascript in a child theme. Works in jsfiddle

1 Answer 1

Your Answer

Hot Network Questions

Running javascript in a child theme. Works in jsfiddle

1 Answer 1

Your Answer

Sign up or log in

Post as a guest

Related

Hot Network Questions