How can I add products to my blog posts on my site?

Store Design
1

Hello,

I’m trying to think of the smartest way to add products to my blog posts. I’ve tried using the ‘Buy Button’ but it’s pretty useless when used on a Shopify site, as it doesn’t allow the user to add the product to the site cart. The only options are to have an additional cart, make it open a product modal, or make it open a straight-to-checkout modal. I want to be able to add a product similar to how products appear in the collections. Just a little grid with image, price, and add to cart button. Users can add the product to the cart, and then continue browsing.

One idea I had was to add some liquid code to the article template, right atfer {{ article.content }} that says something to the effect of “If the article content contains a product title (or a link to a product), then show that product.” Does anybody know if this is possible? I have some Liquid skills but not enough to achieve this on my own.

This is an example of what I want it to function like. In this case I just copied the div and pasted it at the end of the article, so pricing etc. is static, which is not ideal: https://colouredraine.com/blogs/tutorials/lovelies-eyeshadow-palette-tutorial

I’d really appreciate any help :slightly_smiling_face:

6 Likes
2

+1, exactly the same boat and thoughts on functionality.

1 Like
3

Louisa, I ended up getting a plugin to achieve it. It works quite well and is affordable: https://apps.shopify.com/pro-blogger

4

Thank you so much for your response, really appreciate your help and advice, looks like it should do exactly what we are after! :slight_smile:

5

Hi, I came across the same issue.

Anyone can suggest plugin or anything really?

Thank you

https://talesoftree.com/

6

Yes, anybody? Please?

7

Hi @KLIMCHI ,

Do you want to add single or multiple products to a blog post? I can help you with this issue. It needs some custom code to enable this feature. You would DM me for further details.

Thanks

8

Hi! I was able to figure this out using the District theme to put a featured collection preview. My full write up on this is here: https://moderntribe.com/blogs/news/how-to-add-a-featured-collection-to-blog-post-in-shopify

Paste this below this section in article-template.liquid below the following 2 lines:

   {{ article.content }}
   </div>

{%- assign tag = article.image.alt -%}
{%- assign collection = collections[tag] -%}
{%- assign product_limit = 8 -%}

{% if collection.products.size > 0 %}
<div class="featured-collection layout-8 lazyload" data-section-id="{{ section.id }}" data-section-type="featured-collection-section">
<div class="wrapper">
    <div class="grid">
      <div class="box header">
        <div class="image-table">
          <div class="details">
              <h4>Shop {{ collection.title | escape }}</h4>
          </div>
        </div>
      </div>
      {% for product in collection.products limit: product_limit  %}
       {% include 'product-grid-item' %}
      {% else %}
        {% for i in (1..product_limit) %}
          {% include 'placeholder-product-grid-item' %}
        {% endfor %}
      {% endfor %}
    </div>
       <div class="box header">
        <div class="image-table">
          <div class="details">
              <a href="{{ collection.url }}" class="button large outline">View more</a>             </div>
        </div>
      </div>
  </div>
</div>
{%endif%}
1 Like
9

Are you talking something like this that we accomplished for reviews?

Screenshot_2021-01-15 5 Rompers to Get You Ready for Spring.png
Screenshot_2021-01-15 5 Rompers to Get You Ready for Spring.png1519×6090 751 KB

10

The fact that this is just not built in is pathetic. I am starting to dislike shopify more and more. This is a simple feature that should just be part of the basic theme. I am staring to feel like this whole platform is more about upselling me apps and crap to do the most basic of thing, For what I pay every month is is surely lacking, I will be looking for something more user friendly.

21 Likes
11

I can only see article-card.liquid ?

I’m a little annoyed that Shopify has made this so difficult that one has to adjust the code.

2 Likes
12

Couldn’t agree more. Embedding products in any page or blog is built in to Wordpress + woocommerce. I’m working in Shopify for the first time for a client and I am stunned that this isn’t a basic feature.

I thought shopping was the entire purpose of this ecosystem!

10 Likes
13

Yes the platform is a bait and switch program. They want to keep shoving apps in your face to achieve basic functionality. It’s a joke. I have been down this road.

4 Likes
14

You don’t have to do any coding for this. Just use the buy button app by shopify to add any product to a blog post and it’s free.

2 Likes
15

Nothing free about it. Just another bait and switch keep buying more app BS story.

16

This one is good. Not perfect but good enough

17

I was wrong on this. The Buy Back App is a Free Shopify App and it’s super easy to create Buy Buttons on any page.

1 Like
18

say you’re sorry !

1 Like
19

It was implied and the portion about baiting solutions with apps is nto sustainable for many. Most of it can be easily coded but shopify chooses to leave out the essentials as part of the strategy

1 Like
20

I don’t know if this is true. Most of the money from apps goes to independent developers outside of Shopify.
And you don’t need apps to have a successful store. For some stores, the expense makes sense because the apps are helping them ultimately increase sales.