Add section settings: Difference between revisions

From Posstack.com Documentation
mNo edit summary
mNo edit summary
Line 5: Line 5:
You can add the special block called Section Settings, which allows you to manage the layouts of your section by choosing your preferred layouts (1-column, 2-column, 3-column, 4-column, or hierarchical layouts) and global configurations (full-width layout, mask color, mask image, background video, parallax animation, etc.).
You can add the special block called Section Settings, which allows you to manage the layouts of your section by choosing your preferred layouts (1-column, 2-column, 3-column, 4-column, or hierarchical layouts) and global configurations (full-width layout, mask color, mask image, background video, parallax animation, etc.).


{{Note|The setup steps are the same for all page types: Product, Article, or Store page.|inline}}
{{Note|You can add multiple sections to a page. For each section, you can utilize a Section Settings block to customize the layout for that particular section.|inline}}


==Step Overview==
==Step Overview==

Revision as of 04:56, 29 May 2024


What is Section Settings

You can add the special block called Section Settings, which allows you to manage the layouts of your section by choosing your preferred layouts (1-column, 2-column, 3-column, 4-column, or hierarchical layouts) and global configurations (full-width layout, mask color, mask image, background video, parallax animation, etc.).

You can add multiple sections to a page. For each section, you can utilize a Section Settings block to customize the layout for that particular section.

Step Overview

  • Step 1: Create a template (following this guide)
  • Step 2: Create a Section Settings

Add multi-column layouts

section-settings-multi-cols.gif

Add the background image

section-settings-bg-img.gif

Add the background video

section-settings-bg-video.gif

Add the background color

section-settings-bg-color.gif

Add the background container color

section-settings-container-bg-color.gif

Set text color

section-settings-text-color.gif

Adjust the column gap

section-settings-margin-padding.gif

Next Step