We've recently relaunched all three of our themes. Watch the launch video here.

Inline features

The Inline Features section can be used to highlight your core values, your process, or other aspects of your products with a row of short text blocks each with their own custom square or round image.

Inline features section
Inline features section

The Inline features section can be used on the following page templates:

Add an Inline features section to the home page

To add an Inline features section to your home page:

  1. From your Customize theme editor, choose Home page from the pages drop-down menu at the top of the screen.

    Drop-down menu with page types listed
    Drop-down menu with page types listed
  2. Scroll to the bottom of the home page sections and choose Add section.

    Add section button
    Add section button
  3. Choose Inline features from the list of sections.

    This opens the Inline features settings.

  4. Choose to display 2, 3, or 4 Columns per row.

  5. Choose the Image shape to be Round or Square.

  6. Set the Text alignment to display the heading and subheading on the Right or Left of the images.

  7. Return to the list of Home page sections to find your new Inline features section.

    Use the drag handles to rearrange the order of your Home page sections:

    Shopify section drag handles
    Shopify section drag handles
  8. Use the Add features button to add a small image with text.

    For more information, see the Add features section.

  9. Use the Save button in the top-right corner when you are finished editing.

Add an Inline features section to other pages

You can add a Inline features section to your Collection pages and Product pages templates.

To enable an Inline features section on these pages:

  1. From your Customize theme editor, choose Collections or Products from the pages drop-down menu at the top of the screen.

    Drop-down menu with page types listed
    Drop-down menu with page types listed
  2. Click on the arrow beside Collection features or Product features.

  3. Use the Add block button to select Inline features.

    This opens the Inline features section settings.

    You can add up to 4 features.

  4. Choose to display 2, 3, or 4 Columns per row.

  5. Choose the Image shape to be Round or Square.

  6. Set the Text alignment to display the heading and subheading on the Right or Left of the images.

  7. Select an Image and change the Heading and Subheading text for each feature.

  8. Return to the list of Product or Collection features. Use the drag handles to rearrange the order of the blocks:

    Shopify content block drag handles
    Shopify content block drag handles
  9. Use the Save button in the top-right corner when you are finished editing.

Inline features section settings

The Inline features section has the following settings:

Configuration Settings

Columns per row

Choose to display 2, 3, or 4 features per row.

Image shape

Choose to display the image as Round or Square.

Text alignment

Choose to display the headings and subheadings of each feature to the Left or Right of each image.

Use alternate selection color

Set the background color to the Alternate Section Color as chosen in your Color Settings.

See Spark's Color settings documentation to learn how to set Alternate section colors.

Add features

To add a new feature to your Inline features section:

  1. Make sure you are already editing the [Inline features features][inline-features] section that you want to change.

  2. Use the Add Feature button to choose from your store's list of collections.

    This opens the individual feature settings.

  3. Check the Show image checkbox.

  4. Use the Select image button to add a small image to display to the feature content.

    You image should be square and ideally 160px by 160px.

  5. Change the Heading text.

  6. Add Subheading text.

    Use this section to describe the feature in more detail.

  7. Return to the list of Home page sections to find your Inline features section.

  8. Repeat this process until you've added all the features you need.

  9. You can change the order of the blocks by using the drag handles:

    Shopify content blocks drag handles
    Shopify content blocks drag handles

    You can also use the Remove block button to remove a block from this section entirely.

  10. Use the Save button in the top-right corner when you are finished editing.

Feature block settings

Each feature block has the following settings:

Configuration Settings

Image

Select or upload an image to accompany or illustrate the individual feature.

We recommend a square image, ideally 160px by 160px.

Heading

Add heading text.

We recommend a title of just a few words long.

Subheading

Add subheading text to describe the feature.

Contact

🇨🇦 Fluorescent Design Inc.

Send us a message
  • Toronto OfficeMonday to Friday, 10am to 6pm ET
  • Victoria (B.C.) OfficeMonday to Friday, 10am to 6pm PT
  • Average Response Time~1 Business Day
* Excludes statutory holidays. All offices closed to the public.