I’ve seen all the documentation in the codex, but I am doing something wrong since it doesn’t work!
I want to implement this jQuery plugin (https://github.com/davidcrawford/typist-jquery) in my welcome page (www.english.intermediavs.com).
I’ve added this code in my function.php:
function my_typist() {
if (!is_admin()) {
wp_enqueue_script('jquery');
wp_enqueue_script('jquery.typist', get_bloginfo('template_url') . '/wp-includes/js/jquery.typist.js', array('jquery'), '1.0', true);
}
}
add_action('init', 'my_typist');
And I also introduced this code in “welcome page” by using html raw plugin:
<!--raw-->
<script type="text/javascript" src="https://wordpress.stackexchange.com/questions/75149/<?php bloginfo("template_url'); ?>/wp-includes/js/jquery.typist.js">
jQuery(document).ready(function($) {
$('#terminal').typist({
height: 300
});
$('#terminal').typist('prompt')
.wait(1500)
.typist('type', 'greet')
.typist('echo', 'Hello, world!')
});
</script>
<!--/raw-->
PS: I am using the plugin Use Google libraries as well.
links:
http://codex.wordpress.org/Using_Javascript
http://codex.wordpress.org/Function_Reference/wp_enqueue_script
If you only want to use the library “jquery.typist” on one page you could just add it by the conditional is_page()
but if you want to use it on more than one page you should just minifyi all your js-files into a single one and compress it and cache it. It is better to use one single js-file witch is compressed and cached than use many single files.
And it also looks like you have put the file in /wp-includes/js ? it should be in your theme-root folder.
Lets say your structure is themes/mytheme in mytheme you should have a js folder. if so the code could look like this:
function wpse_75149() {
// add the id on the page whare you want the script
if ( is_page('123') ) {
wp_enqueue_script('jquery');
wp_enqueue_script('jquery.typist', get_template_directory_uri() . '/js/jquery.typist.js', array('jquery'), '1.0', true);
wp_enqueue_script('custom-script', get_template_directory_uri() . '/js/myscript.js', array('jquery');
);
}
}
// load js in footer
add_action('wp_footer', 'wpse_75149');
Create a js file called myscript.js in your theme/js folder and add:
jQuery(document).ready(function($) {
$('#terminal').typist({
height: 300
});
$('#terminal').typist('prompt')
.wait(1500)
.typist('type', 'greet')
.typist('echo', 'Hello, world!')
});
http://codex.wordpress.org/Function_Reference/is_page – conditional to print the script on right page
http://codex.wordpress.org/Function_Reference/wp_enqueue_script – how to load scripts