How to customize the sold out badge to a red dot in Spotlight theme?

Shopify Discussion

Topic summary

A user sought help customizing the Spotlight theme’s sold-out badge to display as a small red dot instead of the default badge.

Solution Provided:

  • Add custom CSS code to the theme.liquid file, specifically after the <head> tag
  • Access via: Online Store > Themes > Edit code

Outcome:

  • The solution was successfully implemented and worked perfectly for the user
  • Issue resolved
Summarized with AI on November 11. AI used: claude-sonnet-4-5-20250929.
1

Hello,

I’m using the Spotlight theme and would like to customize the sold out badge to just be a small red dot like the image below.

Thanks!

Screenshot 2024-03-03 at 10.15.09 PM.png
Screenshot 2024-03-03 at 10.15.09 PM.png642×764 462 KB

2

Hi @sggallery

I’m Dan from Ryviu: Product Reviews & QA.

Please add this code below to your theme.liquid file, after in Online Store > Themes > Edit code

Screenshot 2024-03-04 at 10.38.55.png
Screenshot 2024-03-04 at 10.38.55.png1215×724 233 KB

3

Thanks so much - worked perfectly!