How to change the add to cart link to an affiliate link in eStore

How to change the add to cart link to an affiliate link in eStore



Views:2539|Rating:3.33|View Time:12:18Minutes|Likes:2|Dislikes:1
This video describes how to change the add to cart link to an affiliate link for the product page in the eStore theme from Elegant Themes WordPress themes. We use a child theme for this purpose in order to keep updates simple later. We also use some code borrowed from Smashing Magazine for a meta box in the edit post screen in order to keep things simple for the client. See more at

on my youtube-channel Cora lien asks if there's a way to take the Add to Cart button on the east door theme and make it into an affiliate link right now I'm going to show you how to do that what she's asking is if we are on a product page in East or normally when we click this add to button Add to Cart button it'll drop down and you can add it to the eShop plug in Cart we want to take this button and make it link to the product on another website for example Amazon or Etsy and this is if you want your clients to buy things through some other side and you just want your eStore site to be sort of a face a front-end or portal into that other buyer website and this is really useful sometimes because web sites like Etsy have more purchasing options for free or for a reduced price less than what it would cost for you to purchase the the carts and the items through your web host that you would normally want to spend so I'm going to show you how to do this with a child theme and I've worked with child themes before this will front in the work a little bit more but in the end it'll be a lot easier to update East or theme now basically all you need to do to change things is to update one line of code and if you go in the elegant themes forums they'll show you it's this code right here you're gonna replace the add to cart' line with a line that takes a value from the et underscore link custom field and puts it into a length so that when you click on it you'll go to that affiliate website and we're going to actually add a meta box as well using an article that I found from Smashing Magazine on how to add meta boxes and I'm going to post all this code on my site and link you to it at the end of the video so that you'll be able to download the file so it'll be a little easier for you but I'm going to walk you through it also okay so the first thing we need to do is go into plugins we need to disable the eshop plugin okay so now when we click on this Add to Cart button nothing's gonna happen at all because eShop is disabled and that's what we want for now the next thing we're going to do is actually go into our wp-content themes folder we're going to create a new folder and you can use an FTP program to do this and it's going to be called East or child now right now nothing's in the folder if we're going to add several files to this folder and I'm going to walk you through what each one contains and I'm using Dreamweaver to create these files but you can use a simple program like notepad to do it also so the first file is called style dot CSS now this has some real basic information about the child theme and it's called East or Child which is a very original I know but it's the best I can do right now and the template name is East or this is the theme that we're pulling from and then the most important line of code is right here and this is basically telling this child theme to pull all its information from the east door theme so only things that we change in here will look differently than they do in East or and that's our goal so we're going to save this file in the east door child folder the next thing we're going to do is we're going to take our functions.php file from eStore so open that up and then we're going to go eliminate the code that we don't need so that we can add the code for the meta meta box that's that we're going to be able to add our affiliate link to in our edit post screen so basically what we're going to do is in your edit post screen here's our product there's going to be a box like the et settings box that's going to show up down here that will allow you to add your link because right now there's no place for your link so basically we're gonna go below this line here which is add action safe post et delete featured IDs cash and the two brackets below it and we're going to delete everything because this is already occurring the eStore theme so we don't need it and then we're going to go to médico de this meta code here that I'm going to add and I'll give you a file that actually has all of us in it and we're going to add all of this information from this meta code file and we're going to add it to the functions dot PHP file and I can real briefly show you basically what this is doing but you can look at the Smashing Magazine article if you have more questions about it but we're basically going to create a custom field called custom underscore URL and so when you put your link in that meta box in the Edit post screen it will translate into that custom field which we can put into the theme so that people can click on those the Add to Cart button and it takes them to the affiliate page and all of this code is basically to set that up set the box up and then make sure that it saves properly and is translated into the theme properly and again you can look at The Smashing Magazine post for more information about that so now we're going to save this file into our East or child and we have two files in here but there's one more file that we need and that is the single product file so we want to find the line of code that elegant themes is having us look for and I'll also link to this I'll put this information on in my post so you can see this as well and we're going to search for that and here it is and then we are going to change to this line of code now there's a couple of things there's a couple of things here that we want to look at first is remember I told you that instead of ET link our post meta is going to be custom underscore URL the second thing is that you may want it to say instead of saying add to cart' you may want it to say something like by now since they're going to go directly to another page so we're going to change that and then we're going to save all this in our East or child only this time we got the file from East or slash includes so we're going to need to make sure that it shows up in the same location in the child theme so we need to make a folder called includes and then save it there so now we've got our three files what we need to do is go back to our themes and we should now see a theme all the eStore child I'm going to activate that and upon activation our product screen should change so I'm going to refresh the product screen now it says by now and in the post screen we should see a box so here is our edit post screen and with the title the text the et settings with price and everything and there's also a place for an affiliate link so I can make this affiliate link now go wherever I want it to so if I wanted to go to amazon.com I can just type that in or copy and paste it in to that affiliate link box click update and now my post should take me to amazon.com and it works like a charm so on each individual post you'll need to add a different link for your product now there's one more thing I want to show you and that is that if you don't want to go to the extra trouble of creating the functions.php file or you just want to edit that line of code in the single product file directly there is another way that's easier so if we go back to this single product file in this line of code if we leave it as ET link and we just maybe change it only to by now we don't change that at all then when we refresh this this link is going to be not working so what we're going to want to do is go to screen options and make sure that we can see the custom fields item and then we're going to want to create a new custom field the first time you'll need to type in ET link and then we'll let's say this time we want to go to google.com so we just click add custom field it adds it and then when we hit update since we're using ET underscore link now it should take you to Google so there we are so either way you want to do it is fine I prefer the other methods definitely going to be a lot easier for any clients that may be using your this affiliate link box there's a whole lot easier for clients who are using an install of WordPress that you've set up for them so hopefully corlane that answers your question and don't forget you can go to my tribe page comm and ask just send me a message and I'll create a video for you when I've got some time to do it

4 thoughts on “How to change the add to cart link to an affiliate link in eStore

  1. Hey Miles GREAT videos really helpful I just can`t to figure how to change the grey part on the right side of the site. In this particular video I am talking for the section were the calendar and Admin section appears in the website. i will be very thanks full if you post a video how to do it. Thanks again! Great job on the videos!

  2. I was told about your lecture today and l love it, on How to change the add to cart link to an affiliate link in eStore if we only want to make a product in a page link to an affiliate like amazon you show, and another page where he can buy another product in our web site(not affliate) should we re ativate the eshop back after the whole process you teah us now

  3. I tried to use the zip file you had and save it to my themes folder but it ruined/erased my entire original theme looks – it looked liked an outlined list of all my postings and pages. I don't know what happened.

Leave a Reply

Your email address will not be published. Required fields are marked *