Last updated 1032 days ago

Before & After

Layout

Allows you to add before and after banner into your page.

Content

Before:

  1. Before Image: Choose an image from the media library.
  2. Image Size: Set the size of the image, from thumbnail to full, or enter a custom size
  3. Label HTML Tag: Wrap the label with a tag, either H1…H6, span, div or paragraph.
  4. Link to: Add a URL of the button.
  5. Add icon? Choose whether to show or hide the icon.
  6. Icon: Choose from a list of Font Awesome icons.
  7. Alignment: Align the content to the right, left or center.

Style

Box:

  1. Container Width: Set the width of the outer container.
  2. Fixed Size: Set the width and height of the button.
  3. Padding: Set the inner spacing between the edge of the content and the edge of the slide.
  4. Background Color: Set the background color of the overlay when you hover over the image.
  5. Border color: Choose the border color.
  6. Border Type: Select the border type, from none, solid, double, dotted, dashed, or grooved.
  7. Border Radius: Set the border radius for the images to control corner roundness.
  8. Border Width: Control the thickness of the border.
  9. Box-shadow: Give the search bar a box shadow.

Label:

  1. Title Typography: Customize the typography of the Title.
  2. Color: Set the post’s Title color. The title appears within the overlay when you hover over the image.
  3. Margin: Set the outer spacing between the edge of the Title and the edge of the item slide.

Navigation:

  1. Color: Set the color for the controls.
  2. Margin: Set the outer spacing between the edge of the button and the edge of the slider.
  3. Padding: Set the inner spacing between the edge of the button and the edge of the slider.
  4. Font Size: Customize the size of the button text.
  5. Add space after icon: Set the inner spacing between the text of the button and the edge of the icon.
  6. Move icon Vertically: Set the vertical position of the icon.
  1. Style: Choose your button style from the list.
  2. Label Text: Enter the button custom text
  3. Label HTML Tag: Wrap the label with a tag, either H1…H6, span, div or paragraph.
  4. Link to: Add a URL of the button.
  5. Add icon? Choose whether to show or hide the icon.
  6. Icon: Choose from a list of Font Awesome icons.
  7. Alignment: Align the content to the right, left or center.

Style

Box:

  1. Container Width: Set the width of the outer container.
  2. Fixed Size: Set the width and height of the button.
  3. Padding: Set the inner spacing between the edge of the content and the edge of the slide.
  4. Background Color: Set the background color of the overlay when you hover over the image.
  5. Border color: Choose the border color.
  6. Border Type: Select the border type, from none, solid, double, dotted, dashed, or grooved.
  7. Border Radius: Set the border radius for the images to control corner roundness.
  8. Border Width: Control the thickness of the border.
  9. Box-shadow: Give the search bar a box shadow.

Label:

  1. Title Typography: Customize the typography of the Title.
  2. Color: Set the post’s Title color. The title appears within the overlay when you hover over the image.
  3. Margin: Set the outer spacing between the edge of the Title and the edge of the item slide.

Navigation:

  1. Color: Set the color for the controls.
  2. Margin: Set the outer spacing between the edge of the button and the edge of the slider.
  3. Padding: Set the inner spacing between the edge of the button and the edge of the slider.
  4. Font Size: Customize the size of the button text.
  5. Add space after icon: Set the inner spacing between the text of the button and the edge of the icon.
  6. Move icon Vertically: Set the vertical position of the icon.
Was this article helpful to you? Yes No

How can we help?

Archives

Looking for help ? Contact Support

Welcome to the documentation page of SassLand. Based on the RTF

Create support ticket