Slideshow in Flex (How to Start)
Things you need to know before working with Slideshows in Flex.
Slideshow is one of the trickier elements to master in Flex, just like Tabs. But mastering Slideshow will open up your website to its dynamic nature and the many options it offers.
Both are now available by pressing the "+" sign, under the Sliders/Tabs element.
1. There are several ways to implement Slideshows into your website:
- This method is available only for Flexthemes and Pronto users:
Pre-built Flex block from the Blocks Library.
The pre-made designs will be available after you update to the latest Flex Block version (minimum version required for the plugin is 4.4.5). - Predefined Compositions
Press the "+" sign, select the Sliders/Tabs element, and choose one of the 3 predefined compositions - Slideshow, Testimonials, or Tabs. This will insert a ready-to-use layout that can be modified and adjusted to your liking. - Building the block from scratch
And the method that allows the most flexibility - is building your own slideshow. Click on the "+" sign, choose the Sliders/Tabs element, and add the components you need for your custom layout. These include "Slideshow Content", "Slide Text", "Previous Arrow", "Next Arrow".
2. Mix and match components to create new Slideshow layouts, unique to your website. Here's how each one of the works:
-
Slideshow Content - this component includes the content for each of your slides. Inside the Items area, you can customize the images, titles, short descriptions, and link options for each of your slides.
- Slide Text - this component is in charge of how your text is placed on a slide. Please note that this is not the area where you edit the content itself, just the placement, alignment and design options for the text.
Additionally, you can add/remove buttons, define the font and color of the title and text, lower title, and buttons. Take into account that these options will apply to all your slides. Note that changing the text options of a single slide is still possible, by using the Override Text & Color which can be found in "Slideshow Content", in the "Items" section. The actual text, links, and button labels should be added through the Slideshow Content section.
Note: Adjusting the content of the slide (Title, Button Text) can be done via the Slideshow Content.
Making the button visible and setting button options via the Slide Text Element:
Previous & Next Arrows - these should be pretty obvious. If you're making your own slideshow layout, you'll need to add Previous and Next arrows, so your users can easily navigate through the slides.
3. Please remember, that the Mobile layout for your composition will need to be built separately. You can do that by moving and rearranging the desktop elements, just like you'd do with any other Flex block.
A more detailed overview of the Slideshow Element.
We've put together a quick video to help you get familiar with how this new element works and the creative freedom it offers. And if you're looking for additional guidance and insights, make sure to check out this article.