How to add a dropdown menu to the icons in dawn theme

[PixiePawsPets]

Hello,

How am I able to make a dropdown menu for the icon ‘account’ through the dawn them.
For example like this:

But with my own wording etc. Thank you

[EBOOST]

Hi @PixiePawsPets ,

You only follow structure below:

You only update text, svg, text

[PixiePawsPets]

Thank you for your reply, I am still new to code editing, Can you please show me step by step where to find this area of code to implement please & Thank you!

[EBOOST]

Hi,

May I suggest to update code these steps:

1. Go to Store Online-> theme → edit code

2. Sections/header.liquid
3. Find code like the screenshot below

4. Replace code below

{%- if shop.customer_accounts_enabled -%}
      	
	    

      {%- endif -%}

[PixiePawsPets]

Thank you so much!
It now looks like this;

Would you have the code to add a schemer so I can edit these changes for example “Custom Header Icon drop down Menu” directly from my editor rather then needing to update & change the code each time? So I would be able to also make it match the websites already implemented dropdown menu but with Icons etc. Please & Thank you

[EBOOST]

Hi,

Does it like the screenshot?

[PixiePawsPets]

Hello,
Thats what I would like to have, but mine doesnt show that, example of my header section in editor;

[EBOOST]

Hi,

I am not sure your request. However I suggest code below

1. Add code below to schema sections/header.liquid

{
      "type": "select",
      "id": "iconlogin",
      "options": [
        {
          "value": "login1",
          "label": "Login icon 1"
        },
        {
           "value": "login2",
          "label": "Login icon 2"
        },
        {
           "value": "login3",
          "label": "Login icon 3"
        },
        {
           "value": "login4",
          "label": "Login icon 4"
        }
      ],
      "default": "login1",
      "label": "Custom Header Icon drop down Menu Login"
    },
    {
      "type": "select",
      "id": "iconregister",
      "options": [
        {
          "value": "register1",
          "label": "Register icon 1"
        },
        {
           "value": "register2",
          "label": "Register icon 2"
        },
        {
           "value": "register3",
          "label": "Register icon 3"
        },
        {
           "value": "register4",
          "label": "Register icon 4"
        }
      ],
      "default": "register1",
      "label": "Custom Header Icon drop down Menu Register"
    },
    {
      "type": "select",
      "id": "iconcart",
      "options": [
        {
          "value": "iconcart1",
          "label": "Cart icon 1"
        },
        {
           "value": "iconcart2",
          "label": "Cart icon 2"
        },
        {
           "value": "iconcart3",
          "label": "Cart icon 3"
        },
        {
           "value": "iconcart4",
          "label": "Cart icon 4"
        }
      ],
      "default": "iconcart1",
      "label": "Custom Header Icon drop down Menu Cart"
    },

2. Update code that we suggested to show dropdow to code below

{%- if shop.customer_accounts_enabled -%}
      
      

      {%- endif -%}

3. Replace icons by your icons