Post Slider Element
The Post Slider Element turns content you already have into a slideshow. It can slide through your blog posts, showing each post’s featured image with its title and, if you want, a short excerpt, each slide linking to the post.
It can also work as a simple image slider for the current page: the attachment layout shows the images attached to this post or page, with a row of thumbnails below and an optional lightbox. No separate gallery has to be built for it.
In this article: How To Use · Element Options · Tips · Related Elements
How To Use The Post Slider Element
Add the Post Slider Element and choose a Layout. Posts with Title and Posts with Title and Excerpt slide through blog posts. Pick the Categories to include or leave the field empty for all, set the Number of Slides, and for the excerpt layout the Excerpt Number of Words.
The attachment layout, Only Images Attached to Post/Page, uses the images uploaded to the page the slider sits on. Add them with Attach Images to Post/Page Gallery: open the media manager from there and upload the images in its “Upload Files” tab, which attaches them to this page. Turn on Image Lightbox to open each image larger on click.
In the post layouts, both the image and the title of each slide link to the post, and the title is output as an H2 heading. In the attachment layout, a strip of thumbnails below the slider lets visitors jump to any image. Use Margin to set the space around the slider and Element Visibility to hide it on certain screen sizes.
Element Options
The tables below list every option of the element, grouped by the tabs you see when you edit it in the Builder. Many options depend on others, so the edit screen only shows the options that apply to your current choices.
General
| Heading | Description |
|---|---|
| Layout | Choose a layout style for Post Slider. |
| Attach Images to Post/Page Gallery | To add images to this post or page for attachments layout, navigate to “Upload Files” tab in media manager and upload new images. |
| Excerpt Number of Words | Insert the number of words you want to show in the excerpt. |
| Categories | Select categories of posts to display or leave blank for all. |
| Number of Slides | Select the number of slides to display. |
| Image Lightbox | Only works on attachment layout. Lightbox must be enabled in Global Options or the image will open up by in the same tab by itself. |
| Margin | Enter values including any valid CSS unit, for example 4%. |
| Element Visibility | Choose to show or hide the element on small, medium or large screens. You can choose more than one at a time. |
| CSS Class | Add a class to the wrapping HTML element. |
| CSS ID | Add an ID to the wrapping HTML element. |
Extras
| Heading | Description |
|---|---|
| Conditional Rendering | Add conditional rendering logic for the element. The element will only be part of the post / page contents, if the set conditions are met. NOTE: Server cache can interfere with results. |
Tips
- Only posts with a featured image are included in the post layouts. A post without one is skipped, so check the featured images if a post is missing.
- In the attachment layout the page’s own featured image is left out of the slides. Images chosen from the media library that were uploaded somewhere else are not attached to this page and will not appear.
- Image Lightbox works only in the attachment layout, and only when the lightbox is enabled in Global Options; otherwise the image opens in the same tab.
- Because each title is an H2, avoid several post sliders on one page if you care about a clean heading structure.
- Fill in the alt text of every image in the media library. The slider uses it for the images, which helps screen readers and search engines.