Banner alignment settings

Overview #

The settings described here are core theme settings that control the overall look and feel of an online shop. These settings are applied globally across the site but can be overridden at the section or block level. They are crucial for maintaining a consistent design and user experience throughout the shop.

Key components and functionality #

Banner alignment

The Banner alignment setting group allows you to control the positioning of content within banners, ensuring that text and images are displayed in a visually appealing manner.

Horizontal alignment

This setting determines the horizontal positioning of content within a banner. You can choose from the following options:

1. Left: Aligns content to the left side of the banner.
2. Center: Centers content within the banner.
3. Right: Aligns content to the right side of the banner.

Vertical alignment

This setting controls the vertical positioning of content within a banner. The available options are:

1. Top: Aligns content to the top of the banner.
2. Middle: Centers content vertically within the banner.
3. Bottom: Aligns content to the bottom of the banner.
   • Default: Bottom

Usage examples #

1. Centering a Call-to-Action: You might consider centering both the horizontal and vertical alignment to highlight a call-to-action button in a banner. This ensures the button is prominently displayed in the middle of the banner.

2. Aligning Text to the Left: For banners that contain a lot of text, such as a promotional message, you might consider aligning the text to the left to create a clean and organized look, especially if the text is accompanied by an image on the right.

These settings provide flexibility in designing banners that fit the aesthetic and functional needs of your shop, enhancing both the visual appeal and user experience.