Modern Page Banner

Modern Page Banner

To add this section, please follow below steps:

Steps:

1. From your Shopify admin, go to Online Store -> Themes.

2. Find the theme that you want to edit, and then click Customize.

3. Click Add section and choose "Modern Page Banner".

Section Feature

Setting	Description
Layout	Select the layout width of the whole section. The options are: Default (same as the body width), Full Width (the 100% of the viewport width).
Background Color	Apply the color for the section background.
Background Gradient	Apply the gradient color for the section background.
Background Image	Select/Upload an image as the section background.
Spacing Top / Spacing Bottom	Determine the spacing of the device from the top and bottom for Desktop, Tablet and Mobile device.

Content Block Setting

Setting	Description
Animation Type	Select Section Animation.
Grid Setting	Sellect Grid Column for Desktop, Tablet and Mobile device.
Content Alignment	Content Alignment for Left, Center and Right
Spacing Bottom	Determine the spacing of the device from the bottom for Desktop, Tablet and Mobile device.
Sub Title	Enter the Sub title for the section.
Sub Title Font Size on Desktop, Tablet, Mobile	Determine the font size of the Sub title on Desktop, Tablet and Mobile separately.
Select Font Type	Select the Font Type to be either Font Family #1 or #2. These two font families are specified in the Theme settings > Typography.
Sub Title Font Weight	Select the font weight of the subtitle to be either Normal, Medium, Semi Bold, Bold, Bolder or Black
Sub Title text transform	Select the text transform of the subtitle to be either uppercase, lowercase, capitalize, none.
Sub Title Letter Spacing	Enter the letter spacing for the title.
Sub Title Color	Set the color for the subtitle.
Sub Title Spacing Bottom on Desktop, Tablet, Mobile	Determine the spacing of the title from bottom on Desktop, Tablet and Mobile separately.
Title	Enter the title for the block.
Title Color	Set the color for the title.
Title Font Size	Determine the font size of the title on Dekstop.
Title Font Size Tablet	Determine the font size of the title on Dekstop on Tablet.
Title Font Size Mobile	Determine the font size of the title on Dekstop on Mobile.
Title Spacing Bottom	Determine the spacing of the title from bottom.
Title Spacing Bottom Tablet	Determine the spacing of the title from bottom on Tablet.
Title Spacing Bottom Mobile	Determine the spacing of the title from bottom on Mobile.
Description	Enter the description for the block.
Description Color	Set the color for the Description.
Description Font Size	Determine the font size of the description on Dekstop.
Description Font Size Tablet	Determine the font size of the description on Dekstop on Tablet.
Description Font Size Mobile	Determine the font size of the description on Dekstop on Mobile.
Description Spacing Bottom	Determine the spacing of the description from bottom.
Content: Position	Select the alignment of the title, sub title, description to be either to the Left, Right or Center of the block.
Content: Alignment	Select the alignment of the title, sub title, description to be either to the Left, Right or Center of the block.
Button Setting	Select setting for button style, text, link, Font Weight, Font Size, Letter Spacing, Border and color.

Content Images Setting

Setting	Description
Grid Setting	Sellect Grid Column for Desktop, Tablet and Mobile device.
Spacing Bottom	Determine the spacing of the device from the bottom for Desktop, Tablet and Mobile device.
Content Alignment	Content Alignment for Left, Center and Right
Images	Select your image.