Skip to main content
All CollectionsWeb Widgets
How to customize the Carousel widget
How to customize the Carousel widget

Learn how to personalize your Carousel widget

Updated over a week ago

The Carousel Widget is a visually engaging way to showcase news, articles, or media content in a rotating slideshow format. You can customize its design, animation, navigation, and display settings to best fit your website’s aesthetic and functionality.

Presets

There are multiple presets available for the Carousel widget to fit different layouts and your aesthetic preferences.

  • Default Style – A clean and simple rotating carousel with standard navigation.

  • 6 Columns – A large image-based format that spans the width of the screen for high-impact visuals.

  • Dark Grey – A carousel with a dark background and light text for a modern look.

  • Large Card – A style that displays only one large image at a time, with the title and description overlayed at the bottom.


Customize Settings

Customization options allow you to tailor the widget to fit your needs. These settings can be adjusted for desktop, tablet, and mobile views.

1. General Settings

Card Style – Choose from design styles such as Classic or Gallery.

Number of Posts – Set how many articles or slides should be displayed in the carousel.

Number of Columns – Adjust how many items should be shown per slide.

Padding – Modify the spacing between carousel items for a cleaner look.

Responsive – Enable or disable automatic resizing for different screen sizes.

Width & Height – Set custom dimensions for the carousel.

Open Links – Choose how links should open (new window, same window, or popup).

Auto Play – Enable automatic scrolling through slides.

Speed – Adjust how fast slides transition when auto play is enabled.

Skip Cards – Define how many slides should be skipped in each transition.

Font Family – Select a font style that matches your site’s design.

Navigation – Customize the look of navigation arrows and buttons.

UTM Tags - UTM parameters help track traffic sources. If enabled, you can set:

  • UTM Source

  • UTM Medium

  • UTM Campaign

  • UTM Content

  • UTM Term

Custom CSS Section - Add custom CSS to apply specific design modifications beyond built-in settings. This allows for advanced styling and customization.

No Follow Links - Enable or disable "no follow" attributes for links to control search engine indexing behavior.

2. Card Settings

Title

  • Enable - Toggle the display of titles on posts.

  • Font Size - Adjust the title font size using the plus (+) and minus (-) buttons.

  • Font Height - Customize the line height of the title for better readability.

  • Color - Choose a custom color for the title text using a hex code.

  • Align - Set text alignment (left, center, right).

  • Clip After X Lines - Limit the number of lines displayed in the title before truncating.

Description

  • Enable - Toggle the display of descriptions in posts.

  • Font Size - Adjust the description font size using the plus (+) and minus (-) buttons.

  • Font Height - Customize the description height of the title for better readability.

  • Color - Choose a custom color for the description text using a hex code.

  • Clip After X Lines - Limit the number of lines displayed in the description before truncating.

Hover

  • Clickable Card - Enable or disable whether the entire card is clickable.

  • Enable Shadow - Add a shadow effect to the card.

  • Enable Background - Toggle background visibility on hover.

Image

  • Show Image - Enable or disable the display of images in posts.

  • Clickable Image - Set whether images should act as links.

  • Lazy Loading - Enable to load images only when they come into view.

  • Enable Gradient - Enable a transition between colors.

  • Gradient Color - Set the footer gradient color using a hex code.

  • Image Auto Height - Toggle to allow images to adjust height dynamically.

  • Image Height - Set a custom image height.

Social Sharing

  • Active - Enable or disable social sharing buttons on each card.

  • Round Icons - Choose between round or square social media icons.

  • Select Social Networks - Choose which social media platforms to include in the sharing options.

Border

  • Enable - Toggle border visibility.

  • Border Radius - Adjust the border radius for rounded or sharp edges.

Footer

  • Show Footer - Enable or disable the footer section.

  • Show Author - Toggle author visibility in the footer.

  • Date Format - Choose how the date is displayed (e.g., "Time Ago").

  • Footer Color - Customize the footer background color.

Enable Audio Player (Podcast) - Toggle to enable podcast audio playback.

Background Color - Set the footer background color using a hex code.

3. Title Settings


These settings allow you to control how the title of your feed (e.g. The New York Times - Breaking News, US News, World News and Videos) appears in your widget.

Show Title - Toggle this option to enable or disable the display of the feed title in your widget.

Font Size - Adjust the font size of the title using the plus (+) and minus (-) buttons.

Color - Choose a custom color for the title text using a hex code.

Padding Bottom - Modify the space between the title and the content below it for better spacing and layout control.


Mobile and Tablet Settings

At the top of the screen, you’ll find different icons that allow you to switch between Desktop, Tablet, and Mobile views. By clicking the settings icon, you can also configure breakpoints in pixels for different devices.

In the left bar, you can switch between Tablet and Mobile to adjust settings specific to each device type. Make sure to toggle the Enable general settings for tablet / mobile first.


Presets within Customize

  • Choose from predefined styles in the Presets dropdown menu.

  • Click Save as New to create and store a preset with your custom settings.

Don't forget to save your settings! The widget will update automatically after you save your changes.

To see the Carousel widget on your website, read our How to Use and Embed Widgets guide.


Did this answer your question?