1LD Tutorials & Blogs

General

Autoplay

Checking this option will make the slider rotate automatically through each slide. If checked you can also set a duration for how often the slides should transition.

Active Slide

This tells the stack at which slide should first be shown on page load.

Max Width

This specifies the maximum width of the slider

Min Height

This specifies a minimum height for all slides. Note that the slider will automatically adjust to slides of different heights, but for a better looker slider, we recommend setting a min-height that makes all of your slides equal.

Radius

This sets the corner radius of all slides in the Feature slider.

Slides

Hide (Titles, Descriptions, Icons, Buttons)

The hide toggles can be used to hide different parts of each slide. For example if you do not want to have any descriptions in your slides, simply check the “Hide Descriptions” option. This can be used to hide any of the following parts of a slide:

Titles
Descriptions
Icons
Action Buttons

Fonts (Title, Description, Button)

You will find 3 dropdown menus for setting the fonts of the Titles, Descriptions, and Action Buttons.

Select a font from the dropdown list, or select “custom” to include a font of your own. In order for a custom font to work you must include a URL for the font and a NAME for the font.

Example URL: https://fonts.googleapis.com/css?family=Open+Sans:300,400,700

Example Name: Open Sans

Title Size

This sets the font size for all slide titles

Title Max Width

This option is mostly useful for full page sliders. It specifies a maximum width for slide titles so that the text can wrap at a point of your choice, rather than stretching the full width of the screen.

Title Padding (Vertical & Horizontal)

Here you can set the vertical and horizontal padding around the slide titles

Description Size

This sets the font size for all slide descriptions

Description Max Width

This option is mostly useful for full page sliders. It specifies a maximum width for slide descriptions so that the text can wrap at a point of your choice, rather than stretching the full width of the screen.

Description Padding (Vertical & Horizontal)

Here you can set the vertical and horizontal padding around the slide descriptions

Icon Size

This sets the size for all slide icons

Icon Outer

This sets the size of the outer circle/square area of all slide icons

Icon Radius

This sets the corner radius of the outer icon area

Icon Padding (Vertical & Horizontal)

Here you can set the vertical and horizontal padding around the slide icons

Btn Text

This sets the font size of all action buttons

Btn Radius

This set the corner roundness of all action buttons

Btn Padding (Vetical & Horizotnal)

This sets the inner padding of the action buttons

Btn Content

This sets the text content of all action buttons. Note if you would like to have individual text for a particular slide, simply click on the individual slide and check the “Custom btn content” option.

Slide Colors

Title Color

Simply sets the text color of all titles

Description Color

Simply sets the text color of all descriptions

Icon Colors (Icon & Background)

Here you can set the background color and icon color of all slide icons

Btn Colors (text & Background)

Here you can set the text and background color of all action buttons.

Background

Here you can set the background for all slides. You can choose between:

Color
2 Color Gradient
3 Color Gradient

Note: if you would like to use an image background, click on the specific slide that you want, check the “Custom background” option, and then you can select a background image for that particular slide.

Setting individual Slide Colors

By default all slide colors are shared. If you want a particular slide to have custom colors, such as a custom background, icon ,title, button, etc. Click on the particular slide that you want and look under the “Custom Colors” section. Here you will find a list of check boxes like so:

Custom Background
Custom Title
Custom Description
Custom Icon
Custom Button
Custom Nav

Checking any one of these options will make a color input appear for setting a unique color for that particular slide.

Arrow Size

Simply sets the font size of slide arrows

Padding (Vertical & Horizontal)

This controls the padding around the nav arrows and action buttons

Arrow Colors (Initial & Hover)

Allows you to set the color of the navigation arrows on initial state and hover

Overlay BG

Here you can set the background color of the navigation for each slide.

Create stunning, uniquely-shaped content effortlessly with Vivid Tiles. Tailor your website’s appearance with customizable top and bottom edges, and arrange these elements seamlessly in rows.

Robust Customization

Create rows of uniquely-shaped content elements.
Customize each one independently.
Add almost any type of content.

Diverse Edge Options

Edges support 9 shape options with 4 layouts.
Mix and match edge shapes and layouts on top and bottom.
Incorporate images, icons, or text inside edge design.

Effortless Setup

Minimal setup required for immediate results.
Customizable style options to fit any website design.
Control element size and colors with ease.

Simply Responsive

Tiles automatically adapt to browser and device width.
Full control over tile horizontal and vertical alignment.
Automatically make all tiles in a single row the same height.

Eye-Catching Styles

Each edge shape has two unique background layers.
Adjust edge layer visibility, placement, and offset.
Apply subtle, attention-grabbing in-view animations.

CHECK IT OUT!

Tutorials

Feature Slider