How to add exactly the same slider like this in dawn theme :
Topic summary
A user wants to implement an announcement slider similar to a reference screenshot in their Dawn theme.
Solution Provided:
- A developer shared base code for creating a custom announcement bar slider section (announcement-bar-slider.liquid)
- The code includes schema settings for multiple announcement texts that rotate/slide
- Emphasized this is starter code requiring customization to match the specific theme structure
Current Status:
- The user attempted implementation but encountered issues (shown in follow-up screenshot)
- Developer clarified that simply copy-pasting won’t work—the code must be adapted to the theme’s existing files
- Offered hands-on assistance to implement the changes if the user cannot modify the code themselves
Key Requirement: This solution requires custom coding knowledge and theme file integration, not a plug-and-play approach.
Hi @beniwalanish you need to accomplish it with the help of custom code, I can provide you the base code and you need to edit the base code according to your theme files.
- Add the following code to the new section file (announcement-bar-slider.liquid)
{% for announcement in section.settings.announcements %}
{{ announcement.text }}
{% endfor %}
{% schema %}
{
"name": "Announcement Bar Slider",
"settings": [
{
"type": "list",
"id": "announcements",
"label": "Announcements",
"default": [
{
"text": "Free shipping on orders over $50!"
},
{
"text": "New collection just launched!"
},
{
"text": "Subscribe to our newsletter for special offers."
}
],
"item": {
"type": "text",
"id": "text",
"label": "Announcement Text"
}
}
]
}
{% endschema %}
Note: This is the base code, you need to edit it according to your theme file.
If you will unable to implement the same then I’m happy to do this for you, let me know. I can implement the code changes so that this will work well for you.
Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!
Best Regards
Sahil
Hi @beniwalanish As mentioned you earlier that was a base code, you need to edit it according to your theme files, just copy and pasting the same code will not work, so please update the code according to your theme code files and it will work perfectly fine.
If you will unable to implement the same then I’m happy to do this for you, let me know. I can implement the code changes so that this will work well for you.
Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!
Best Regards
Sahil