# Slideshow

### Configure the section

Select the customize theme option. Click on the dropdown menu at the top of the page to select the **Home page** template.

From the side menu, select **Slideshow.**

Click on the dropdown arrow beside the slideshow.

Click on **Add Slide.**

Customize the slideshow section by utilizing the settings on the right side of the theme editor, as described below:

<table data-header-hidden><thead><tr><th width="281"></th><th></th></tr></thead><tbody><tr><td>Slideshow</td><td><strong>Section visibility</strong><br>Select from the options to select the visibility of this section:<br>-Always<br>-Small (On selecting this, the section will be visible on mobile devices only.)<br>-Large (On selecting this, the section will be visible on large devices only.)<br><br><strong>Color scheme</strong><br>Select any color scheme defined in the theme settings>Colors>Schemes.</td></tr><tr><td>Layout</td><td><strong>Desktop height</strong><br>Choose the media height for desktop from the range bar having a minimum value of 500px and a maximum of 1000px.<br><br><strong>Mobile height</strong><br>Choose the media height for mobile from the range bar having a minimum value of 200px and a maximum of 600px.</td></tr><tr><td>Grid Layout</td><td><strong>Grid columns</strong><br>Adjust the range bar to determine the number of columns on the desktop view.<br><br><strong>Grid rows</strong><br>Adjust the range bar to determine the number of rows on the desktop view.<br><br><strong>Mobile columns</strong><br>Adjust the range bar to determine the number of columns on the mobile view.<br><br><strong>Mobile row</strong> <br>Adjust the range bar to determine the number of rows on the mobile view.</td></tr><tr><td>Appearance</td><td><strong>Show separator line</strong><br>Enable this checkbox to show separator border.<br><br><strong>Show pagination</strong><br>Enable this checkbox to show pagination.<br><br><strong>Auto rotate slides(Automatically cycles slides)</strong><br>Enable this checkbox to auto rotate the slides. It automatically cycles the slides.<br><br><strong>Change slides every</strong><br>Adjust the range bar to determine the speed of auto rotating slides in seconds.</td></tr><tr><td>Section spacing</td><td><p><strong>Desktop top space</strong> <br>Adjust the range bar to add spacing at the top of the section for desktop view.<br></p><p><strong>Desktop bottom space</strong> <br>Adjust the range bar to add spacing at the bottom of the section for desktop view.<br></p><p><strong>Mobile top space</strong><br>Adjust the range bar to add spacing at the top of the section for mobile view.<br></p><p><strong>Mobile bottom space</strong><br>Adjust the range bar to add spacing at the bottom of the section for mobile view.</p></td></tr></tbody></table>

### Block settings: Slide

<table data-header-hidden><thead><tr><th width="285"></th><th></th><th data-hidden></th></tr></thead><tbody><tr><td>Color scheme</td><td>Select any color scheme defined in the theme settings>Colors>Schemes.</td><td></td></tr><tr><td>Media</td><td>Type<br>Choose from image or video for the media.<br><br>Image<br><strong>Desktop image</strong><br>Select an image to show in the desktop view.<br><br><strong>Mobile image</strong><br>Select an image to show in the mobile view.<br><br>Video<br><strong>Video</strong><br>Select any video to show as a background video in slides.<br><em>(Note: It supports only .mp4 videos.)</em></td><td></td></tr></tbody></table>

**Block settings below Slide**

