Shopify themes, liquid, logos, and UX
Hi, I'm using an external theme "Ella" in Shopify. However, I just can't seem to slow down the announcement bar text scroll time. I haven't published the theme yet as I want to finish all the edits before publishing, and so I can't provide a link to my problem.
@SkinnyMaverick - if bar is scrolling fast it can be due to javascript, please check if you have any option to slow down in customize settings... else check css for announcement bar to find if it is css
Hi, thank you for commenting. I have checked both the settings in the customization section as well as all the CSS in the original code. Can't find any setting or CSS code that says anything about the announcement bar timing.
@SkinnyMaverick - better to ask theme support then, else you will need to get some expert to do it
Hello @SkinnyMaverick ,
Check the theme settings maybe there you will find an option to control it.
if not then try to ask from theme developer about it.
Alternatively you have to hire a developer to find the code and do the necessary changes.
Thanks
Hi, thank you for your comment. I'm starting to think it's a development thing and that I'll have to contact the developer directly. I've checked all the settings everywhere including the CSS coding.
Hello SkinnyMaverick,
I am just now running into this issue myself, were you able to find a decent fix for this?
Thank you in advance.
I have the fix to this.
Open your theme's code, open up the section announcement-bar.liquid
and insert the following code: assign timeScroll = 12 | times: section.blocks.size
right under: assign hasCountDown = hasCountDown[0]
And that'll do the trick! Simply change the 12 to whatever number you desire, as that adjusts the speed.
Hi! You can do this yourself by simple visiting the Customize code and search announcement-bar.liquid and if you open it you will following code at the start
{%- if section.settings.enable_announcement and section.blocks.size > 0 -%}
{%-liquid
assign arrow = section.settings.arrow_active
assign hasCountDown = section.blocks | where: 'type', 'countdown'
assign hasCountDown = hasCountDown[0]
assign timeScroll =12 | times: section.blocks.size
just change the assign timeScroll = 12 value to your desired speed. If the value is lower speed will be high and higher the value speed will be low. I hope this will solve the problem for many non technical persons.
Shopify and our financial partners regularly review and update verification requiremen...
By Jacqui Mar 14, 2025Unlock the potential of marketing on your business growth with Shopify Academy's late...
By Shopify Mar 12, 2025Learn how to increase conversion rates in every stage of the customer journey by enroll...
By Shopify Mar 5, 2025