Store Page List Out of Stock Badge

Store Page List Out of Stock Badge

License

Synopsis

Store page list out of stock badge.

Version

• 0.5.0

SS Version

• 7.1

Fluid Engine Compatible

• Not Applicable

---

Quick Install

Add code from file store page list out of stock badge.less to Website > Pages > Website Tools > Custom CSS. Read the code for any instructions within.

Badge Options

• Style

  • Rectangle

    

  • Square

    

  • Circle

    

• Background Color and Color (text)

  

• Font : family, weight, style (italic and normal), size, letter spacing, and text transform (capitalize, lowercase, uppercase)

• Padding (around the out of stock text)

• Position

  	Left	Center	Right
  Top				Top
  Center				Center
  Bottom				Bottom
  	Left	Center	Right

• Inset

  • Floating

    

  • Flush

    

  • Dock Vertically

    

  • Dock Horizontally

    

• Inset Size (margin around the badge for options that have an inset)

Demo

You can see a demo of this effect here.

Make a Donation

Please consider making a donation.

Changes

• 2024-10-19

  • add option to use user set color
  • don't override user padding for circle and square
  • bumped version to 0.5.0

• 2024-02-09

  • restrict effect to list page only
  • bumped version to 0.4.1

• 2023-05-27

  • locally scope variables so code can run along side similar code without conflicts
  • bumped version to 0.4.0

• 2023-05-27

  • make effect available on mobile
  • bumped version to 0.3.0

• 2023-03-25

  • support as closely as possible the full range of Product Status Badge tweaks available in v7.0 Brine template family
  • use LESS
  • bumped version to 0.2.0

• 2023-03-24

  • initial version