Dawn Theme - add third button to Button Block

jantonio
Shopify Partner
1 0 0

Hello All;


New to the platform and liquid.  I am using the Dawn Theme and I am trying to add a third navigation button to the to button block on the Image banner. Looks like it is not as simple as just editing the index.json file. Thank you advance for your time.

 

  "button": {
          "type": "buttons",
          "settings": {
            "button_label_1": "Shop Paintball",
            "button_link_1": "shopify:\/\/collections\/paintball",
            "button_style_secondary_1": false,
            "button_label_2": "Shop Airsoft",
            "button_link_2": "shopify:\/\/collections\/airsoft",
            "button_style_secondary_2": false,
            "button_label_3": "Shop Defense",
            "button_link_3": "shopify:\/\/collections\/airsoft",
            "button_style_secondary_3": false

 

Replies 2 (2)

IP1999
Shopify Partner
118 8 11

i spent an hour on this. do you have a file called image-banner.liquid?

 

you should have somethign liek this

 

 

{
      "type": "buttons",
      "name": "t:sections.image-banner.blocks.buttons.name",
      "limit": 1,
      "settings": [
        {
          "type": "text",
          "id": "button_label_1",
          "default": "Button label",
          "label": "t:sections.image-banner.blocks.buttons.settings.button_label_1.label",
          "info": "t:sections.image-banner.blocks.buttons.settings.button_label_1.info"
        },
        {
          "type": "url",
          "id": "button_link_1",
          "label": "t:sections.image-banner.blocks.buttons.settings.button_link_1.label"
        },
        {
          "type": "checkbox",
          "id": "button_style_secondary_1",
          "default": false,
          "label": "t:sections.image-banner.blocks.buttons.settings.button_style_secondary_1.label"
        },
        {
          "type": "text",
          "id": "button_label_2",
          "default": "Button label",
          "label": "t:sections.image-banner.blocks.buttons.settings.button_label_2.label",
          "info": "t:sections.image-banner.blocks.buttons.settings.button_label_2.info"
        },
        {
          "type": "url",
          "id": "button_link_2",
          "label": "t:sections.image-banner.blocks.buttons.settings.button_link_2.label"
        },
        {
          "type": "checkbox",
          "id": "button_style_secondary_2",
          "default": false,
          "label": "t:sections.image-banner.blocks.buttons.settings.button_style_secondary_2.label"
        }
      ]
    },

 

you need to add a 3rd button there like this 

 

{
      "type": "buttons",
      "name": "t:sections.image-banner.blocks.buttons.name",
      "limit": 1,
      "settings": [
        {
          "type": "text",
          "id": "button_label_1",
          "default": "Button label",
          "label": "t:sections.image-banner.blocks.buttons.settings.button_label_1.label",
          "info": "t:sections.image-banner.blocks.buttons.settings.button_label_1.info"
        },
        {
          "type": "url",
          "id": "button_link_1",
          "label": "t:sections.image-banner.blocks.buttons.settings.button_link_1.label"
        },
        {
          "type": "checkbox",
          "id": "button_style_secondary_1",
          "default": false,
          "label": "t:sections.image-banner.blocks.buttons.settings.button_style_secondary_1.label"
        },
        {
          "type": "text",
          "id": "button_label_2",
          "default": "Button label",
          "label": "t:sections.image-banner.blocks.buttons.settings.button_label_2.label",
          "info": "t:sections.image-banner.blocks.buttons.settings.button_label_2.info"
        },
        {
          "type": "url",
          "id": "button_link_2",
          "label": "t:sections.image-banner.blocks.buttons.settings.button_link_2.label"
        },
        {
          "type": "checkbox",
          "id": "button_style_secondary_2",
          "default": false,
          "label": "t:sections.image-banner.blocks.buttons.settings.button_style_secondary_2.label"
        },
        {
          "type": "text",
          "id": "button_label_3",
          "default": "Button label",
          "label": "t:sections.image-banner.blocks.buttons.settings.button_label_3.label",
          "info": "t:sections.image-banner.blocks.buttons.settings.button_label_3.info"
        },
        {
          "type": "url",
          "id": "button_link_3",
          "label": "t:sections.image-banner.blocks.buttons.settings.button_link_3.label"
        },
        {
          "type": "checkbox",
          "id": "button_style_secondary_3",
          "default": false,
          "label": "t:sections.image-banner.blocks.buttons.settings.button_style_secondary_3.label"
        }
      ]
    },

 

 

 

IP1999
Shopify Partner
118 8 11

for design purposes i left my code with 2 buttone and jsut changed the 

 

"limit": 1,

 

to allow for 2 blocks of buttons 

 

"limit": 2,

 

this allowd me to have 2 buttons on one row and then a second row where i added my 3rd button, and left the 4th one blank.