Featured Blog
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 "Featured Blog".
Section Settings
| Setting | Description |
|---|---|
Layout: | Select the width layout of the section to be either default to the body's width, 1170px, 1770px or full screen width. |
Padding Container Full Width | Determine the spacing of the left and right sides if the layout 'fullwidth' is selected. |
Margin Minus Top | Determine the minus integer of spacing top (which means the section will get closer to the section below it) |
Spacing top - Desktop / Tablet / Mobile | Determine the spacing of the section from the top on Desktop, Tablet and Mobile. |
Spacing bottom - Desktop / Tablet / Mobile | Determine the spacing of the section from the bottom on Desktop, Tablet and Mobile. |
Background Color | Set the Background Color for the whole section. |
Background Gradient | Set the Background Gradient for the whole section. If the gradient is none, then the background color will be applied if any. |
Background Image | Upload/choose an image as the background for the section. |
Title | Enter the title for the section. |
Title Color | Set the title color for the section. |
Title Border Color | Set the line-through color for the section title. |
Enable Title Border | Enable to show the line through the section title. |
Title Custom Width | Determine the width of the title content. |
Title Font Size | Determine the font size of the section title on Desktop ranging from 10px to 50px. |
Title Font Size Mobile | Determine the font size of the section title on Mobile ranging from 10px to 50px. |
Title Spacing Bottom | Determine the spacing of the title from the bottom. |
Description | Fill in the description text for the section. |
Description Color | Set the color for description text. |
Description Spacing Bottom | Determine the spacing of the description from the bottom. |
Description Font Size | Determine the font size of the description text. |
Alignment | Align content to the left, the right or center of the section. |
View All | Fill in the text for the view all link. |
View All Margin Top | Determine the spacing top of the view all |
View All Margin Bottom | Determine the spacing bottom of the view all |
View All Alignment | Align the view all to be either to the left, right or center of the section. |
View All Font Weight | Select the font weight of the view all text. |
Enable View All Border? | Enable to underline the view all. |
View All Link | Enter the link to redirect viewers to after being clicked. |
View All Color | Set the color for the view all text. |
View All Icon | Fill in the icon for the view all link along with its text. |
Icon View All Color | Set the icon color of the view all link. |
View All Position | Select the position of the view all to be under the heading or to the right side of the heading. |
Button | Enter the text for section button. |
Link | Enter the link that the button redirects to. |
Button Font Size | Determine the font size of the button. |
Color - Background Color - Border Color | Set the color, background color and border color for both normal and hover states. |
Button Background Opacity | Determine the transparency of the button background. |
Button Text Transform | Select the text transform for the button to be either Lowercase, Uppercase or Capitalize. |
Icon | Enter the icon (svg) for the button. |
Button Spacing Top | Determine the spacing of the bottom from the top. |
Blog Settings
| Setting | Description |
|---|---|
Select Blog | Select the blog to show its blog posts. |
Item Per Row | Select the number of items per row. |
Grid Gap | Determine the spacing between each post. |
Posts Limit | Determine the maximum number of blog posts to show. |
Posts Content Description Limit | Limit the content description by word count. |
Text By | Enter the text prior to the post date. |
Text On | Enter the text after to the post date. |
Blog Item Settings
| Setting | Description |
|---|---|
Background Color | Set the background color for all blog posts |
Blog Item Border Radius | Round the corners of all blog post cards. |
Blog Content Margin | Determine the spacing of the blog content to its sides. |
Image Margin Bottom | Determine the spacing of the blog post image from its bottom. |
Title Font Style | Select the font style of the blog post title to be either normal, uppercase, lowercase or capitalize. |
Title Spacing Bottom | Determine the spacing of the blog post title from the bottom. |
Info Margin Bottom | Determine the spacing of the blog post info from the bottom. |
Description Margin Bottom | Determine the spacing of the blog post description from the bottom. |
Alignment | Align the Blog Post content to left, right or the center of the card. |
Blog Link Text Transform | Select the style for the blog link to be either none, uppercase, lowercase or capitalize. |
Blog Link Font Weight | Select the font weight of the blog post link. |
Enable Border Box | Toggle to enable the border of the blog post card. |
Color Border Box | Set the color of blog post card border. |
Title Blog Color | Set the color of the blog post title. |
Date Blog Color | Set the color of the blog post date. |
Description Blog Color | Set the color of the description of the blog post. |
Button Width | Determine the button width of the section. |
Button Blog Color | Set the color of button text. |
Content on Image | Toggle to display content on the image or below it. |
Background Color | Set the background color of the content when the content is On Image. |
Background Gradient | Set the background gradient of the content when the content is On Image. |
Last updated
