1. What are text columns with images?
Text columns with images is a layout feature commonly used to present information in a visually appealing and organized manner. This layout typically involves dividing a section into multiple columns, each containing a combination of text and images. It's an effective way to highlight key information, showcase features, services, or products, and create a balanced visual experience.
2. How to add column items?
To add column items with images and text in a Text Columns with Images section for your store, you need to follow these steps.
- Click on the Add section and select Text Columns with Images.
- Enter the section heading.
- Adjust the heading size, text alignment, background color, and padding as needed.
- Click on Add column to add a new column item.
- Click Upload images to upload an image or select an existing image from your library.
- You can crop or adjust the image as needed.
- Enter the main heading and subheading (if needed) for the column item.
- Adjust the heading size and enter descriptive text.
- Enter the label for the call-to-action button.
- Paste the URL or search for the link that the button will lead to.
- Choose between Primary and Secondary button styles depending on your design preference
3. How to set up the section layout?
To set up the section layout for your clothing store using the provided configuration options, follow these steps.
Heading Settings
- Enter the main heading for the section (e.g., "Discover Our Latest Collections").
- Adjust the heading size using the slider (default is 100%).
- Choose the appropriate HTML tag for the heading (e.g., H2 for secondary headings).
Background and Colors
- Configure any secondary background if applicable.
- Set the background for individual columns.
- Choose the style for images within the columns (e.g., Landscape 4:3).
- Set the background, heading, and text colors for both light and dark modes.
Layout and Spacing
- Choose the number of columns to display on desktop (e.g., 3 columns).
- Set the spacing between blocks.
- Add left and right padding when the section is full-width.
- Adjust the padding at the top/bottom of the section.
Mobile Layout
- Choose the number of columns to display on mobile (e.g., 1 column or 2 columns).
- Set the spacing between blocks on mobile (default is 16 px).
- Adjust the padding at the top of the section on mobile (default is 20 px).
- Adjust the padding at the bottom of the section on mobile (default is 20 px).
By organizing and configuring these settings, you can create a visually appealing and responsive section layout for your clothing store that enhances user experience across all devices.
