How Can We Help?

Search for answers or browse our knowledge base.

< All Topics

Full-width Slider

The easy way to get the full design is to import the demo page and galleries, and then you can either edit those or remove the extra blog post or pages that you wouldn't be using. Here are the instructions:

But you can recreate that page from scratch as well.
Note: Tested on Iconic demo.

  1. Edit your page or create a new page.
    You need to have active kadence and the Gutenberg editor.
    If you are using the Classic Editor, you can switch to the Block system here:
Switch to block editor
  1. Include the element called "Row Layout".
Sample full-width
  1. Select the layout.
Full width Column
  1. Select parent (Row Layout).
Full width setting
  1. Select Vertical Align "Middle".
Full width setting colum vertical
  1. Select the background Settings, choose the slider in the middle, and set up the number of Sliders.
Sliders, setting
  1. Choose each image to be used for each slider.
Add slider Select image
  1. On structure settings, make sure to set up the Min Height to 100 vh.
Structure settings sample full width row
  1. Scroll down, and find these footer settings. Adjust the Content Layout to "100% Full width".
100% full width content layout
  1. Title to: Disable.
Disable title
  1. Footer: Display Footer Widget Area and Copyright to "Disable".
Disable footer area
  1. Update the page and save the page.
    Note: If you like to add that as your homepage, you should adjus that in your WordPress Dashboard > Settings > Reading
Table of Contents
Close Menu