Counter Positions Image Banner

To add this section, please follow below 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 "Counter positions image banner".

Section settings

General

Settings
Meaning

Section width

Select the layout width of the whole section. The options are: Default (same as the body width) Width (1170px) Width (1770px) Full width (100% of the viewport width).

Padding for 'full width' option on desktop

Determine the left and right spacing of the full width layout.

Content 1 & 2

Settings
Meaning

Image

Select/Upload image for the "Content 1 & 2".

Image text

Enter in the text for the "Content 1 & 2".

Image text font size

Specify the font size of the text on tablet and desktop.

Image text font size on mobile

Specify the font size of the text on mobile.

Image text font weight

Select the font weight of the text

Image text color

Apply a color to the text.

Heading

Enter in the heading for the "Content 1 & 2".

Heading color

Apply a color to the heading for the "Content 1 & 2".

Heading letter spacing

Enter the letter spacing for the heading.

Heading line height

Determine the line height of the heading text.

Heading font size

Specify the font size of the heading on tablet and desktop.

Heading font size on mobile

Specify the font size of the heading on mobile.

Heading top margin

Determine the spacing of the title from top.

Heading margin bottom on mobile

Determine the spacing of the title from bottom on Mobile.

Heading font weight

Select the font weight of the title.

Description

Enter the description text for the image block.

Description font size

Determine the font size of the description text on tablet and desktop.

Description font size on mobile

Determine the font size of the description text on mobile.

Description font weight

Select the font weight of the description text.

Description bottom margin

Determine the spacing of the description text from bottom.

Description color

Apply a color to the description text for the "Content 1 & 2".

Maximum content width

Determine the maximum width of the content.

Button label

Enter the text for the button.

Show button text underline

Show Button Text Underline when hover

Button link

Enter URL for the button to redirect to.

Button font size

Determine the font size of the button.

Button width

Determine the width of the button.

Text color - Border color - Background color - Background gradient - Text hover color - Border hover color - Background hover color - Background hover gradient

Set the text color, background and border color for both the normal and hover states of the buttons.

Button label style

Transform the text of the button to be either none, uppercase, lowercase, or capitalize.

Button font weight

Select the font weight of the button.

Button spacing bottom

Determine the spacing of the button from bottom.

Block 2 right spacing

Determine the spacing of the block 2 from right.

Section top padding

Settings
Meaning

Desktop

Determines the height of the top inner space of the section on the desktop device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).

Tablet

Determines the height of the top inner space of the section on the tablet device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).

Mobile

Determines the height of the top inner space of the section on the mobile device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).

Section bottom padding

Settings
Meaning

Desktop

Determines the height of the bottom inner space of the section on the desktop device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).

Tablet

Determines the height of the bottom inner space of the section on the tablet device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).

Mobile

Determines the height of the bottom inner space of the section on the mobile device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).

Last updated