How to insert related blog posts on product pages?

Solved
Highlighted
Excursionist
17 1 9

Hi!

 

I'm trying to add related blog posts relevant to product pages so that you can automate it and have good information linking to the blog when checking out a product.

 

I found this piece of code:

{% assign related_posts = "" %}

{% for article in blogs.blog.articles %}
  {% if article.tags contains product.handle %}
    {% capture post %}
      <li><a href="{{ article.url }}"><p>{{ article.title }}</p></a></li>
    {% endcapture %}
    {% assign related_posts = related_posts | append:post %}
  {% endif %}
{% endfor %}

{% if related_posts.size > 0 %}
  <ul> {{ related_posts }} </ul>
{% else %}
  No related posts!
{% endif %}

But for some reason i cannot get it to work, i've been reading all about it and tried different things but to no avail.

 

Anyone can help?

This code snippet that i found was written in 2015 maybe something major has changed and thats why it doesn't work.

 

Thanks!

0 Likes
Highlighted
Excursionist
17 1 9

Anyone??

0 Likes
Highlighted
Shopify Partner
150 4 21

Hi!

 

This functionality sounds very useful, I'm currently working on a new app for embedding products in a blog page, and am thinking of also allowing it the other way around now :-)

 

you can check it out here:

 

https://shipping-demo.myshopify.com/blogs/news/linking-products-in-blog-posts

 

It's pending review at the moment, but you can already install it as a non listed app if you want, there is currently a 30 free trial, and I'm looking for some more feedback on the app.

 

Install it from here: http://blogproducts.checkmyapp.net

 

At this point when you insert links to your blog and click 'tag products' the products will get linked and you will get hover product information / lightbox.

 

I could expand the functionality to also allow tagging product's that were not mentioned / linked in the blog page, and then display blog articles on the product page.

 

 

Let me know what you think.

0 Likes
Highlighted
Shopify Partner
274 22 42

Hey there.

 

Are you looking for it to just randomly pick and pull, or would you like to be able to assign them like using a section?

 

Best Regards,

Duncan.

Isle of Misfit Code and Development

Best Regards,
Duncan.
Isle of misfit code & development
http://ecomdev.ca
0 Likes
Highlighted
Excursionist
17 1 9

This is an accepted solution.

Hey!

 

I found a solution for what i wanted to do.

So within a collection of products i wanted to show a specific blog post, one that would show always, like say for example you sell mountain bikes, and you have a blog post about "First beginner mistakes when buying mountain bikes", on your collection of mountain bikes choose to always show this blog post on your product page.

 

To do this: Go to product-template.liquid and insert this wherever you want it to appear:

{% assign in_hats_collection = false %}
{% for collection in product.collections %}
  {% if in_hats_collection == false and collection.handle == 'YOUR COLLECTION HANDLE' %}
     {% assign in_hats_collection = true %}
  {% endif %}
{% endfor %}
{% if in_hats_collection %}
  <div>    
        <h3 style="color: #674ea7">Blog Title</h3>
        <img style="padding-right: 10px; width: 50%; float: left;" width="100%" src="YOUR IMAGE" alt"ALT TAG">
        <p>SNIPPET of blog post</p>
        <div align="right"><a class="CLASS OF BUTTON" href="LINK TO YOUR BLOG POST">Read More</a></div>
       <center><hr class="hr-artigos"></center>
       </div>
        {% endif %}

Hope it helps!

0 Likes
Highlighted
Excursionist
17 1 9

@Thomas_Lang1 wrote:

Hi!

 

This functionality sounds very useful, I'm currently working on a new app for embedding products in a blog page, and am thinking of also allowing it the other way around now :-)

 

you can check it out here:

 

https://shipping-demo.myshopify.com/blogs/news/linking-products-in-blog-posts

 

It's pending review at the moment, but you can already install it as a non listed app if you want, there is currently a 30 free trial, and I'm looking for some more feedback on the app.

 

Install it from here: http://blogproducts.checkmyapp.net

 

At this point when you insert links to your blog and click 'tag products' the products will get linked and you will get hover product information / lightbox.

 

I could expand the functionality to also allow tagging product's that were not mentioned / linked in the blog page, and then display blog articles on the product page.

 

 

Let me know what you think.




That looks like a nice thing, but if its an app it needs to be bringing functionality beyond what some simple lines of code can. Don't you think?

An app should always be something more. Not a way to get money from beginners.

 

To beginners and people that are not code savvy just teach them simple stuff like i am sharing here.

To build an app for shopify go above and beyond and build something that is worthwhile for everybody.

 

1 Like
Highlighted
Shopify Partner
150 4 21

I think you are missing the point of my app. The code you produced is one way to link 1 blog to your product page. My app is to be able to automatically link all products to your blog post and blog posts to your products. This is a usefull feature and saves a lot of time for merchants.

 

To be honest I am a bit disappointed with the tone in your reply "taking money from beginners"

 

I try to make my apps as user friendly as possible, and my premise is always to create value for store owners with functionalities they would otherwise not be able to have easily. I'm a store owner myself, and have 2 apps currently listed in the app store, this will be my third. I made these apps because I needed certain functionalities that were unavailable out of the box or in the app store, and thought it would be great to share with other merchants looking for similar, yes my apps are paid, I put in a lot of effort to create and improve them with every feedback I'm getting, and my infrastructure hosting the apps and backing up everything hourly to ensure availabilty isn't free either.

 

 

0 Likes
Highlighted
Excursionist
17 1 9

Sorry i think i misunderstood the idea!

So my suggestion would be to mainly focus on how to present these results and design.

Because i have one or two blog posts on a product page, and thats already a lot! If you can add 4 or 5 then thats a massive scroll specially if you're using Debut Theme with that split width that makes one column have an image and another one a bunch of text.

 

About the blog:

Showing results on the blog should be like this, where is written float left and right have the ability, if one wants to insert a product instead, just like it would happen with an image.

web-text-wrap

Because if every product is at the bottom of the post, the moment of pressing and getting to know these products kind of passed. Its different to have a preview of the product while reading.

 

If you need more ideas im up for it.

 

thanks

0 Likes
Highlighted
Shopify Partner
150 4 21
Thanks for the suggestion, I’m currently working on inplementing something similar.

for now the readers will see the product pop up when they hover a product link in the article (tap hold on mobile), optionally the merchant can also add the products in the bottom of the page (this is what you probably saw on the demo, allthough I agree with you, the moment for the product information being useful has passed at the bottom of the page)
0 Likes
Highlighted
Excursionist
17 1 9

You're welcome!

By the way any chance you know how to make the product image stay visible, when we scroll down to read the product description?

Cause an average product description should have between 300/400 words, and while reading, specially on Debut theme but other themes as well, as we scroll to read the description the product image goes out of view.

 

Any way to keep it fixed while we scroll down?

I think everyone would appreciate this.

 

0 Likes