Cover image by cottonbro
If you're running a shop on Shopify, you're probably interested in obtaining a nice steady supply of customers, charging through your (virtual) front door. You're probably keen to hold on to your existing customers too.
Blogs are an excellent way to add lots of lovely, keyword-rich content to your site and pull in eyeballs and clicks. Keeping those users engaged can be done by adding related article links at the bottom of each article.
This is, of, course, nothing new, but it's still relatively rare in Shopify. It's for this reason, we've added it to our Shopify repo Mannequin on GitHub. You can find the code in articles.liquid
.
Let's jot down some requirements for this functionality. These blog call-to-action panels should:
- Be related in some way to the current blog post
- Be up-to-date
- Not include a link to the current blog you're reading
- Be easily configurable, so you can control how many are pulled into the page
Relevant to the current blog post
Blog posts in Shopify can have tags added to them. By looping through Shopify's blog
object, we can build up a list of articles which share at least one tag in common with the current page. Note that Mannequin does not weigh these articles - an article with three tags in common would be just as likely to appear as an article with only one tag in common.
Up-to-date
Shopify's blog
object is presented in order of date, so by simply looping through it in order, the most recent content will be parsed first.
Avoiding recursive links
A comparison of the ID
of the current article and each that we are looping through will prevent us from adding a link to the current page.
Configuring the number of matches
The variable related_articles_count
defines the upper limit of how many blogs will be returned. As this number tends to be defined by your final layout, this is not set to be configurable via the Shopify interface, but instead is left to the developer to set.
What if there isn't enough matches?
Your content authors might provide you with some unique tags, which have little or no articles to match them. This is why if Mannequin reaches the end of the blog
object and has not matched the required number of articles, it will loop through it a second time, and add articles on a slightly looser set of criteria:
- Articles which are not the current page
- Articles which have not been added in the last pass
This means that the articles added first should be the most relevant and up-to-date, whereas those added last will be the lest relevant.