Please note, this is a STATIC archive of website www.themepunch.com from 28 Sep 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

Post-Based Slider

Create a Slider where the slider's content is taken from your site's posts.

slider-settings

2. Next, select "Post-Based Slider" or "Specific Posts".

2.1 A "Post-Based Slider" is a slider based on a specific category/tag (or multiple categories/tags) of your choice.
post-based-slider
  • 1. Fetch Posts By
    • Categories & Tags
    • Related
    • Popular
    • Recent
    • Next/Previous
  • 2. Post Types - Choose regular Posts or one of your Custom Post Types.
  • 3. Post Categories - Use Ctrl-Select to choose multiple tags/cateories.
2.2 When choosing "Specific Posts" you can enter specific Post ID's to be used as the slider's source.

In the following examples, posts with the ID “23”, “24” and “25” will be pulled into the slider.  When including multiple posts like this, separate them with a comma as shown in the screenshot below.

Select “Add Popular Posts” or “Add Recent Posts” to automatically grab a list of ID’s for each.

specific-posts

3. Additional Settings

post-slider-settings
  • 1. Sort Posts By - Choose the display order of the posts ("Title", "Date", etc.).
  • 2. Sort Direction - Sort A-Z, Z-A, 0-999 or 999-0.
  • 3. Max Posts Per Slider - Limit the amount of posts that will get pulled into the slider.
  • 4. Limit the Excerpt To - A word limit for the post's "Excerpt" if being pulled into the slider.

4. Add some post-based content to the slide

4.1 Save your settings (1)
and then click "Edit Slides" (2)

A “slide” for a Post-Based slider is a template that will be used for how your post’s content will be displayed.  Only one template is required, meaning only one “slide” needs to be setup.

save-and-edit-slides
4.2 Set "Featured Image" as the "Main Background" source.
featured-image-option
4.3 Add some Text/HTML Layers to pull in your post content
add-text-layer
edit-layer-texts
4.4 Then click the "Edit Meta" icon for the layer, and choose one of the listed post content options.
add-meta-slug
post-meta
4.5 Next style the layer as you would a regular text field, and then save the current slide.
meta-layer-style

5. Individual Posts

5.1 Set a "Featured Image"

Visit one of the posts being pulled into your slider, and make sure it has a “Featured Image” set, as this is what will be used as the slide’s main background image for the post’s slide.

set-featured-image
  • Quick Tip #1
    View instructions for creating individual slide templates for individual posts.
  • Quick Tip #2
    View instructions for how you can dynamically adjust your slider's list of post IDs at runtime.

Final Example Slider:

post-based-slider-preview