Custom Carousel using ACF Pro and Owl in Oxygen
This members-only tutorial provides the steps to
- add an options page in WordPress using ACF Pro having an image repeater and an overlay text area custom fields
- outputting the custom fields in a code block element in a format suitable for Owl carousel
- loading Owl carousel in my custom functionality plugin
- initializing the Owl carousel on the container of the images
for showing an auto-playing continuously looping carousel of images with static overlay text on the top.
Live Demo: https://oxygen.wpdemos.net/featured-carousel/
Requirements:
- Pro version of Advanced Custom Fields
- The ability to upload files to a plugin directory. This needs to be done via cPanel file manager or a FTP client.
Step 1
Install and activate my custom functionality plugin.
Upload owl.carousel.min.css to the plugin's assets/css directory and owl.carousel.min.js to plugin's assets/js directories via a FTP client.
Step 2
Install and activate ACF Pro.
Step 3
Let's load the CSS and JS files of Owl on the page where the carousel is to be shown, register a custom size for images in the carousel and enable ACF settings page.
Edit plugin's plugin.php file.
Replace the code inside sk_enqueue_files() with:
Comments
For adding code blocks wrap the code in three backticks. Markdown should work.
Provide a URL of your site/webpage if something is not working.
Provide a URL of your site/webpage if something is not working.
Frankly, although closely related to something I desperately need to do sooner than later (my video carousel from posts tutorial request), I am turning away from this tutorial because at least one of the “plugins” is found on GitHub, not the WordPress repository. I really feel like the security of a website (WordPress) depends on the ongoing maintenance efforts of the plugin developers, and their updating their plugins via the standard push updates in WordPress. The last thing I want to do is start using plugins that are sideloaded and need me to keep an eye on GitHub for updates.
Please, I beg of you, provide functionality via “approved” plugins that are being actively maintained.
Here is the link to my other tutorial I wrote based on your request: https://wpdevdesign.com/custom-youtube-video-carousel-using-pods-and-owl-in-oxygen/
My custom functionality on Github is a plugin I authored and maintain. There is no security problem that it has as it is a pretty simple one and I will keep updating it if and when it needs to, because it is something I personally use on all Oxygen sites I build.
I will put it in the WP repo if that eases your mind.
I just noticed the other tutorial this morning scanning through posts on Facebook. THANK YOU! I will go look at it in a moment.
Sorry, I didn’t know you are the author of My Custom Functionality. That by itself makes me feel better about it as I consider you a trusted source. But that aside, and not just for my sake, I think everyone appreciates the ease of installing, activating, and getting updates to plugins from the repository.
NVM. Upon looking at the plugin, there’s nothing really there but a template for additional functionality. No point in adding it to the repo. 🙂