How can I display the name instead of the title in the customizer?

Shopify Discussion

Topic summary

A user encountered an issue where their team member section in Shopify’s customizer displays the member’s title instead of their name in the sidebar navigation. This makes it difficult to identify and edit individual team member entries.

The Problem:

  • When adding team members with photo, name, title, and bio fields, the customizer sidebar shows the title field value rather than the name
  • The user wants the name to appear for easier identification of entries

The Solution:

  • Change the id attribute of the text setting from "title" to "name" in the schema
  • The customizer uses specific field IDs (like “header” or “text_header”) to determine what displays in the sidebar
  • By designating the name field with the appropriate ID instead of title, the editor will show the expected name value

Multiple users confirmed this fix works for resolving the display issue in the customizer interface.

Summarized with AI on November 6. AI used: claude-sonnet-4-5-20250929.
1

Hi there,

so I am quiet new to this and I am lerning about writing sections at the moment. I am facing the following problem:

In the team member section I created you can input a picture, a name, a tittle and a brief description. Unfortunately when you add all this information instead of the Name being depicted in the customizer the title is displayed. In this use case it is vital that the name is displayed (see picture) in order to easily edit the entries.

Bildschirmfoto 2022-03-05 um 14.50.21.png
Bildschirmfoto 2022-03-05 um 14.50.21.png3008×1490 418 KB

I played around with the code I wrote for a couple of hours now but couldn’t figure out what has to be changed to display the name. Can you please enlighten me? :slightly_smiling_face:

Heres the code:


    ## 
        {{section.settings.team_heading}}
    

    
    {% for member in section.blocks %}
        

           
          {% if member.settings.photo%}
                {{ member.settings.photo | img_url: '300x' | img_tag}}
          {% endif%}
            ### {{ member.settings.name}}
            {{ member.settings.title}}
            

{{ member.settings.bio}}

        

    {% endfor %}
    

 

{% schema %}
{
    "name": "Team Members",
    "class": "team_members_section",
    "settings": [
        {
            "id": "team_heading",
            "type": "text",
            "label": "Section Title",
            "default": "Team Members"
        }
       
    ],
    "blocks": [
        {
            "name": "Team Member",
            "type": "staff-profile",
            "settings": [
                {
                    "type": "image_picker",
                    "id": "photo",
                    "label": "Photo"
                },
                {
                    "id": "name",
                    "type": "text",
                    "label": "Name"
                },
                {
                    "id": "title",
                    "type": "text",
                    "label": "Title"
                },
                {
                    "id": "bio",
                    "type": "textarea",
                    "label": "Bio"
                }
                

            ]
        }
    ],
    "presets": [
        {
            "category": "Store Information",
            "name": "Team Members" 
        }
    ]
}
{% endschema %}
2

This is a very old topic, but I also ran into this.

The editor was displaying the text from a setting called “header”.

Instead, I changed the setting id to be “header_text” and that seemed to fix the issue.

Now the editor shows the app name, as expected, rather than the header value.

3

So this a quite old issue but i recently got the same probelm and found the solution, it you use text id title for name insteat of designation then it gonna work