Here's how to a section to the Flex theme in a Shopify store that will allow you to easily promote a product on an article page.
Theme edits needed:
- Add article__featured-product section.
Code for the Custom Liquid Section
This code is for a section for the Flex theme. If you are using a different theme, you may need to adjust the code accordingly.
Hey, Scott Austin here from JadePuma.
In this video, I'm going to show you a custom section that you can add to the flex theme in your Shopify store. That's going to allow you to upsell a product on your article pages. So here I am in an article in, in a Shopify store using the flex theme, and this is the most recent version of the so it's online store 2.0 compatible. And if you scroll down, you see here's all the article content. And then at the bottom, I've got this related product section, which looks a lot like the featured product section in Shopify or in the flex theme, which it is, but I've customized it. So it'll work easily and scalably for an article. And let me show what I mean by that. If I go into the Shopify backend for this store and I go under online store customize, I'm just going to go to the article page, the article template and show you what that looks like.
So I have the section over here, the article featured product. If I, I click on that, you'll notice that the normal product picker for the featured product section is missing. Normally it goes right here. And instead, what I say is to promote a product on, on an article, create an article tag. So you have to tag the article and that tag should start with product dash followed by the desired product hand. So once you add this section to your default, and this is my default article post, my default blog, default blog post it's now available on every article, but there's an advance statement in the section that if this tag is not showing, then it won't show the promoted product because no product's been does. So let's go into an article and show you what that tag looks like. So if you remember it said, the tag must begin with product dash and then everything after that needs to be the product handle for the product.
So if I go back to front end of my store and I'm going to open up that medium size product here, you'll see this up here in the URL, everything after the last Ford slash that's the product handle. So over here inside the Shopify admin for that specific article where we want to promote this product, what we've done is added a tag that starts with product dash and ends with medium nut wizard. So if you're watching this on YouTube, there'll be a link to take you to the blog article about this and that on that blog article on the Jade Puma website, there'll be code that you can copy. And it's just a complete section I don't have to do is copy the whole thing, create the section and it'll start showing up inside of your theme so that you can add it to articles easily and then, and tag those articles to automatically have the product show up. And if the article do doesn't have a tag that begins with product dash, then the related product element won't show on that article page.
I hope that helps. Thanks a lot for watching.