Need help with a code for revolving text

Store Design
,
1

Looking to implement this similar to the below. Any advise?

https://stackoverflow.com/questions/70400035/how-can-i-mimic-this-revolving-text-animation-for-my-e-commerce-store

2

Hi @PhoneCases ,

I would like to give you some recommendations to support you

You need to find the code containing the above content and edit it according to the template:

## 
Your One Stop Hobby Shop

updated code:

## 
Your One Stop **HobbyShop**

Open your theme.liquid theme file

Paste below code before :

and change color if you want:

Please don’t hesitate to reach out if you need further help optimizing or customizing your store. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

Best Regards,
LuffyOnePiece

1 Like
3

Not sure I understand. Is this the code to make happen as the example link shown?

https://stackoverflow.com/questions/70400035/how-can-i-mimic-this-revolving-text-animation-for-my-e-commerce-store

4

I entered all the code and it works like a charm! Is it possible to only flip “For the …” vs the whole line? Also, this code flips hard. Can it be more of a rolling smother flip?

5

I have this live on my site if you can take a look. On mobile, some of the custom text show on two lines. Can this be resolved?

6

Here is my current code. All works as designed. However, I am wanting to make each “The Bold” scrolling text a different color.

Phone Case For<br

var example = ['THE BOLD :smiling_face_with_sunglasses: ','THE CONFIDENT :selfie: ','THE INFLUENCER?‍ :female_sign: ', 'THE UNIQUE?' ]; textSequence(0); function textSequence(i) { if (example.length > i) { setTimeout(function() { document.getElementById("sequence").innerHTML = example[i]; textSequence(++i); }, 2000); // 1 second (in milliseconds) } else if (example.length == i) { // Loop textSequence(0); } }
7

Hi @PhoneCases ,

Try adding below code.

##

Thank you

8

Thank you much!! - PERFECT