While most of our work in WordPress revolves around content marketing and search engine optimization, we occasionally need to monetize a blog (usually personal, not corporate). Becoming an Amazon Affiliate is one of the easiest ways to immediately start building an income from a high traffic blog. Within fifteen minutes of setting up your account, you can have banner & sidebar ads on relevant products integrated into your site, and you can add an affiliate link to any product you reference. Once that is done, it may also be worth your time to set up an aStore for your blog — especially in light of how simple it is to integrate. Setup requires comfort accessing and editing your wordpress theme files, and that’s about it.
There are a couple ways to add an Amazon Affiliate store to a wordpress blog. You could build your own store using wordpress posts as item pages. This is very time consuming, but pays dividends in terms of design and SEO. You could also create your own aStore theme to match your blog design. What I recommend, and what I’ll be going over here, is using the default aStore design, but matching colors with your WordPress theme. This isn’t a perfect method, but it’s effective and extremely fast. I’ll be using a store I recently added to Geographical Perspectives as an example.
Start by logging into your Amazon Affiliate account. Click on the blue aStore tab, select ‘Add an aStore,’ and select the tracking code you would like to use. The next screen will allow you to select the products you want to offer in your store. For the purposes of this tutorial, I’d recommend selecting a large category and adding relevant keywords:
This will fill your store with products and allow you to see spacing and final appearance before you manually build up your product list.
Next we need to configure the appearance of the store. For this step, you will need to get color values from your wordpress theme. Many themes allow you to adjust the color scheme. If this is the case, you can simply go into the appearance control panel and copy the color code. If this doesn’t work, you can use the Print Screen key to take a screenshot of your theme and past it into a photo editor. Use the color picker to select the colors you would like to use for the header, background, text, and links, and copy the color code into the Amazon Affiliate theme editor:
Once the colors are matched, enter a name for your store and turn the header off. We’ll be integrating this into your blog, so you won’t need a separate header. When you hit continue, you’ll encounter another page of preferences. The only suggestion I have here is to turn customer reviews off — they tend to take up a great deal of space. Without them, you can cut down a great deal on the vertical space you need for your store. Once you’re done, click ‘Finish & get link.’
Your store is now complete — all we need to do is integrate it into wordpress. Clicking ’embed my store using an inline frame’ reveals the code we need to do this. Now that we have that, we’ll need to create a template in WordPress. To do this, copy your page.php file from your theme directory in your WordPress install. Rename the file ‘store’ or something similar, and add the following code to the top of the page:
Template Name: aStore
Also, delete the following code from the file: <?php get_sidebar(); ?>
In the content area of the template, replace the existing code with your iframe html you just got from amazon. Save this and upload it back into your theme folder. In most cases, the resulting code will look something like this:
As you may notice, I edited the code Amazon provided, to better fit my needs. I changed the width to 100%, reduced the height considerably, and changed scrolling to auto. I’d highly recommend doing all three of these things.
Now simply create a new page on your blog, select the ‘store’ page template under ‘Page Attributes’ on the right, and publish. Add this page to your navigation, and you’re done! Feel free to check out the result of this method here, and leave a comment if you have any questions!