How To Integrate Amazon aStore To Wordpress

Amazon affiliate program is probably the oldest and the most successful internet affiliate program in the world. They provide a wide range of supporting tool for their affiliates. However, among those fancy and helpful tools, my favorite is always their aStore.

aStore is a program for Amazon affiliates, that wishes to have their own niche online store, without having to buy inventories, managing payment and shipping. Affiliates can choose on what products they want to sell in their aStore and able to customize the look to meet their website and niche look.

Amazon aStore not only can be linked directly from your website, it also can be embedded within and integrated into your website or blog. So you can start your online business selling Amazon or its partners products and earn affiliate referral commissions without even letting your visitors leaving your website.

Amazon has provided 3 options and ways to integrate and publish Amazon aStore, i.e. link directly to your aStore as a stand-alone site, embed your aStore using an inline frame and integrate your aStore using a frameset for websites that use frame layout structure. If you own a normal HTML-based website, integration and incorporation of aStore into the website is very easy and straight forward. Just create a link directly to the aStore online store, or create a new page and insert the iframe or frame layout embeding code that provided by Amazon to the new page, then link to the new page from your main index page. However, if you’re blogging on Wordpress platform, the steps to integrate Amazon aStore with Wordpress are not so straightforward. However, aStore and Wordpress can still be integrated by using Wordpress page template, so that the aStore will appear inside the framework or layout of Wordpress, without the need of any Wordpress plugin.

This tutorial is the option by using inline frame, which can make your aStore look and feel match with your website as it still using the same Header and Footer. Now let’s see what we can do here.

Customize Your aStore look
The first step is of course you need to set up your aStore. Some notes on this step are:

1. Choose products that fit your niche for super wide range Amazon products.
2. In aStore set up wizard, don’t use the Header as it will be contrast with your blog’s default header.
3. If your blog’s sidebar located at left side, then choose the store’s sidebar, and vice versa if its at right.
4. It’s better to edit your store’s CSS to match the feel of your site.
5. When it’s all finish, choose to display your store using inline frame. Copy the code and put it to notepad.

Create a new Custom Page for your aStore
This step is pretty tricky. But if you follow step by step, then you should be ok. I use this technique found at Kristarella’s blog (more info on developing pages at Wordpress.org)

1. Copy your page.php file using FTP, rename the file to store.php or whatever you like.
2. Edit the store.php file using your text editor. To remove the sidebar (because you’ll be using your aStore’s sidebar), find this line of codes and delete it:

< ?php get_sidebar(); ?>

After that, add this codes at the beginning of store.php file:

< ?php
/*
Template Name: Store
*/
?>

Finish? Save it and FTP the store.php file to your template folder.

3. Now find this (or by the likes):

< div class="post">

And change it to sort of like:

< div class="post store">

and then styled in the CSS using:

.store { width:30em; } (my aStore was 70em)

4. Back to your Wordpress Dashboard, write a new page, name it Store.
5. Scroll down and find Page Template drop down, choose Store template. You might need also to set the Page Order for your store page.
6. Now copy your inline frame code from Amazon, and paste it to your new page (don’t use Visual mode, use HTML mode instead).
7. Publish your Store Page and you’re done.

Conclution Is..
I implement this to Manchester United Blog. As the football club has just finished their season in high as Champions of England and Europe with super dramatic fashion, i figure what can be a better moment to put the aStore to my blog as its traffic reach the all time high from Manchester United fans all around the internet. Before i integrate the store, it was a standalone site which look like this:

Now, it’s integrated with my blog and look like this. Much cooler right?