Newsletter With Countdown
Last updated
Last updated
To add this section, please follow below steps:
From your Shopify admin, go to Online Store -> Themes.
Find the theme that you want to edit, and then click Customize.
Click Add section and choose "Newsletter with countdown".
Settings | Meaning |
---|---|
Section width | Select the layout width of the whole section. The options are: Default (same as the body width) Width (1170px) Width (1370px) Width (1470px) Width (1570px) Width (1770px) Width (1920px) 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. |
Background color | Set color for the section background. |
Background gradient | Set color gradient for the section background. |
Settings | Meaning |
---|---|
Justify content on desktop | Select the alignment of the header text to be either to the Start, Center, End, or Space between of the section. |
Grid gap | Determine the gap between items. |
Settings | Meaning |
---|---|
Desktop | Determines the height of the top inner space of the section on the desktop device. Can be from 0px to 200px, 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). |
Settings | Meaning |
---|---|
Desktop | Determines the height of the bottom inner space of the section on the desktop device. Can be from 0px to 200px, 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). |
Settings | Meaning |
---|---|
Title | Enter in the title for the block. |
Title font size | Specify the font size of the title. |
Title font size on mobile | Specify the font size of the title on mobile. |
Title color | Apply a color to the title. |
Title font weight | Select the font weight of the "title" |
Email form | |
Button label | Enter the text for the button. |
Button font size | Determine the font size of the button. |
Button width | Determine the width of the button. |
Button label color - Button border color - Button background color - Button background gradient - Button label hover color - Button border hover color - Button background hover color - Button background hover gradient | Set the text color, background and border color for both the normal and hover states of the buttons. |
Placeholder text | Enter in the placeholder text for the input. |
Placeholder color | Apply a color to the placeholder text. |
Input background color | Set color for the input background. |
Input border color | Set color for the border input. |
Spacing between input and button | Set Spacing Between Input And Button |
Settings | Meaning |
---|---|
Text 1 | Enter 'text 1' for the typing animation. |
Text 2 | Enter 'text 2' for the typing animation. |
Text font size | Determine the font size of the text on Desktop |
Text font size on mobile | Determine the font size of the text on Mobible |
Text font weight | Select the font weight of the text |
Text color | Apply a color to the text. |
Settings | Meaning |
---|---|
Title | Enter in the title for the block. |
Title font size | Specify the font size of the title. |
Title font size on mobile | Specify the font size of the title on mobile. |
Title font weight | Select the font weight of the "Title" |
End date | Enter the due date for the countdown. Please use this exact format: yyyy/mm/dd hour/minute/second. Example: 2024/12/4 0:0:00. |
Text color | Set the color for the text. |