<table><thead><tr><th width="291"></th><th></th></tr></thead><tbody><tr><td>Heading</td><td><p><em><strong>Heading</strong></em> </p><p><em>Add heading text.</em> <br><em>(<strong>Note</strong>: Use '++' to add a line break , '[]' for text underline, '[[]]' for text oval underline and '()' for highlighted text &#x26; background. Make text bold to show markers font.)</em><br><br><strong>Heading size</strong><br>Select the font size from the following options:<br>- Custom<br>- Extra small
<br>- Small
<br>- Regular
<br>- Medium
<br>- Large
<br>- Extra large
<br>- Double Extra large<br><br>Custom<br><strong>Desktop size</strong><br>Adjust the range bar to determine the heading size on desktop.<br><br><strong>Mobile size</strong><br>Adjust the range bar to determine the heading size on mobile.<br><br><strong>Heading tag</strong><br>Specify heading code types from H1-H6, div, span or p tag for SEO and search engines for crawling purposes.<br><br><strong>Markers font family</strong><br>Choose the markers text font family from the following options:</p><p>- Heading <br>- Body <br>- Accent <br>(<em><strong>Note</strong>: These fonts can be changed in theme settings>typography.)</em><br><br>Highlight text</p><p><strong>Text</strong></p><p>Choose the text color for highlight text.<br><br><strong>Background</strong><br>Choose the background color for highlight text.<br><br><em>------------------------------------------------------------------</em><br><strong>Grid settings:</strong><br><strong>DESKTOP and MOBILE</strong><br><strong>Column start</strong><br>Adjust the range bar to choose the value of column start, i.e. the cell from where column will start.<br><br><strong>Column end</strong><br>Adjust the range bar to choose the value of column end, i.e. the cell where column will end.<br><br><strong>Row start</strong><br>Adjust the range bar to choose the value of row start, i.e. the cell from where row will start.<br><br><strong>Row end</strong><br>Adjust the range bar to choose the value of row end, i.e. the cell from where row will end.<br><br><strong>Horizontal adjustment</strong><br>Adjust the range bar to choose the horizontal adjustment of added text.<br><br><strong>Vertical adjustment</strong><br>Adjust the range bar to choose the vertical adjustment of added text.</p></td></tr><tr><td>Description</td><td><p><strong>Description</strong> </p><p>Add description text.  <br><br><strong>Grid settings:</strong><br><strong>DESKTOP and MOBILE</strong><br><strong>Column start</strong><br>Adjust the range bar to choose the value of column start, i.e. the cell from where column will start.<br><br><strong>Column end</strong><br>Adjust the range bar to choose the value of column end, i.e. the cell where column will end.<br><br><strong>Row start</strong><br>Adjust the range bar to choose the value of row start, i.e. the cell from where row will start.<br><br><strong>Row end</strong><br>Adjust the range bar to choose the value of row end, i.e. the cell from where row will end.<br><br><strong>Horizontal adjustment</strong><br>Adjust the range bar to choose the horizontal adjustment of added text.<br><br><strong>Vertical adjustment</strong><br>Adjust the range bar to choose the vertical adjustment of added text.<br>- XX-small</p></td></tr><tr><td>Button</td><td><strong>Label</strong><br>Enter the button label.<br><em>(Note: Leave the label blank to hide the button.)</em><br><br><strong>Link</strong><br>Add the button link to redirect it.<br><br><strong>Button type</strong><br>Choose the button type from the following options:<br>- Animated<br>- Classic<br><br><strong>Button style</strong><br>Choose the button style from the following options:<br>- Solid<br>- Outlined<br>- Link <br><br><strong>Button size</strong><br>Select from the following options to determine the button size.<br>- Small<br>- Regular<br>- Large<br><br><strong>Grid settings:</strong><br><strong>DESKTOP and MOBILE</strong><br><strong>Column start</strong><br>Adjust the range bar to choose the value of column start, i.e. the cell from where column will start.<br><br><strong>Column end</strong><br>Adjust the range bar to choose the value of column end, i.e. the cell where column will end.<br><br><strong>Row start</strong><br>Adjust the range bar to choose the value of row start, i.e. the cell from where row will start.<br><br><strong>Row end</strong><br>Adjust the range bar to choose the value of row end, i.e. the cell from where row will end.<br><br><strong>Horizontal adjustment</strong><br>Adjust the range bar to choose the horizontal adjustment of added text.<br><br><strong>Vertical adjustment</strong><br>Adjust the range bar to choose the vertical adjustment of added text.</td></tr></tbody></table>