The filter scroll images widget from Booster Addons is a great tool to display a list of long vertical images on your website with its scrolling and filters features.Upload your images, choose from different layouts, and style everything from the filters to the images container.
Here are the options provided by this widget.
This is where you will manage your images list.You can add an image to the list by clicking on the add item button at the bottom of this section.Each image has the following options.
Note that the global filters list can be defined in the filter global settings available in the style tab.
Under the image settings section, you be able to select a layout, define the container height, and set the scrolling animation settings.
Under the styling tab section, you will have the tools to customize the images design.
Change the images shape and add borders and shadows.
-Normal & Hover : Select which image state you want to customize.Normal for the idle state and hover for when the images are being hovered.Note that all the remaining options of this section will only affect the selected state.
-Radius, Border & Box Shadow : Customize the images radius to change its shape and add a border and a box shadow to add even more design to this element.
The masonry and filter sections are going to be used to change the masonry layout and effects as well as to setup the filters settings and styling.
Change the number of columns, enable the gutter, and change the show effect.
-Columns Number : Set the number of columns that you want to use for the masonry layout.
-Enable Gutter & Gutter Value : Enable this if you want the images to be separated by white space.You can also change the gutter value to control separating space.
-Show Effect : Change the images showing effect.Select one of the many animations available.
Setup your filters list, align the filters section, and change the filter links typography.
-Enable Filter : Enable the use of filters for your images.
-Filter Labels : Specify the filters that you want to use.The filters name have to be separated by a comma.
- : Control the horizontal alignement for the filters links section.
-: Change the font family, font size, and all the other text properties for the filters links.
-Enable All Button: Enable the use of an 'all images' button.When the user clicks on this button, all the images in the list will be displayed.
-: Choose if you want the all button to appear on the left or right side of the filters links.
Customize the links style.Change colors and add borders and box shadow.
-Link Padding & Margin : Control the links inner and outer space by changing the padding and margin values.
-Normal & Active: Select which link state you want to customize.Normal for the idle state of the links and active for when a link is currently selected and active.Note that all the remaining options of this section will only affect the selected state.
-Colors : Customize the color for both the links text and the background with the possible use of gradient colors for the background.
-Radius, Border & Box Shadow : Customize the links background radius to change their shape and add a border and a box shadow to add even more design.
You have the full control over the style of both the links outer and inner containers.
-Container & Inner : Select which container to style.The container option allows you to style the whole space around the links section while the inner option is only for the links text container.
-Background : Customize the selected container background & choose to apply either a solid background color or a gradient color.
-Radius, Borders & Shadows : Control the border for each container and apply custom box shadows.The option to change the shape of the container is also possible by changing the border radius value.
-Padding & Margin : Change the padding and margin values to control the inner and outer space for each container.
If you can't find what you are looking for any our documentation website, please feel free to open a support ticket & get help from our support team.