Adding a section

Store Design
, , ,

Topic summary

Main issue: Add a “features/services” section (icons with text) in the Shopify Dawn theme without a built‑in option; the store owner has no coding experience.

Early attempts: A custom section (features.liquid) with static HTML was suggested, but saving it did not change the storefront and later caused Shopify errors. Another HTML-only snippet with responsiveness and example images was shared, showing expected layouts, but it wasn’t integrated correctly.

Theme options: “Icon with text” isn’t available in Dawn. Multiple participants recommended using the built‑in Multicolumn section to achieve a similar layout.

Sizing problem: The user’s icons displayed too large even at 100x100. Fix: Add CSS in the theme editor — .multicolumn-list__item .media { padding-bottom: 30% !important; } — which the user confirmed solved the issue and looked great.

Latest update: A Liquid-based approach was provided to make the services section dynamic (create service-section.liquid, insert the loop, and include it with {% section ‘service-section’ %}). This aims to manage items via Shopify admin.

Outcome: Immediate display and sizing issues were resolved using Multicolumn + CSS. The thread remains open for those wanting a fully dynamic custom section; images/screenshots were used to illustrate the expected layout.

Summarized with AI on December 16. AI used: gpt-5.
21

Hello @Lunix_I , The code I provided earlier was just HTML. To make the service section dynamic and manageable via Shopify, please try this Liquid code:


  {% for service in section.settings.services %}
    

      {% if service.image != blank %}
        
      {% endif %}
      ### {{ service.title }}
      

{{ service.description }}

    

  {% endfor %}

Implementation Instructions:

  • Create a New Section: In your Shopify theme, go to the Sections directory and create a new file named service-section.liquid.

  • Insert the Code: Copy the Liquid code provided above into the new file.

  • Add to Your Theme: You can include this section in your desired template by using the following Liquid tag:

{% section 'service-section' %}

This setup will allow you to manage the services directly from the Shopify admin panel, where you can easily add, remove, or update service items.

If you have any further questions or need additional assistance, feel free to ask!