About Shopify Blog Post List Element
Summary: Shopify Blog Post List Element lets you insert a single, or a list of blogs, from your Shopify store to a page. You can also display it as a slideshow. Above all, it promotes your brand story or announces an upcoming collection. As a result, it can increase the conversion rate.
Even so, you can use this element to promote your blogs on other pages (ex. landing page).
Before jumping to the detailed steps, you can watch this video below:
How To Access Blog Post List Element
There are 3 steps involved:
- Step 1: Click on Element function
- Step 2: In Shopify section, click on the Blog Post List element in the dropdown menu
- Step 3: Drag and drop the element into the page editor and then start using it.
Blog Post List element comes with five common variations.
How To Configure (Setting) For Blog Post List Element
Blog Post List element offers many variables with the editable layout, so you can achieve a better conversion rate of the page. In this article, we will show the parameters of the General and Styling tabs for the Blog Posts element.
General Settings
Legacy Editor
If you’re using the basic editor, check how to configure the Blog post list element below:
- Custom blog: Hit the “Select blog” button, choose your desired blog post list and click “Select”.
- Items per loading: You can adjust the number of blog posts displayed by dragging the bar or insert the number in the box.
- Layout Type: There will be two layout types: Grid and Slideshow.
- If you choose Grid layout, continue with these settings:
| Items per row: Adjust the number of items displayed in each row.
Note: This setting can be configured separately for different device types (e.g., desktop, tablet, mobile). |
 |
| Items Spacing: Customize the spacing between items in the blog post list.
Note: This setting can be configured separately for different device types (e.g., desktop, tablet, mobile). |
 |
| Exclude Current Blog Post: This option is only available on blog post pages and prevents the current blog post from being included in the list. |  |
| Reverse Order: Reverse the order of items from newest to oldest or vice versa.
Note: By default, the blog post list is ordered from newest to oldest. |
 |
Loading mode:
|
 |
- If you choose Slideshow layout, continue with these settings:
Note: Theses settings can be configured separately for different device types (e.g., desktop, tablet, mobile). |
 |
| Display partial item: You can choose to enable display partial item or not. Enable this feature to let customers know that there are still products available for horizontal scrolling.
|
 |
|
 |
Note: By default, the blog post list is ordered from newest to oldest. |
 |
| Set max height: If enabled, the slideshow’s height will match that of the highest slide, including those that are hidden.
If not enabled, you can choose three types of vertical alignment.
|
 |
Gen 2 Editor
The General tab of PageFly’s flex editor shares many of the same parameters as the basic editor, but offers additional features and a slightly different parameters’ order.
Specifically, the flex editor provides the following additional options for the Grid layout settings:
- Fill Last Row: Determines whether the last row of items in the grid should be filled to match the width of the previous rows.
- Alignment: Allows you to control the positioning of elements within a layout.
By utilizing these additional features, you can create more customized and visually appealing layouts for your elements.
You can get further information about ATTRIBUTES, VISIBILITY, ANIMATION parameters here.
Styling Settings
You may modify a range of parameters in the Styling tab, such as spacing, borders, typography, colors, and more, to guarantee that the Blog post list matches the overall layout of your page.
You can check more information about Styling settings in this PageFly Element Styling guide.
Common Cases
Users should avoid neglecting to include a clear call-to-action (CTA) within blog posts listed in the element. A compelling CTA encourages visitors to take desired actions, such as making a purchase, signing up for a newsletter, or contacting customer support. Incorporate relevant CTAs within blog posts to guide visitors toward conversion actions and maximize the impact of the blog post list element.
Frequently Asked Questions
1. What is the primary function of the blog post list element on Shopify?
Shopify Blog Post List Element lets you insert a single, or a list of blogs, from your Shopify store to a page. You can also display it as a slideshow. Above all, it promotes your brand story or announces an upcoming collection. As a result, it can increase the conversion rate.
2. Is it possible to customize the appearance of the blog post list on my Shopify store?
Yes, Shopify provides customization options for the appearance of your blog post list. You can adjust the layout, fonts, colors, and more to match your store’s branding and design preferences.
3. How can I encourage visitors to engage with my blog post list on Shopify?
You can encourage engagement with your blog post list by promoting it through your store’s navigation menu, featuring it on your homepage, sharing individual posts on social media, and actively responding to comments and feedback from your audience.
Previous article