Setting up Scrolling Text background animation on collection pages

This guide provides step-by-step instructions for inserting a scrolling area of text on collection pages. To see it in action, check out the video below.

Since this feature utilizes via a metafield, this guide is structured in two key parts:

• Part 1 - Create the required metafield
• Part 2 - Setting up the text

1. Create the required metafield

First, creating a new metafield named 'Marquee'. This metafield will be displayed in all collections.

• In the Admin dashboard > Settings > Custom data > Collections > Add definition.

  

  

  Please follow these precise instructions for setting up this new metafield:

  • Name - Marquee

    Namespace and key - theme.marquee

    

  • Select type - choose Single line text, then One value.

    

    

• Completing the above steps results in the creation of a new metafield named 'Marquee'.

  

• You will be able to find this Marquee metafield among the listed collection metafields.

  

2. Setting up the text

Add text to the 'Marquee' metafield. This text will be displayed in the collection page.

For instance, let's use the 'Wireless Headphones' collection as an example.

• In Admin dashboard > Products > Collections > choose Wireless Headphones collection.

  

• In Wireless Headphones collection, scroll down and click View all in 'Metafields'.

  

• Click on Marquee metafield. Then, enter the text you want to display, such as 'Discover the perfect headphones for every occasion' in this example.

  

• Finally, click Save to finish.

By following these instructions, the text you entered in the Marquee metafield will be displayed on collection pages that have this metafield enabled.

Need Further Assistance

If you encounter any issues or need additional help with your Concept theme, don't hesitate to reach out to Roartheme's support team for expert guidance.

Scan the QR code to get support within 8 hours via RoarTheme ’s Whatsapp