How to Add an Amazon aStore to your WordPress Theme
88Amazon Store for WordPress
To date, I have 8 websites. One is a growing article directory which I made Hubpages and Squidoo easy for fellow authors. One is my business website and the rest are Niche sites using Wordpress themes. None of my sites have stores on them, well that is until now. I’m in the process of creating a new site and decided this would be a good time to try and integrate a store into the site navigation. My only requirement is that the store has to look as if it is part of the website. I don’t want my visitors to navigate away from my site to make any purchases.
Whoever thought it could be so difficult to add an Amazon aStore to a WordPress theme? The fact is, it’s not that difficult at all. That is, if you have the right information. I spent the better part of the day searching online for information on how to do just that. There is plenty of information on how to add an Amazon store or “widget” to a website and there were a few tutorials on how to add them to Wordpress. But I could not find the information I needed to fit my requirements in one place, hence this tutorial.
First Step to Success
In 6 steps, I’m going to explain how to add your own Amazon store to your self hosted WordPress blog. You won't need to know anything about programing to complete this task, however you should at least be familiar with uploading pages using an ftp client.
Step 1:
Copy the code I provided below into an editor like PSPad which is free, or into notepad, and save it as a .php file.
Do not worry about the line that leads to my store right now, you will be changing that in a later step.
<?php get_header(); ?>
<?php
/*
Template Name: a Store Page
*/;
?>
<?php get_header(); ?>
<!-- Paste your own code below over the example code I've supplied -->
<iframe src="http://astore.amazon.com/howtomakeahor-20" width="100%" height="4000" frameborder="0" scrolling="no"></iframe>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php the_content(__('[Read more]'));?>
<?php endwhile; else: ?>
<p><?php _e('Sorry, no posts matched your criteria.'); ?></p><?php endif; ?>
<!-- The main column ends -->
<?php get_footer(); ?>The Rest is Easy
Step 2:
Using your ftp client, upload your new astore.php file into the theme of your WordPress content. Once that is complete, you can close your ftp client and you will not need to go back in for the rest of this procedure.
Step 3:
Log into your Amazon Associate page and select aStore. This is where you will configure the look of your store and decide which products you want to promote. You have a few options, one you can manually choose the products for your store, or you can find a “listmania id” and use the item that are in the list you choose. Personally, I would hand select my items manually.
Once your store is configured the way you want you will be given a choice on how you want your aStore to be displayed. Choose the ‘Inline Frame’ then copy the code that is provided.
Step 4:
Login to your WordPress dashboard and select the theme “Appearance” button, then select “editor.” Now on the right side there will be a list of pages which are part of your chosen theme. Select the Amazon aStore Template (looks something like this: Amazon_astore_template.php) You will know it because you just created and uploaded it.
Step 5: Very important step but I wont mind if you skip it J paste the aStore code that you copied from your Amazon Associate page over the default code that is there. The code that is there will lead to my store. Once your new code is pasted over the default code, update the page with the button below the editor.
Step 6: Navigate back to your WordPress dashboard and select “Page,” then “add new.” Name this page Store or Shop or whatever you like. Down below and to the right there should be a place to select a page template. Use the drop down menu and select “Amazon Store.” Now publish that page.
You Are Done
And that is all there is to it. You will now have on your WordPress theme, a fully integrated Amazon aStore that has the same look and feel of the rest of your website. Now go earn some money!
If you want to see how my new site looks with the new store added to it, Click Here!
UPDATE 1/21/2010: THE CODE ABOVE WAS MISSING A SEMI-COLON ON LINE 7 WHICH WAS CAUSING A SYNTAX ERROR. IT HAS NOW BEEN RESOLVED AND THE CODE ABOVE UPDATED. IF YOU HAVE HAD SYNTAX ERRORS WHEN TRYING TO INTEGRATE YOU aSTORE THEN YOU MIGHT WANT TO TRY THIS AGAIN WITH THE UPDATED CODE. SORRY FOR THE TROUBLES.
vote upvote downshareprintflag
- Useful (21)
- Funny (1)
- Awesome (12)
- Beautiful (2)
- Interesting (1)
CommentsLoading...
Not a problem dohn, Glad my research can help others. If you have any questions I'd be happy to help.
Good stuff. A little php is very helpful.
How in the world do you get your code formatted so nicely?
Good information on your hub!!!
Thanks!!
Thank you nicomp and alwaysabridesmaid for your comments. I hope you can put this info to good use.
Thanks for the comment Fianno, and I'm sure you can manipulate the height number to fit your sites needs. No, it's not against amazons rules to do that either.
Totally awesome tips! Just posted my store on my blog.
Great job Kaffana, glad I could help.
This rocks! IT took me about 5 minutes to get an Astore up and running.
Awesome tips! I had purchased a plugin to do the job. Wish I had known this several months ago. Could have saved me some cash! :)
Nice clearly laid out set of instructions there that are simple to follow. Good Job! :)
Yes, good idea and good hub. You may want to check out the 'archives' on the right hand side of your articles page, I got an error when navigating to it. It might just be my setup though. Cheers.
This is really simple to do and can really add to the revenue from your website.
Anyone who cannot find the astore setup page (like me) can find it on 4th one along of the blue tabs on the top of your associates home page. I found it best to create your own list from items in amazon and then create the astore from that list. Searching through all the products in astore setup takes a long time.
Vijay, are you using your own self hosted Wordpress theme? If so, it sounds as if you skipped step 6 where you add a page and select the amazon store template.
Gary, you must make sure that you are attempting to add an aStore to a self hosted wordpress theme. I have not tried this on other blog platforms, but it's basically all the same. Save that code as "mystore.php" then upload it to your site wp_content folder on your server via ftp. Once you exit and log into your WP dashboard, navigate to your "appearance-editor" if you see the .php that you just uploaded you should be able to follow the rest of the directions. If you do not see it then you did not upload it properly so try agian.
Hi i see the a Store Page Page Template (myastore.php and i also see myastore.php (myastore.php But it still just shows a blank white page?
Are you sure you used the inline frame code for your aStore?
This is easy to do. I added a simple Amazon store to a kids learning website I work on. Adding products to my store is as easy as shopping on Amazon too.
It drove me crazy when I was first trying to figure it out but then after putting it all together I can't believe how easy it actually is. Thanks for visiting Artemus.
This may be a dumb question, but I am using TextEdit on a Mac for step 1, and it won't let me save as a .php file. It keeps on adding .html after the .php. I can't get rid of the .html. BTW, this is just the instructions we were looking for - thank you so much!
Hi Joan, try using Textwrangler or Textmate, they are both free text editors for Mac. Just do a Google for them. Hope it works for you.
I get this when I hit the preview button...
Parse error: syntax error, unexpected T_DNUMBER in /home/simplem3/public_html/justtherightthings/wp-content/themes/amazing-grace/astore.php on line 8
(Textwrangler worked like a charm, thanks)
Hi Joan, look over your code real good and compare it to the code I have on this page. The problem may be because you forgot to add a semi-colon on the end of one of your lines of code “;” That is the most common cause for a syntax error with php.
I'm new to hubpages and thrilled with all the information that you provide for newbies like me. Great work!
I have executed your instructions to the T but my astore is larger than the allowed space within the theme. I can not for the life of me figure out how to fix it. how can I delete the wordpress them side pars just for the stores page?
Thanks for the great step-by-step instructions. I'd been wondering how to do that. Will give it a try. Again, thanks.
Fantastic post! It's helped me get 90% of the way there. However the theme that I'm using, "Swift" has a right hand column that seems to get in the way. It's the same on all pages: http://www.outdoorgearadvisor.com. Any recommendations for how to get the right hand column not to show on my store page?
Thanks! -David
Hi David, double check everything listed again because the page template that I have you create above becomes the page of your aStore. The sidebar elements are removed so when you go to the aStore on your site there should be nothing but the store and the categories you made when building your store on Amazon. I checked out your site but there is no "store" page. Or at least I couldn't find one.
Thanks for the quick response! I had not published the page since I was still having issues with it. Here it is:
http://www.outdoorgearadvisor.com/store/
I also tried this recommendation: http://swiftthemes.com/forum/topic/please-help-my-
but still had an issue with the store only appearing in the left hand column. In the latter case the right hand column was blank.
Thanks again! -David
David, just checking, but when you added the store page did you select the astore template from the dropdown menu on the dashboard? It looks like your footer is now in your sidebar which shouldn't be there if the template "astore" was selected. Sorry its causing trouble, I know how frustrating it was when I first figured it out. I'm not a programmer or coder, I'm a trial and error guy..lol
Best advice if the template was not the problem. Using your ftp, go to your theme and delete the astore.php file you uploaded and also the page you created and start fresh. I know its a pain but you may have missed a step.
1. copy and save the code above (dont change the astore code yet) then upload it to the wp-content--->themes--->Swift sub-folder. Then log out of your ftp client.
2. Log into your theme dashboard and go to the appearance tab and select editor. Find the .php file in the right sidebar that you just uploaded and select it. Paste your astore code that you created at Amazon over the code there and save it.
3. Select the page tab and create a page. Name it and on the right side of the dasboard near the middle there should be a drop down menu for page templates. Select the aStore template then save all changes. Publish the page and that should do it.
The page template which is the code above has no sidebar elements and no frames so if it is uploaded properly it should work. Hope this helps.
Hi Richard, thanks again for all of the tips. I'll try going through the process again later today, and hopefully that will do the trick.
-David
Hi Richard! After more tinkering and reading online I was somehow able to get it to work! Very excited. Thanks for your help. http://www.outdoorgearadvisor.com/store-2/
Cheers,
David
Way to go David, now dont forget when you write your posts to link to items in your store. It helps.
I am also getting the error (Parse error: syntax error, unexpected T_DNUMBER in /home/afzalb/public_html/bestfrenchfacial.com/wp-content/themes/red-light/astore.php on line 8) despite uploading/amending file numerous times and following instructions step by step. Very frustrating!!!
Cantona7, I checked out your site bestfrenchfacial.com and noticed that the sidebars are still showing up in your store. This tells me that the instructions above were not followed EXACTLY. It could have been a simple omission of a single character when doing a copy paste. The best answer I can give you is to undo everything you did, step away from it for a little while then start over fresh. It may not seem right but every single character in the code has a function.
Thanks this will save me much research! I also enjoyed following the link to one of your sites - some interesting ideas and inspiration. Many thanks - Mark
Thanks Mark, hope everything works out for you.
Joani, follow my instructions above to the letter and you will find that the code sets a page template that removes the sidebar so your aStore can be viewed correctly.
livewithrichard, you're wrong with your assumption about Cantona7 as I have that same problem.
it's clearly not as straightforward as you suggest for everyone.
I copied your code EXACTLY more than once and I get that error.
Feel free to try on my blog for yourself and you will see.
I don't know what to say James. Many people have come here searching for the way to place an aStore on their Wordpress blog. It may be an issue with the theme you are using. I wish I could help more but I'm not a programmer and as I stated I compiled this information from several different locations on the web. I tinkered a bit with the code above and it has worked just fine for dozens of others. I hope you can find a solution to your problem and if you do, please come back and share it as I'm sure there will be others in your situation.
Great advice and thanks for providing the code!
Thanks for this, Richard. I haven't tried it yet but I was wondering if this store is strictly for Amazon products? Or can you add products from elsewhere too? I would imagine not since it has the affiliate code to the Amazon store. Does this work within WP E-Commerce plugin? I would also assume that you don't need a shopping cart but what if a person wants more than one of the products in your store?
Hi Lorraine, good question. This is just for the Amazon aStore and you cannot add items frome elsewhere. You would not need the e-commerce plugin with this becasue the aStore has a built in shopping cart. Of course, the best way to sell items from you aStore is to write a post about the product and then link to in in your store. If people add a product to their aStore then leave your site to visit another site and add more products to their cart then you will lose out on the commission since Amazon has a one session cookie. So the ideal course of action would be to write a product review on your blog and link to a product in your store and then write another review in your hubs and link both to the product and your other blog.
Thanks, Richard - great information as usual! What you are saying is that I connect the product on Hub pages to my blog - am I understanding that correctly - I would go to my blog, save the URLs for the products, paste them into my Hub pages thus directing traffic to my blog - is that right?
Now as far as the code for the astore is concerned, for others who have already downloaded the code previously, be sure to put a semicolon after the */ on Line 7 so it looks like this: */; otherwise you'll get an error message.
Otherwise this solution works brilliantly - I was so amazed that finally something is easy on the web! Now, if I could figure out if the darn thing works - test it - is there a way to test that the whole system works?
If people are interested they can have a look at what I did - it's not pretty but I have something - that's big for me - http://www.wizetime.com, tab Time Products
You'll have to mouse over the product in your store to get the url and then yes you can use a contextual link inside your blog post leads to your store, you can do the same from your hub if your intention is to get traffic to your blog store. It depends on how you are going to review the product. If you have several products you're discussing then you might want to link from your blog post to your hub or or other article where you have a more in depth review of the individual product. Wherever you have the individual product review is where you should place the link to your astore product. Either way works because the point is to get deep linking going on. Links from your hub to your blog will do more for your rankings than links from your blog to your hub because HP has a much higher PR. Don't forget to use your anchor text.
hello, ive had success using this little script, but the problem i am having is finding a theme the amazon astore will fit into, i am a novice at best with html, and am failing at editing a theme to remove sidebars, and get the store to fit, can anyone advise me as to any wordpress themes that are compatible with amazon?? ie no editing required?? any help would be muchly appreciated..
cheers jonathon
I really appreciate this information. It saved me from what would otherwise have been hours of work. I do have a question/problem. After following the instructions and loading the astore into the semi-reloaded theme, there are numbers appearing just below the nav bar and above the astore box. Here's what it looks like:2. 3. 4. 9. 10. 11. 12. 13. 14. More numbers appear below the astore near the footer. Any ideas as to what is causing this?
Thanks. Don
Richard - I just used your step-by-step instructions - and managed it too! I'm feeling very hoppy with myself. And I'll tell you how much I knew beforehand ... I didn't even know how to save the copied code to a .php thingy, never mind upload it using filezilas and what not. Yet I did it. Messed with the code too, so that my shop fit my site.
So great hub, mega thumbs up. And thankyou!
Thats great news Frogdropping. I was so frustrated my first time that I almost gave up on it. Glad I kept at it and that what I have found can help so many.
Hi Richard. Many thanks for your help. Very helpful and to the point. The training packages I have been subscribing to for the last year didn't help that much. I only wish I could get my head around the rest of it.
Thanks again.
Hi Richard,
I have tried over and over again to create a php file of your code using Notepad. I am calling the file astore.php, but the file saves each time as a Microsoft Picture It file which is essentially a dead program on my computer. In a Google search on how to set up php files, I was advised to put quotations around the file name, which I tried as well, but it made no difference. Can you help?
Thanks.
Susan
thanks man, informative article you rock!
Hurray! I've solved my php file problem (solution: it's supposed to be a Microsoft Picture It file) and have finally installed the astore on my blog. I had the same problem others have mentioned where the astore's side bar is partially cut off. But I easily fixed this by increasing the width code in the astore template from 90% to 103%.
Thanks, Richard, for this hard to find information on adding astores to WP themes. It really is easy and it works! Check out my site's new astore!
Okay gguys need help on this ...... I am using WP launch theme... I placed the store.php in the WP Lanch theme folder... did all of that .. but when i am creating a post... i dont see a option to change to the amazon store theme... any help?
got it to work nvm :P
I have a problem saving the store code as a php file. Whenever I save it in notepad it saves as a txt file and it wont upload to my blog.
Any help would be appreciated.
@iriegirl try downloading the PSPad from the link I provided above and then use it to save your php file. It's a good program to have if you plan to customize your own websites.
Richard, I recently started my Astore for a niche site i built, I am very familiar with php and coding but wondered if you find that the Astore converts well for you?
@McConnell Group, it really depends on the site. I have a gaming site which converts to sales real good and then I have a site on blogging http://heyworldimhere.com which gets tons of visitors to the main site and little to the store. I find that you will get the best store conversions if you first blog about a product that is in your aStore. Hope this helps.
Hope you do not mind -have put a post up on my blog with links back to your site explaining the concept you provided me to integrate a Amazon page-3 links back to your site-are you ok with this?I was so impressed I thought you might like some backlinks-let me know
Not a problem John. Good luck with your site.
Awesome info but i have one question, How many a Stores can i install on one wordpress site thanks.. Keep up the great work thanks again :)
Wow it really works !! Thanks a lot buddy
Great article. Step-by-step, I love it! It's one thing to just ramble on about how to do something but when you break it down into steps you really help people understand what they're doing. Props to you!
Nice job
This is great, you've just saved me a bunch of time!
Great, don't forget to promote your products in your blog posts and link to your astore.
Hi,
Thank you so much for this it has worked brilliantly first time my first real sports blog is surely going to be a hit thanks to you lool!
I also had a problem on the first go round (using headway theme). I FTP using Dreamweaver, which added a bunch of additional code, and it didn't work. Here's how I fixed it ... After I uploaded the astore.php file that didn't work, but I could see it under Appearance/Editor, I completely erased the code that got FTPed, and copied over the code as provided on this website exactly. I then copied my Amazon code, and placed it as instructed. Published it, and BINGO!! Thanks a bundle!!!
Thanks for infos
Wow, this is brilliant. Thank you so much - I've been wondering how to add an Amazon aStore to my Wordpress blog and now I have, in under half an hour. Cheers.
Glad it worked for you. I tried to make the steps a simple as possible.
The steps outlined above work but it's real easy to miss something small like a semi-colon or something. Best advice if it doesn't work for the first time is to undo everything and start again. It will work.
Thanks for this information on adding astores to Wordpress, livewithrichard, I have an astore and a brand new Wordpress site, so will give it a go!
This was exactly what I was looking for - thanks! You saved me a ton of time.
Is there anyway to keep the original page and just change the size of the frame??
The numbers in the code above are not set in stone. Try to adjust the width and height of the frame. Right now the width is set at 100% you can try 75% or smaller. The height is set at 4000 which makes for a very long page. You can reduce that too by as much as you want, try 1500 and go from there.
Thank you for your great article. Really useful help!
I have put mine on as well =D
Thanks so much, I just used your code on my new store
great hub with lots of information, thanks.
Thanks so much for such a helpful information
Thanks for this info. I just got started with Wordpress so really any type of "cheat sheet" I can get my hands on will prove useful at some point.
Very useful info thanks and have implemented it on one of my sites, although I went to your site to check yours out and got a 404 error.
Hey, I just added my amazon store to my website and it really went well. I really appreciate your effort and want you to know that you're a great help to people like me who are less equipped with programming knowledge. I develop my word press site myself and don't like to pay developers for little changes. And your article here was very helpful in achieving that. Keep up the good work. Be blessed!
Your post on adding an Amazon aStore to a Wordpress blog was excellent!! Thank you sincerely.
I Followed all the steps and changed the code to my amazon store but it still shows your store when I create a page and publish it. How can I fix this?
TMC33, clear your cache then try it again. Make sure that you copy the code exactly because missing just one character will make it not work. Good Luck!!!
Thanks! Do you know how to make the iframe no follow or no index?
i like how you elaborated the step by step procedure! thanks man! - http://www.ribit.com/
dohn121 Level 3 Commenter 2 years ago
Thanks, livewithrichard. I was contemplating on doing this. Thank goodness you did the suffering for me! I will bookmark this and come back to use it. Thanks again.