Slides

Overview

The Slides widget allows you to create a slider inside page or posts without need of any other plugins. Inside this widget you have many options which allows you to design your slides as per your needs.

Options

Contents

Slides : This option allows you to add number of slides in your slider.
  • Background Type : This option allows you to add background for a slide. The options include color, background image, gradient.
  • Content Box Styles : This option allows you to customize the content by changing width, color, position etc.
    • Width : This option allows you to Background Color: This option allows you to set the background color of content inside slides. the width of content inside slides.
    • Horizontal Position : This option allows you to set the horizontal position of content inside slides.
    • Vertical Position : This option allows you to set the Vertical position of content inside slides.
    • Background Color : This option allows you to set the background color of content inside slides.
    • Padding : This option allows you to set the padding around the slide content.
    • Alignment : Set the alignment for the content eg. left, center, right.
  • Heading Styles : This option allows you style the heading of your slides.
    • Heading : This option allows you to insert the title for your slide.
    • Color : This option allows you to set the color for the title.
    • Typography : Set the typography eg. Font family, Font size, etc. for the heading.
    • Spacing : Set the spacing between heading and sub-heading.
  • Sub-Heading Styles : This option allows you style the sub-heading of your slides.
    • Sub-Heading : This option allows you to insert the sub-title for your slide.
    • Color : This option allows you to set the color for the sub-heading.
    • Typography : Set the typography eg. Font family, Font size, etc. for the sub-heading.
    • Spacing : Set the spacing between sub-heading and description.
  • Description styles : This option allows you style the description of your slides.
    • Description : This option allows you to insert the description for your slide.
    • Color : This option allows you to set the color for the description.
    • Typography : Set the typography eg. Font family, Font size, etc. for the description.
    • Spacing : Set the spacing between description and button.
  • Button Style : This option allows you style the buttons of your slides.
    • Name: You can insert text to the buttons of your slide.
    • Link : Set link to the button displayed.
    • Rel: The rel attribute specifies the relationship between the current element and the linked element.
    • Open Link in New Tab: Enable to open the specified link in new tab of your web browser or vice versa.
    • Stretch : Enable to set the button width as 100% of your display resolution.
    • Typography : Set the typography eg. Font family, Font size, etc. to the button displayed.
    • Alignment : Set the alignment of the button eg. Left, Center, Right.
    • Button Type:
    • Default : If nothing specified, the button is set as Default.
    Submit
    • Primary : Primary Button indicates the primary action.
    Submit
    • Secondary : Secondary Button indicates the secondary actions.
    Submit
    • Success : Success Button indicates success or positive actions.
    Submit
    • Info : Info Button indicates success or positive actions.
    Submit
    • Warning : Warning Button indicates caution which should be taken with this action.
    Submit
    • Danger : Danger Button indicates danger which should be taken with this action.
    Submit
    • Dark : Dark Button indicates a button to be dark.
    Submit
    • Light : Light Button indicates a button to be light.
    Submit
    • Link : Link Button makes a button look like a link.
    Submit
    • Animated : Animated Button allows you to design three different types of button with 3 different animations.
    • Glow Animation : A multi color glow appears when in hover state.
    Submit
    • Thin Animation : A button with an animation that tranforms the plane button in to a "X", perfect for using as a cancel, clear or close button.
    Submit
    • Slide Animation : The slide animation button offers a color slide when in hover state and allows to change the text as well as the background color of the button.
    Submit
    • Custom : Custom Button allows you to design the button in Normal and Hover State.
    Submit
  • Button Size
    • Mini : Set the size of the button to Mini.
    Submit
    • Small: Set the size of the button to Small.
    Submit
    • Large: Set the size of the button to Large.
    Submit
    • Extra Large: Set the size of the button to Extra Large.
    Submit
    • Double Large: Set the size of the button to Double Large.
    Submit
    • Custom: To set the size of button as per User-defined but it should be less then hundred.
    Submit
  • Icon Style
    • Icon : Select an suitable icon to display in button.
    • Icon Alignment : Set an alignment for icon. The options include left , right.
    • Space Between : This option allows you to manage space between text and icon.
  • Border Style
    • State : Set the state in which you have to set a border. The options include normal, hover
  • Border Type:  Set the state in which you have to set a border.

  • Solid

    • Solid Border

  • Double

    • Double Border

  • Dotted

    • Dotted Border

  • Dashed

    • Dashed Border

  • Groove

    • Groove Border

  • Space Between : This option allows you to manage space between buttons.

  • Height : This option allows you to set the height of your slide.
    • slides1

    Slider Options

  • Number of Items :  This option allows you to display how many slides should be display in one slide.
  • Space Between :  This option allows you to manage space between two slides.
  • Loop : Select this option an slides rotate in an infinite loop and without stopping
  • Autoplay : This option will start the rotating slides automatically.
  • Autoplay Timeout : This option stops the slider after specified time.
  • Autoplay Hover Pause : This option makes the slider pause when the mouse hovers over it.
  • Controls :  This option allows you to select type of controls you want to display in slider.
    • Arrows and Pager : Select this option to display both arrows and pager in your slider.
    • Arrows : Select this option to display only arrows in your slider.
    • Pager : Select this option to display only pager in your slider.
    • None : This option allows you to hide the controllers of your slider.
    slides2

    Arrow Style

  • Background Color :  This option allows you to manage background color of arrows.
  • Color :  This option allows you to manage the color of arrows.
  • Arrow Size:  This option allows you to adjust the size of arrow.
  • Background Size:  This option allows you to manage the size of background area of an arrow.
  • Background Shape:  This option allows you to manage the shap of background area of an arrow.
    • slides4

    Pager Options

  • Color :  This option allows you to manage the color of pager.
  • Dot Size :  This option allows you to manage the size of pager.
  • Active Pager Color :  This option allows you to set different color for active pager.
  • Active Dot Size :  This option allows you to set different size for active pager.
  • Top Spacing :  This option allows you to manage spacing between slider and pager.
    • slides5
    NOTE -In advance option tab . Do more styling to the Slides Widget. To know more about advance option tab. CLICK HERE
    Was this page helpful?
    Yes No