Horizontal Gap

How to Manage Horizontal Gap in AppSections Brand Style

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

Important Notes

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

Steps to Adjust Horizontal Gap

  1. Select the Brand Style:

    • Open your Shopify theme editor.

    • Navigate to the Brand Style settings.

  2. Open Horizontal Gap Settings:

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

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

  3. Adjust Horizontal Gap:

    • The Horizontal 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 Horizontal Gap to Sections

  1. Select the Section:

    • Navigate to the section where you want to apply the horizontal 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 Horizontal Gap Size:

    • Within the section settings, locate the option to select the horizontal 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 Horizontal 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 horizontal 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