How can I add more space between sections on my webpage?

Store Design
1

Hello

I’d like to add more space between these two sections, it happens with every collection that i have

Link https://mercadojardin.cl/collections/maquinas-de-jardin

Screenshot_127.png
Screenshot_127.png1586×900 229 KB

2

Hi @mercadojardin ,

You can add this section divider I made.

  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.

 

{% schema %}
{
"name": "Section divider",
"settings": [
{
"type": "range",
"id": "padding_top",
"min": 0,
"max": 100,
"step": 1,
"unit": "px",
"label": "Padding top",
"default": 36
},
{
"type": "range",
"id": "padding_bottom",
"min": 0,
"max": 100,
"step": 1,
"unit": "px",
"label": "Padding bottom",
"default": 36
},
{
"type": "range",
"id": "height",
"min": 0,
"max": 100,
"step": 1,
"unit": "px",
"label": "Height of the divider",
"default": 5
},
{
"type": "color",
"id": "color",
"default": "#000",
"label": "Divider color"
},
{
"type": "checkbox",
"id": "full_width",
"default": false,
"label": "Section full-width"
}
],
"presets": [
{
"name": "Section divider"
}
]
}
{% endschema %}

You can check this code in my website.

3

i created the new section and added the code and nothing changed

4

Hi @mercadojardin ,

You have to go to the theme editor and add the section to your theme

  1. From your Admin Page, click Online Store > Themes > Customize

  2. This will open the theme editor. Click the Add a section.

  3. Find the Section divider

  4. Click SAVE