Slider

The slider block is a useful design element used to showcase images and other content.

It is a slideshow that is useful for businesses who want to showcase professional portfolios or display relevant content.

You can easily modify its appearance to add a design feature to your page or website.

The Cwicly slider block is empty by default but the required number of slide blocks are easy to add from the quick inserter.

Add

If you want to add a slider outside any other block on the page:

  1. Click on the βž• ​​icon to open the Inserter Panel

  2. Click on the block to insert it into your page

If you want to add a slider inside a parent block:

  1. Open the Inserter Panel panel in the parent block

  2. Click on the block to insert it into your parent block

Slider Placeholder

When you add a slider block, a Slider Placeholder will appear.

You can add a Slide block by selecting "+ Add Slide Block" or by clicking the "+" icon in the toolbar.

To remove the Slider Placeholder, click the "dismiss button".

Add Slide block

Add slide allows you to add slide blocks to your Slider.

Add
  1. Select a slider block

  2. Open the Quick Insert panel in the slider block

  3. Click on βž• to insert a new Slide block into your slider block

Remove
  1. Select Slider block

  2. Find Navigation Panel

  3. Find required slide

  4. Click on X to remove

Slider Settings

The Slider Settings tab allows you to adjust the settings of each slideshow independently so you can have multiple sliders on your page or website, each with their own design and individual customisations.

pageSettings

The Navigation property allows you to navigate through the Slides in your slider by clicking on left and right arrows.

pageNavigation

Dots

The Dots property allows you to navigate through the Slides in your Slider by clicking dots.

pageDots

Colours

The Colours property allows you to modify the colours of the Slider such as: Text, Links, Background.

Modify
  1. Select the slider block

  2. Open the Block Inspector

  3. Navigate to the Primary tab

  4. Find Colours tab

  5. Find required parameter (Text, Link, Background)

  6. Modify Text, Link, Background colours as required

  7. Click dot(s) to reset

Last updated