Instagram Special
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 "Instagram special".
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 padding of the section when layout full width is selected. |
Show top border | Toggle the top border of the section. |
Border color | Set color for the top border of the section. |
Background color | Set color for the background of the section. |
Background gradient | Set color gradient for the background for the section. |
Background image | Select/Upload image as the section background. |
Section header | |
Title | Enter text for the section title. |
Title color | Set color for the title. |
Title font size | Determine the font size of the section title. |
Title font size on mobile | Determine the font size of the title on mobile device. |
Title bottom margin | Determine the spacing of the title from the bottom. |
Description | Enter text for the section description. |
Description color | Set color for the description text. |
Description font size | Determine the font size for the description text. |
Description bottom margin | Determine the spacing bottom of the section description. |
Alignment | Select the alignment of the content to be either to the Left, Right or Center of the section. |
Show view more button | Toggle the show more icon to show more images. |
Button label | Enter the text for the button. |
Button type | Decide the behavior of the button on clicked. The options are: Load more button Link |
Button link | Set URL for the button to redirect to. |
Button label color | The text color of the button. |
Button border color | The border color of the button. |
Button background color | The background color of the button. |
Button background gradient | The background gradient of the button. |
Button width | Determine the width of the button. |
Block items | |
Layout | Select the layout of the block images. There are 3 styles: Style 1 Style 2 Style 3 |
Grid gap | Determine the gap between block images. |
Image corner radius | Set roundness of the border of the blocks. |
Action when clicking on image | Decide the behavior of the images on clicked to be either to open FancyBox for clearer view or to redirect to URL. |
Show plus button | Toggle to show the plus button when hovering item. Note: Click this button to enlarge the image. |
Plus button color | The text color of the plus button. |
Plus button border color | The border color of the plus button. |
Plus button background color | The background color of the plus button. |
Plus button background gradient | The background gradient of the plus button. |
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). |
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). |
Settings | Meaning |
---|---|
Image | Upload/Select an image. |
Link | Set the link for the block image. |