Feature

The Feature block is a versatile tool designed to highlight specific features or announcements within a theme. It allows you to present key information with optional links and visibility settings, making it ideal for drawing attention to important content. This block is primarily used in the "Features bar" section, providing a structured way to showcase features with icons, titles, and subheadings.

Key settings include the ability to select an icon, set a descriptive title, and provide a brief subheading for additional context. You can also add a URL link for users to explore more about the feature, with the option to open the link in a new tab. Visibility settings allow you to control when and where the feature is displayed, ensuring optimal presentation across different devices.

Practical usage examples include highlighting a new product feature by using an icon to represent the product category, setting the title to the product name, and using the subheading to describe the new feature. Additionally, you can announce a limited-time offer by selecting an attention-grabbing icon, titling the block with the offer name, and linking to the offer page for easy navigation.

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.