Have your say in Community Polls: What was/is your greatest motivation to start your own business?

Re: how to add a link to a third party website in my store

how to add a link to a third party website in my store

sportarainbow
Visitor
1 0 0

I have a separate supplier for some of my merchandise. the product is shown in my shop but I want a customer to press the product and then they are redirected to that suppliers website to order. How do I set this up?

Thank you

Replies 4 (4)

Kimi
Shopify Staff
1511 169 266

Hi, @sportarainbow!

 

If you aren't comfortable with coding, the easiest way to add a third-party link to your products is by installing an app from our Shopify App store. This one here is a popular choice and highly rated by users, so it's worth taking a closer look at that one. There are other ones here too however, in case you'd like to browse other options.

 

Just a note that these apps are made by third-party developers outside of Shopify. So if you need more information about any of the app's functionality, I recommend getting in touch with the app developers as they'd be best equipped to answer app specific questions.

Kimi | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

bsfs
Tourist
5 0 2

Why is it whenever you want to do the simplest of tasks on shopify you have to buy a third party app with a ridiculous yearly fee? It's so basic and frustraiting.

JoesIdeas
Shopify Partner
2439 225 658

@sportarainbow if you want to do this directly in your theme code, here's the approach I take:

 

1) Decide where you want the link. For example let's say you want to change the add to cart button to "buy here" and link to them.

 

2) Duplicate your live and work off the backup theme so that your live site is not affected.


3) Find the code that controls that element. This article will help you identify elements from within your browser, or you can read the code in your theme files - Start with the Template product.liquid, then look for included Sections or Snippets, then read those files, eventually you'll find the add to cart button.

 

4) Now replace the add to cart button with your link, something like this:

 

{% if product.vendor == "Some Supplier" %}
  <a href="https://thelink" target="_blank" class="add-to-cart">Buy it here</a>
{% else %}
  <!-- leave the regular add to cart button code here -->
{% endif %}

 

target="_blank" is optional, this will open the link in a new page. Some people say not to use these, some people say use them when it makes sense. In your case, it's sending the customer to a different site so you may want to keep it, assuming they will still want to have your site open while looking at buying that product.

 

class="add-to-cart" controls the styling, that class name is just an example, assuming you'll want to style the button the same as your add to cart button you'll want to copy the same styles / class as the button (which that article I shared can help). Of course you can style it however you want by adding CSS to it (see that article for adding custom CSS).

 

+1 on @Kimi 's answer for the easy solution. I offered this solution because if you can code a feature directly into your theme code, that's the fastest method performance-wise - adding 3rd party apps that interact with your storefront often slows down the page load time because of extra resources being loaded so by habit I prefer to edit the theme directly.

 

Good luck, remember to do any work on a backup theme in case you make a mistake. If you need help from a developer feel free to reach out to my team at speedboostr.com/contact.

• Creator of Order Automator [auto tag, fulfill, connect FBA, daily jobs]
• Co-Creator of Product Automator [suite of features for products / collections]
• Shopify developer for 10+ years, store owner for 7 years
• Blog: Shopify Tips, Guides, and Automation Tactics
Ashlie_Hallman
Visitor
1 0 0

hi! this is super helpful. is there a way to edit the code for a specific product or group of products? We have another retailer that sells products that we don't sell on our site and we'd like a button that directs customers to that site to buy. Any insight is appreciated.