Divider

The Divider block is a simple and flexible horizontal rule you can drop into any product page to cleanly separate chunks of content.

Key Features

  • Adjustable Thickness & Color: Control line weight and pick any color so the divider can be ultra-subtle or boldly stand out.

  • Spacing Controls: Precisely adjust top/bottom margins and inner padding so there’s just the right amount of “breathing room” before and after the line.

Benefits

  • Improves Readability: It helps your customers scan key information faster without feeling overwhelmed.

  • Guides the Eye: It helps direct attention to where you want it—whether that’s the start of a new feature section or the call-to-action at the bottom of the page.

How To Use?

  1. After installing the Divider blocks. Going to the Shopify Editor sidebar, select the product page temple, click Add Section in the Template tab.

  2. Choose the Divider block

  1. Copy the block ID. For example: smi-block-divider-1

  1. On the Product Detail sections, click Add Block and add Smind Block to the section

  1. On the Smind Block, insert the block ID of divider which is smi-block-divider-1 to the Section ID and change the block name if you want.

  1. Next, you can rearrange the relevant blocks within the product detail sections

  1. Finally, let's start to customize the Divider block

  • Block ID: The unique ID of divider blocks

  • Content Max Width: Set the maximum width of the timer’s content area can stretch to.

  • Height: The thickness of the divider line itself.

  • Color: The line’s color, picked via a color picker or hex code.

  • Top margin: The blank space above the divider.

  • Bottom margin: The blank space below the divider.

  • Custom CSS

Last updated