Enqueue Owl Carousel WP
User
<script>
</script>add above via wp_enqueue_Scripts and depedn on jquery
Assistant
To enqueue the Owl Carousel styles and script in WordPress while making it depend on jQuery, you can use the following code in your theme's `functions.php` file or a custom plugin:
function enqueue_owl_carousel() {
// Enqueue Owl Carousel CSS
wp_enqueue_style(
'owl-carousel',
'https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css',
array(),
'2.3.4'
);
wp_enqueue_style(
'owl-carousel-theme',
'https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css',
array('owl-carousel'),
'2.3.4'
);
// Enqueue jQuery (WordPress includes it by default, so we just make sure it's loaded)
wp_enqueue_script('jquery');
// Enqueue Owl Carousel JS
wp_enqueue_script(
'owl-carousel-js',
'https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js',
array('jquery'),
'2.3.4',
true // Load in the footer
);
}
add_action('wp_enqueue_scripts', 'enqueue_owl_carousel');### Explanation:
1. **CSS**: Two `wp_enqueue_style` calls are used to load the Owl Carousel main stylesheet and theme.
2. **jQuery Dependency**: `wp_enqueue_script('jquery')` ensures that jQuery is loaded as a dependency for Owl Carousel JS.
3. **JS**: The Owl Carousel JavaScript is enqueued with `jquery` as a dependency and is set to load in the footer (`true` in the last parameter).
4. **Action Hook**: The `add_action` call hooks the function into `wp_enqueue_scripts`, which is the proper way to enqueue styles and scripts in WordPress.
After adding this code, Owl Carousel will be available for use on your site.