My shopify stores slide "shop now" link isnt working

Technical Q&A

Topic summary

Issue: “Shop now” buttons in the homepage hero slider (Judasona theme) don’t open the intended collection links, despite the URLs themselves being valid.

What was shared: The site URL (littlelullabuy.com) and theme code, including the Liquid section and its schema. The anchor uses href {{ block.settings.slider_btn_url }} and label from {{ block.settings.slider_btn }}.

Diagnosis: The schema defines the button URL setting as slider_btn_URL (with capital “URL”), while the template references slider_btn_url (lowercase). This mismatch means the href receives no value, so the buttons don’t work. In Shopify, the setting id must match exactly between schema and Liquid.

Fix proposed: Rename the schema setting id from slider_btn_URL to slider_btn_url (or update the Liquid to match the schema). A screenshot was provided highlighting the exact change.

Status/outcome: A solution was provided and the helper asked to mark it as solved. No explicit confirmation from the original poster yet, so resolution is pending user confirmation.

Notes: No conflicting opinions. The screenshot is illustrative of the code line to change.

Summarized with AI on February 15. AI used: gpt-5.
1

Hello. My shopify stores shop now buttons on the slides on my home page aren’t working.

I don’t know what’s going on with it I have verified that the links they go to are right and are actually working but the buttons won’t bring the different corresponding product collections up. I have the code here. Below.

It’s the Judasona theme on shopify.

{%- for block in section.blocks -%}
{%- if block.settings.slider_title != '' -%}

{{ block.settings.slider_title }}

{%- endif -%}

{%- if block.settings.slider_btn != ‘’ -%}
{{ block.settings.slider_btn }}
{%- endif -%}

{%- endfor -%}
.hero-content a { color: {{ section.settings.slider_btn_text_color }}; background-color: {{ section.settings.slider_btn_bg_color }}; -webkit-box-shadow: 0 2px 1px {{ section.settings.slider_btn_text_color }}; box-shadow: 0 2px 1px {{ section.settings.slider_btn_text_color }}; } .hero-content a:hover { background-color: {{ section.settings.slider_btnhover_bg_color }}; color: {{ section.settings.slider_btnhover_text_color }}; } .hero-slider-one .slick-arrow, .hero-slider-one .slick-dots { background-color: {{ section.settings.dirnav_bg_color }}; color: {{ section.settings.dirnav_color }}; } .hero-slider-one .slick-arrow:hover { background-color: {{ settings.theme_color }}; color: #ffffff; } .hero-slider-one .slick-dots li.slick-active button { background-color: {{ settings.theme_color }}; border-color: {{ settings.theme_color }}; }
1 Like
2

@Ctmph2022

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

3

Www.littlelullabuy.com<>

4

Hi @Ctmph2022 ,

Please send me the code of the whole file, I will help you to check the schema, it is possible that there is an error when declaring the variable.

5

{%- for block in section.blocks -%}

{%- if block.settings.slider_title != ‘’ -%}

{{ block.settings.slider_title }}

{%- endif -%}

{%- if block.settings.slider_btn != ‘’ -%}
{{ block.settings.slider_btn }}
{%- endif -%}

{%- endfor -%}


.hero-content a {
color: {{ section.settings.slider_btn_text_color }};
background-color: {{ section.settings.slider_btn_bg_color }};
-webkit-box-shadow: 0 2px 1px {{ section.settings.slider_btn_text_color }};
box-shadow: 0 2px 1px {{ section.settings.slider_btn_text_color }};
}
.hero-content a:hover {
background-color: {{ section.settings.slider_btnhover_bg_color }};
color: {{ section.settings.slider_btnhover_text_color }};
}
.hero-slider-one .slick-arrow, .hero-slider-one .slick-dots {
background-color: {{ section.settings.dirnav_bg_color }};
color: {{ section.settings.dirnav_color }};
}
.hero-slider-one .slick-arrow:hover {
background-color: {{ settings.theme_color }};
color: #ffffff;
}
.hero-slider-one .slick-dots li.slick-active button {
background-color: {{ settings.theme_color }};
border-color: {{ settings.theme_color }};
}

{% schema %}
{
“name”: “Slider”,
“settings”: [
{
“type”: “header”,
“content”: “Color”
},
{
“type”: “color”,
“id”: “slider_title_color”,
“label”: “Title Color”,
“default”: “#1a161e”
},
{
“type”: “color”,
“id”: “slider_btn_text_color”,
“label”: “Button Text Color”,
“default”: “#1a161e”
},
{
“type”: “color”,
“id”: “slider_btn_bg_color”,
“label”: “Button BG Color”,
“default”: “#94c7eb”
},
{
“type”: “color”,
“id”: “slider_btnhover_text_color”,
“label”: “Button Hover Text Color”,
“default”: “#ffffff”
},
{
“type”: “color”,
“id”: “slider_btnhover_bg_color”,
“label”: “Button Hover BG Color”,
“default”: “#ff708a”
},
{
“type”: “header”,
“content”: “Direction+Control Nav”
},
{
“type”: “color”,
“id”: “dirnav_color”,
“label”: “Nav Color”,
“default”: “#1a161e”
},
{
“type”: “color”,
“id”: “dirnav_bg_color”,
“label”: “Nav BG Color”,
“default”: “#94c7eb”
}
],
“blocks”: [
{
“type”: “slide”,
“name”: “Slide”,
“settings”: [
{
“type”: “image_picker”,
“id”: “slider_bg_img”,
“label”: “BG Image”,
“info”: “Recommended size: 1920x752px”
},
{
“type”: “textarea”,
“id”: “slider_title”,
“label”: “Title”,
“default”: “Get 35% off
Latest Baby Product”,
“info”: “Use ’
’ tag for line break”
},
{
“type”: “text”,
“id”: “slider_btn”,
“label”: “Button Text”,
“default”: “SHOP NOW”
},
{
“type”: “url”,
“id”: “slider_btn_URL”,
“label”: “Button url”,
“default”: “/collections/all”
}
]
}
],
“presets”: [
{
“name”: “Slider”,
“category”: “1. Slider”,
“blocks”: [
{“type”: “slide”},
{“type”: “slide”}
]
}
]
}
{% endschema %}

{% stylesheet %}
{% endstylesheet %}

{% javascript %}
{% endjavascript %}

6

Hi @Ctmph2022 ,

Please change code here:

Screenshot.png
Screenshot.png1237×577 26.9 KB

Change: slider_btn_URL => slider_btn_url

Hope it helps!

7

Hi @Ctmph2022 ,

If it helped you solve your issue, please mark it as a solution. Thank you and good luck.