- register a
videoCPT with an associated
video_urlcustom field so each CPT item can have a Vimeo video associated with it
- add a few CPT items
- load the CSS and JS files of Swiffy Slider
- write a custom WP_Query to pull 10 latest videos and
- for each get the post thumbnail and if not present, fetch the video thumb from Vimeo
- for each generate a card with the image with a play button overlay linking to the video URL, item title and item excerpt
- ensure that the HTML markup is in the format necessary for Swiffy
- add custom JS for adding and removing a
hoveredclass when the mouse moves over and away on the card header
- add custom CSS to add a smooth transition so the card to move up when the card header is hovered plus more
Create a field group to appear on video CPT entries using a plugin like ACF or Meta Box.
Add a URL-type field having the name/ID of
Populate the video post type entries.
If you would like to set a custom thumb for the videos in the slider, set it as featured image.
Populate the video URL field with Vimeo URLs in this format:
Load and initialize Swiffy Slider.
Install and activate Code Snippets plugin.
Go to Snippets > Add New.
Title: Load and init Swiffy
This is a premium members-only content.
To view the rest of the content, please sign up for membership ($47/month or $599 one-time).
Already a member? Log in below or here.