I’m trying to implement a jQuery Plugin to my wordpress site. I already figured out how to make jQuery run, but the plugin still doesn’t work. It is this plugin: contenthover
I tried it like this:
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="http://example.com/wp-content/themes/xenia/assets/js/jquery.contenthover.min.js"></script>
<script type="text/javascript">
<!--//-->
<![CDATA[//>
<!--
jQuery(document).ready(function() {
$('#d1').contenthover({
overlay_background:'#000',
overlay_opacity:0.8
});
});
//-->
<!]]//>
</script>
Whatever I try doesn’t work. I already included jQuery and the plugin via functions.php
. When I call the simple slideUp();
it works, but the contenthover-plugin
doesn’t. What am I doing wrong?
edit:
This is how I also tried it by hook it up in teh functions.php of the theme
wp_register_script(THEME_SLUG . '-jqueryMain', THEME_URI . '/assets/js/jquery-2.1.4.min.js', array('jquery'));
wp_register_script(THEME_SLUG . '-contenthover', THEME_URI . '/assets/js/jquery.contenthover.min.js', array('jquery'));
wp_enqueue_script(THEME_SLUG . '-jqueryMain');
wp_enqueue_script(THEME_SLUG . '-contenthover');
WordPress uses a noconflict wrapper because other libraries also use
$
as the core variable, so$
is not directly available in WordPress.If you still want to use
$
in your script, you have to define it like this:Inside this function
$
will work as expected.You can read more about it in the documentation.
Note: You should avoid adding jQuery yourself, other plugins or themes might rely on the jQuery version provided by WordPress. Just enqueue the jQuery WordPress provides.