Sleek
Try Sleek freeResourcesOther solutions
  • What is Sleek theme
  • Changelog
  • Refund policy
  • Support policy
  • Getting started
    • Install Sleek theme
    • Set up my store as Sleek demo
    • Update Sleek theme
    • Theme license & Transfer
  • BUILD FOR SUCCESS SERIES
    • Homepage for Health & Beauty 🔥
  • Page's global sections
    • General settings
    • Announcement bar
    • Cart drawer
    • Header
      • Mega menu
      • Use Country/ Region selector
      • Use Language selector
    • Footer
    • Mobile navigation bar
    • Pop-up
    • Quick view
  • Theme sections
    • Before/ After image slider
    • Blog post
    • Card images
    • Collage tabs
    • Collapsible tabs
    • Collection image showcase
    • Collection list
    • Collections showcase
    • Collections slider
    • Contact form
    • Countdown timer
    • Custom content
    • Custom liquid
    • Email signup
    • Favorite products
    • Feature list
    • Featured product
    • Featured collection
    • Featured products tab
    • Highlight text with image
    • Image gallery
    • Image with text
    • Image with text columns
    • Image with text overlay
    • Layered images with text
    • Lookbook banner
    • Lookbook cards
    • Lookbook slider
    • Media with collection
    • Multicolumn
    • Press
    • Products bundle
    • Product tabs
    • Product showcase
    • Recently viewed products
    • Rich text
    • Scrolling promotion
    • Slideshow
    • Store locator
    • Testimonials
    • Video
    • Video hero
    • Video with text
  • Theme settings
    • General 🔥
    • Animations
    • Buttons
    • Custom CSS
    • Blog cards
    • Cart
    • Collection cards
    • Color swatches
    • Colors
    • Currency format
    • Layout
    • Logo
    • Product cards
    • Search behavior
    • Social media
    • Typography
  • Collections & Products
    • Product page
      • Product template
      • Page sections
        • Breadcrumbs
        • Product information
        • Related products
        • Sticky add to cart bar 🔥
    • Collection page
      • Collection template
      • Collection sections
        • Collection banner
        • Product grid
    • Collections list page
  • Other pages
    • 404 page
    • Blogs
    • Blog posts
    • Cart
    • Password
    • Search page
  • FAQs
    • Generic
      • Add gift wrap option to my cart
      • Combined listings app
      • How to add custom fonts in Sleek? 🔥
      • JavaScript events for developers
    • Product
      • Set up quantity rules and volume pricing 🔥
      • Add custom badges using product tags
      • Set up Local Pickup option
      • Show dynamic content for Products using Metafields 🔥
Powered by GitBook
On this page
  • How to add a Scrolling promotion section to your Shopify store
  • How to edit a Scrolling promotion section
  • Section settings
  • Block settings
  • FAQs
  • Can I hide the product count from the collection card?
  1. Theme sections

Scrolling promotion

Learn how to create an auto-scrolling promotion section with Sleek

PreviousRich textNextSlideshow

Last updated 8 months ago

A scrolling promotion section lets you display an eye-catching auto-scroll row of logos or images.

You will find it helpful in showcasing your promotions, brand lists, featured products, or any trust-boosting information.

In this article, we will show you how to add a Scrolling promotion section.

How to add a Scrolling promotion section to your Shopify store

Steps:

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

  2. Select Scrolling promotion.

  3. Make necessary changes.

  4. Save the settings.

How to edit a Scrolling promotion section

Section settings

Settings

This is where you can update scroll direction, pause scroll on hover, and adjust scroll speed, item gap on desktop, and item gap on mobile.

  • Vertical alignment: Set how the text is aligned - Top/Middle/Bottom

  • Direct: The scroll direction of the section - from left to right or vice versa.

  • Pause scroll on hover: When hovering over the section, the scrolling stops.

  • Show divider between items: Add borders between the section's blocks.

  • Speed: The speed of the section when scrolling (0.1x to 3x).

  • Horizontal spacing: The spacing between items in a section.

  • Vertical spacing: The padding between the items and the section's container.

Block settings

There are three block types can be added to this section:

  • Image

  • Text

  • HTML

  • Collection

Image

Add an Image to promote your vendor, brand, featured products, etc.

Adjust the Image height on the desktop between 20px and 400px.

Select the Image rounded checkbox if you want the image to have rounded borders.

Then, provide the image with a specific Link to the desired page where you want to direct customers when they click it.

Additionally, you can change the Image height on the mobile device from 20px to 200px.

Text

You can use a Text block to display introductory text or any content you'd like to present.

Provide the text with a specific Link to the desired page where you want to direct customers when they click it.

This Text block allows you to adjust the Text size, Font weight, Font style, Letter spacing, Opacity, and Text style.

Moreover, if you are not into the text color of the section color scheme, you can enable the Use custom color checkbox and change the Custom color for the text.

HTML

You can add your own custom HTML to customize the section.

Collection

Add a preferable or unique Collection that you want to display on the Scrolling promotion and give this collection a Title.

  • If you want to use the collection name, leave the Title field blank.

You can choose a featured Image for the collection.

  • If you want to use the collection image, leave the Image field blank.

Change the Title size to:

  • Heading xs

  • Heading sm

  • Heading md

  • Heading lg

  • Heading xl

  • Heading 2xl

  • Display md

  • Display lg

  • Display xl

In addition, you can enable the Use custom width checkbox to adjust the Desktop width (200px - 800px) and Mobile width (250px - 500px) of the collection block if you prefer not to use the default width.

FAQs

Can I hide the product count from the collection card?

In your theme editor (Customize), go to Theme settings > Collection cards, then disable the Show product count checkbox.

This setting will hide the product count of all collection cards on your website.