Liquid, JavaScript, themes, sales channels
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
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"
}
]
},
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.
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024