Shopify features and tools
Section Divider with Options

Section Divider with Options

Log in or Sign up to ensure access to FREE code across multiple devices.

Compatibility: All Shopify themes

This feature will add a section divider in one click. Does not want it anymore? Do not worry, just remove the Section using the Theme editor. 


  • You can control the space between the sections, therefore, creating a white space. NOTE: You can remove the color so it will just have a white space. 
  • Change the color of the divider
  • Make the divider full width

1. In your Admin page, go to Online store > Themes
2. Choose the theme you want to edit then click Actions > Edit code. 
3. Open Section folder, and click Add a new section. You can name it whatever you want. 
4. Open the newly created section and replace the existing code with the code below. 


5. Click SAVE. Now, you should be able to add a Section divider in your theme editor. 

That's it (",)


Struggling with instructions?

Don't worry, we've got you covered for a reasonable price.

Contact us through "Chat with us" for a quote.

Relax as we handle it for you!

Back to blog


Hi @Gina,

You can change the code .sectionDivider width to below
.sectionDivider {
width: 80%


Thank you so much for the code for the section divider. I only want it to be around 80% width and centralised on the page, how can I do this?


Leave a comment