Dawn Theme Announcement bar not rotating

ben123456
Shopify Partner
2 0 0

Hi am currently developing a store using the dawn theme and the autorotate feature for both desktop and mobile is not working. I am unsure as to what is causing this, I tried creating a new theme under the same store and it still was not working. Anyone know how to fix this?

Replies 3 (3)

BrewBrains
Shopify Partner
95 13 18

Hi @ben123456 ,

 

You can add code by following these steps
1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file
3. Paste the below code before </body> on theme.liquid

 

<style>
         .announcement-bar {
                height: 50px;
                overflow: hidden;
                position: relative;
                background: #fefefe;
                color: #333;
                border: 1px solid #4a4a4a;
            }
            
            .announcement-bar p {
                position: absolute;
                width: 100%;
                margin: 0;
                line-height: 28px;
                text-align: center;
                -moz-transform: translateX(100%);
                -webkit-transform: translateX(100%);
                transform: translateX(100%);
                -moz-animation: scroll-left 2s linear infinite;
                -webkit-animation: scroll-left 2s linear infinite;
                animation: scroll-left 20s linear infinite;
            }
            
            @-moz-keyframes scroll-left {
                0% {
                    -moz-transform: translateX(100%);
                }
                100% {
                    -moz-transform: translateX(-100%);
                }
            }
            
            @-webkit-keyframes scroll-left {
                0% {
                    -webkit-transform: translateX(100%);
                }
                100% {
                    -webkit-transform: translateX(-100%);
                }
            }
            
            @keyframes scroll-left {
                0% {
                    -moz-transform: translateX(100%);
                    -webkit-transform: translateX(100%);
                    transform: translateX(100%);
                }
                100% {
                    -moz-transform: translateX(-100%);
                    -webkit-transform: translateX(-100%);
                    transform: translateX(-100%);
                }
            }


</style>

 

Was my reply helpful? Click Like to let me know!

Was your question answered? Mark it as an Accepted Solution.

Was I helpful?

Buy me a coffee


Sandesh Paudyal |

| Shopify Partner


Need help with your store?

 sandeshpaudyal99@gmail.com

For quick response - Message Me : +9779851353732

Anshul_arora
Navigator
291 68 48

Hello @ben123456 ,

I understand you are facing an issue on rotating the Announcement Bar.

Please check in your Dawn Theme Customizer, as you have checked the "Auto-rotate announcements" option.

As, this can be the reason for your issue.

Anshul_arora_0-1711541550243.png

 

I hope it helps

Thank you.

Please remember to like and accept the solution to help other store owners.

For Shopify Design & Development | Custom Coding -Visit Here
ben123456
Shopify Partner
2 0 0

Autorotate is already selected, however it is not working on the mobile site or the desktop version.