Vertical Gap

How to Manage Vertical Gap in AppSections Brand Style

Managing the vertical gap within sections in your Shopify store using the AppSections Brand Style involves adjusting the Vertical Gap settings. These settings allow you to control the space between rows or elements within the section structure, ensuring a balanced and visually appealing layout. Follow these steps to correctly manage the vertical gap using our custom settings:

Important Notes

Consistent Spacing: The Vertical Gap settings ensure that elements within sections have consistent spacing between them, providing a clean and professional look.

Steps to Adjust Vertical Gap

  1. Select the Brand Style:

    • Open your Shopify theme editor.

    • Navigate to the Brand Style settings.

  2. Open Vertical Gap Settings:

    • In the Brand Style settings, locate the Vertical Gap parameter.

    • These settings allow you to manage the space between rows or elements within the section structure.

  3. Adjust Vertical Gap:

    • The Vertical Gap setting offers three standardized sizes to ensure consistency across your store:

      • Small: Provides a minimal gap between elements, ideal for tightly packed designs.

      • Medium: Offers a balanced gap, suitable for most layouts.

      • Large: Ensures a wide gap between elements, creating a spacious look.

Applying Vertical Gap to Sections

  1. Select the Section:

    • Navigate to the section where you want to apply the vertical gap.

    • Select the section by clicking on it.

  2. Open Section Settings:

    • In the right-hand pane, navigate to the settings of the selected section.

  3. Select Vertical Gap Size:

    • Within the section settings, locate the option to select the vertical gap size.

    • Choose one of the three standardized sizes (Small, Medium, Large) to apply to the elements within the section.

Ensuring Consistency

  1. Preview Changes:

    • After adjusting the Vertical Gap settings, preview your store to ensure the sections and elements are spaced as intended.

    • Switch between different devices (mobile and desktop) to verify the consistency and responsiveness of the spacing.

  2. Uniform Look:

    • By using standardized gap sizes, you ensure a consistent and professional look across all sections of your store, maintaining a clean and organized design.

Verifying the Change

  • Preview Changes: Switch between mobile and desktop views in the theme editor to ensure the sections and elements are spaced correctly. Make adjustments as necessary to maintain a consistent and optimized user experience.

By following these steps, you can effectively manage the vertical gap within your Shopify store using the AppSections Brand Style, ensuring a uniform and professional appearance across all sections and elements. If you have any questions or need further assistance, please contact our customer support team.

Last updated