The Imageboard widget is a dynamic tool that lets you showcase images and content in a visually striking layout, offering easy customization to align with your website's design and enhance user engagement.

Presets

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

Default Style - Standard padding and the default card layout.

Preset 1 - A clean, organized design with less padding.

Preset 2 - A dynamic layout with varying image sizes to add visual interest and create an engaging flow.

Preset 3 - A modern, flexible layout with gradient.

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

Inner Padding - Controls the space between images and the edges inside the container.

Outer Padding - Adjusts the space outside the widget.

Responsive - Enable or disable responsive design for mobile optimization.

Height - Modify the height of your widget.

Open Links - Choose how links open (new window or same window).

Font Family - Select a font that matches your site’s design and branding.

Background Color - Pick a background color for the widget.

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.

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

2. Layout Settings

The Layout settings offer you several options for arranging images.

2. Card Settings

These expandable sections allow you to fine-tune how individual card elements appear in your Imageboard widget.

Title

Enable - Toggle the display of titles on posts.

Large Card

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.
Clip After X Lines - Limit the number of lines displayed in the title before truncating.

Small Card

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.
Clip After X Lines - Limit the number of lines displayed in the title before truncating.
Bold Font - Enable or disable bold styling for the title.
Italic Font - Enable or disable italic styling for the title.
Color - Choose a custom color for the title text using a hex code.
Align - Set text alignment (left, center, right).

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.
Align - Set text alignment (left, center, right).
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 - Add a gradient effect to the card.
Gradient Color - Choose a custom color for the gradient using a hex code.

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.

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.

Radius - Adjust how rounded the edges of article cards should be.

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.