Megamog
Try Megamog freeResourcesOther solutions
  • What is Megamog theme?
  • Changelog
  • Refund policy
  • Support policy
  • Terms of Service
  • Getting started
    • Install Megamog theme
      • Install Megamog in 1-click fast way
      • Install Megamog manually
    • Add Custom code/ CSS correctly
    • Integrate Shopify Review apps
    • Mega menu
    • Purchase code & activation
    • Update Megamog theme
    • FoxHome
  • Build for success series
    • Product page for Beauty store like Kylie Jenner 🔥
    • Landing page for Fashion store like Bremont
  • Page's global sections
    • Announcement bar
    • Age verifier pop-up
    • Header
    • Footer
    • Mobile sticky bar
  • Theme sections
    • Before/ After image slider
    • Blog posts
    • Brand list
    • Collapsible content
    • Collection spotlight
    • Collection list
    • Collection links
    • Countdown timer
    • Custom content
    • Favorite product slider
    • Featured collection
    • Featured product
    • Featured promotion
    • Featured products slider
    • Google Maps
    • Image banner
    • Image with text
    • Instagram
    • Lookbook
    • Newsletter
    • Press
    • Product tabs
    • Recently viewed products
    • Scrolling promotion
    • Slideshow
    • Testimonials
    • Video
    • Video hero
    • Banner grid
    • Multiple columns
    • Store locator
  • Theme settings
    • General settings
    • Layout settings
    • Additional pages
    • Advanced
    • Animation
    • Article card
    • Badges
    • Cart settings
    • Checkout
    • Colors & Color schemes
    • Corner radius
    • Currency format
    • GDPR settings
    • Intergrated apps
    • Integration
    • Pop-up & drawer
    • Product card
    • Product options design
    • Product options swatches
    • Social sharing
    • Search settings
    • Store contact
    • Typography
  • Collections & Products
    • Product page
      • Product template
      • Page sections
        • Breadcrumb
        • Product information
        • Product information tabs
        • Product recommedations
    • Collection page
      • Collection template
      • Collection sections
        • Collection banner
        • Product listing
  • Other pages
    • 404 page
    • Blogs
    • Blog posts
    • Cart & Checkout
    • Password
  • FAQS
    • Add a gift wrap option to my cart
    • Add custom badges to my product card
    • Add recipient fields to my gift card product
    • Add/ Remove Social icons in footer
    • Change the default product order in collection
    • Customize search results
    • Move the collection description to under the product listing
    • Remove the tax-included information in product page
    • Set up local pickup
    • Show Payment icons on the Footer
  • TROUBLESHOOTING
    • Contact form submissions not found
    • Translation apps incompatibility
Powered by GitBook
On this page
  • Section settings
  • General settings
  • Block settings
  • Image block settings
  • Announcement block settings
  • Link an image/text
  1. Theme sections

Scrolling promotion

A guide to set up an auto-scroll section

PreviousRecently viewed productsNextSlideshow

Last updated 3 months ago

A scrolling promotion section lets you display an eye-catching auto-scroll row of texts or images without any extra custom code. You will find it is really helpful in showcasing your promotion, brand lists, featured products, or any information.

In this article, we will show you how to add and customize a scrolling promotion section.

Steps:

  1. In the theme editor (Customize), click Add section.

  2. Select Scrolling promotion.

  3. Make necessary changes.

  4. Save the settings.

Section settings

General settings

With section settings, you can control the direction of the auto-scroll (Left/Right), its speed, and the gap between items.

To create a mobile-friendly storefront, this section lets you adjust the item gap overall (on both desktop and mobile view) or respectively.

The auto-scrolling speed can be set between 2s and 60s. The smaller the value, the faster the speed.

Block settings

In a scrolling promotion section, there are two kinds of blocks:

  • Image block: to add image and image link.

  • Announcement block: to add text/icon and link.

Image block settings

Select your image and adjust its height (between 0px and 200px).

Announcement block settings

This block lets you display text and/or add an SVG icon to the scroll.

To add an SVG icon, add this custom code and insert the image link (from your Shopify files).

<div>
<img src="image_link">
</div>

For example:

Link an image/text

Select a page from your Shopify or add an external link to your image/announcement block to direct visitors to your desired destination.

If you are linking your button to an external site, you will need to include the full URL of that page, including the URL's HTTPS protocol.

Tip: simply copy the link right from the address bar of your browser.

💡