Feature

Overview #

The Feature block is designed to highlight specific features or announcements within a theme. It provides a structured way to present key information with optional links and visibility settings. This block is primarily used in the "Features bar" section of the theme.

Key components and functionality #

Icon

The icon setting allows you to select an icon to visually represent the feature. This can help draw attention to the feature and make it more recognizable.

• Default: auto_awesome

Title

The title setting is used to provide a concise and descriptive name for the feature. This is typically the first piece of information users will see.

• Default: Feature title

Subheading

The subheading provides additional context or a brief description of the feature. It is recommended to keep this text concise, ideally under 48 characters.

• Default: Feature description

Link

This setting allows you to add a URL that users can click to learn more about the feature or access related content.

Open link in a new tab

This checkbox determines whether the link should open in a new browser tab when clicked. This can be useful for keeping users on the current page while exploring additional content.

• Default: false

Visibility

The visibility setting controls when and where the feature is displayed. You can choose to hide the feature on specific devices or keep it visible everywhere.

• Options:
  1. Do not hide
  2. Hide on desktop
  3. Hide on mobile
• Default: Do not hide

Available in sections #

• Features bar

Usage notes #

• Responsive Design: Ensure that the visibility settings are configured to optimize the display across different devices.
• Performance: Use concise text and relevant icons to maintain a clean and fast-loading page.
• Accessibility: Ensure that the text and icons are easily readable and distinguishable for all users, including those with visual impairments.

Usage examples #

1. Highlighting a New Product Feature:

   • Use the icon to represent the product category.
   • Set the title to the product name.
   • Use the subheading to describe the new feature.
   • Add a link to the product page and choose to open it in a new tab.

2. Announcing a Limited-Time Offer:

   • Select an attention-grabbing icon.
   • Title the block with the offer name.
   • Use the subheading to specify the offer details.
   • Link to the offer page and ensure it opens in a new tab for easy navigation.