An aStore in Facebook?
You've decided that affiliate marketing is for you. You've built an Amazon aStore. You've spent your time, diligently sifting through products to add to it...
Harnessing the power of social media, you even have a Facebook page dedicated to your affiliate marketing efforts... You created a timeline cover photo to clearly express the page visually... You post status updates to that Facebook page with links to specific products in your aStore...
But wouldn't it be awesome if you could show off the whole aStore right in that Facebook page? Well... you can!
Have a look at the Communist Closet Facebook page, for example. Notice the tab titled "Soviet Shop?"
The Soviet Shop is an Amazon aStore embedded directly into the Facebook page with a little HTML and a "Facebook-legal" app. No, we're not hacking anything... just making use of resources.
What You'll Need
- Admin access to a Facebook page (if you created it, you already have admin access)
- Free custom tab app (I like to use Static HTML: iframe tabs)
- Amazon aStore and its associated link
Do yourself a favor... have Facebook and Amazon Associate Central open in separate browser tabs (or even separate browsers, if you prefer). That way, you can go back and forth between the two if the need arises.
Adding the App
Navigate to the app within Facebook (with the link above) and click the "install" button to add the app to your page. On the next screen, the app will ask you to confirm the installation destination (the page in which you will install the app) if you admin more than one Facebook page.
Select the proper destination page and click the "install" button to confirm. Yes, it really is that simple.
Edit the Tab Content
After the app installation is complete, return to your page. You'll find a new tab titled "Welcome!" on your screen. Click it and let's work some magic!
Don't worry about the tab title and image just yet, we'll get to those shortly.
Read More From Toughnickel
Clicking on your new Welcome tab will bring you to this editing screen. Here, you'll be able to:
- Host your "code" in the index.html section
- Organize code further in the style.css and script.js sections (for more advanced users)
- Change tab settings
- Create a Fan-Gate (we'll do that in another Hub)
By default, you'll land on the index.html section of the app (this is where we'll do all of our work). Please delete the existing text in that section.
Get Your aStore Code
In Amazon's Associate Central:
- Use the drop down menu at the upper left of the screen to select the proper tracking ID of your aStore. (This is only necessary if you have multiple aStores in the same account... if you have only one aStore, don't worry about this step.)
- Click "Get Link" in the left menu.
- The page will display a new screen titled "Your store has been published!" Directly below the announcement, you'll see several versions of your aStore link.
- Select the "Embed my store using an inline frame" option. We'll modify this code slightly to optimize it for Facebook integration.
- Copy all of the code in the text box and paste it into the app (index.html section) within Facebook.
The code we'll be working with should be something like:
<iframe src="http://astore.amazon.com/YOURamazonID" width="90%" height="4000" frameborder="0" scrolling="no"></iframe>
When first pasting your link code into the app, you'll see a message warning about your aStore URL being insecure. No, the link won't ask you if its source code makes it look fat. But, some browsers may not display your aStore properly because they don't "think" that the store is hosted on a secure server. This is particularly important here because, after all, we don't want to make your potential customers paranoid when shopping.
So, first thing's first... Change the http:// within your code to https://
Adjust Display Dimensions
Now, we'll change the displayed dimensions of your aStore within the Facebook page.
Notice that the width is set to 90%? Well, that's 90% of what the browser calculates as the current page size. This will be absolutely inaccurate... We'll specify the width as 815 pixels to fit into the iframe app.
Change width="90%" to width="815px"
I also recommend shortening the height (significantly) to 1000 or even 1200 pixels. It'll make your content a little more contained...
Change height="4000" to height="1200px"
Your aStore can get quite lengthy (even longer than the original 4000 pixels specified). This generally happens if product descriptions are long and there are several product reviews posted as well. By default, scrolling is disabled... and that'll cut off content beyond the specified height. Since we don't want to limit your aStore, we'll enable scrolling.
Change scrolling="no" to scrolling="yes"
Your finished code should now look something like this:
<iframe src="https://astore.amazon.com/YOURamazonID" width="815px" height="1200px" frameborder="0" scrolling="yes"></iframe>
Don't forget to hit the "Save & Publish" button in the upper right corner. You may also preview your work at any time with the adjacent "Preview" button...
OK, I'm nitpicking... We have iframe code within an iframe app. Yes, it's redundant. Yes, it should be fixed. But, for ease of use in this beginner's level guide, I'm going to leave it as is. Don't judge me.
Now that your aStore integration is complete, you'll want that pesky little "Welcome!" button on the front page to look a little more meaningful, right?
- Return to the "front end" of your Facebook page.
- Click the small button (with a downward pointed triangle) to the immediate right of all page tabs.
- As the page expands, hover your mouse over the new "Welcome!" tab.
- You'll notice a new icon (pencil) appear over the tab. Click this icon for a new drop-down menu.
- From the drop-down menu, click "Edit Settings."
- A popup window will appear in which you can change the tab's name and add a custom image to display as the button.
- Customize the tab as you please.
And you're done!
This article is accurate and true to the best of the author’s knowledge. Content is for informational or entertainment purposes only and does not substitute for personal counsel or professional advice in business, financial, legal, or technical matters.
Mish on July 12, 2018:
There are no a stores anymore. any other way of displaying amazon items directly on our pages?
Debasish Pal on June 17, 2018:
Looking error: This page does not have permission to install the custom tab.
Kelly North on February 20, 2017:
I tried this. My aStore is there but when I view the products and click on 'Next' or page 2. I get a message that says 'well, that didn't work, refresh the page. But refreshing does nothing. What went wrong?
TraderJustin on November 17, 2016:
Thank's for all the great information everyone! Still having same problem categories do not work...It's like missing the back-end links... Any ideas?
Articulated on November 06, 2016:
Did anyone ever figure out how to get this working?
Steven Denger on September 25, 2016:
Hello - What this "https" amounts to is the astore is not at all a workable store for a facebbok page. The only thing I get displayed is the first front page, When I try to change pages or categories, I get a white blank page. I tried changing back the https to http on the form url and I got a total blank from the beginning. Unless Amazon changes all their urls to secure https, this astore thing in facebook pages will not work - unless one wants to pay $50. per month for the premium thunderpenny - and I am not so sure if that would even take care of the problem. As I see it, Amazon needs to change all their url's to secure or forget it.
Steven on September 25, 2016:
Helllo - I already had a "shop now" button on my fb page that linked to my website - which I wanted. However - I did not see a "welcome" tab after I followed your instructions. There are no additional tabs created so how do I link the "page astore" so fb veiwers that go to my page can see the "page astore" as well as go to my site if they want to instead?
Timothy on September 21, 2016:
So I did some digging on this — I found this is a common issue without an apparent native solution, but that there is a paid solution with the Thunderpenny secure website app. Details below.
Why this happens: Not all the content from the Amazon aStore is securely hosted, which is required by Facebook for privacy and security reasons. This is why not all the links load. Securely hosted content will have a native address of https:// instead of http:// (the s stands for secure). I made this video to help explain it: http://www.screencast.com/t/GqjH2r4J6h
Solutions? I spent about 40m looking for a native solution online, specifically using the term “amazon astore https issues”. One solution looked promising (http://stackoverflow.com/questions/3890003/amazon-... but didn’t work for me. In any case this appears to be a widespread issue, and that alas, the Thunderpenny secure website app appears to be the one workable (paid) solution.
Alex on August 20, 2016:
The issue with posting aStoe as a static HTML seems to be that static HTML is, you know, static. It only shows the url you have linked to it. To avoid the issue of blanking out, you need to update static html to website html. The problem with that is it won't be free anymore. If you have another walkaround, please let me know
Nader on June 07, 2016:
Having the same issue, the store displays and function on IE explorer after dismissing " only secure content is displayed " and choosing to show all content
Any one have any luck with this?
Stan on May 15, 2016:
I get it all working but when I click on "shopping cart" or add something to it, the page goes blank.
Some thing on your Communist Closet fan page.
Yukiko Takemoto from New York, USA on May 06, 2016:
I am also having huge trouble. I really want to do this, but impossible to follow. I followed your steps, but it does not show the exact result your are showing right from the beginning, and I don't know what to do. Meanwhile my brand new FB page I just campaigned with is blank!!! Please help!!
Dessie on March 25, 2016:
I am having so many problems with this. My store shows up but you can not click to categories the page goes blank and you can not add to your cart. The page goes blank. Please help.
Matthew from Florida on July 20, 2015:
That's cool, I have had an online store for awhile and have never really used facebook...
Allison Wonderland on August 29, 2014:
Thank you! I didn't even know this was possible, but I found your tutorial searching for information on aStores.
SwirlySal from York on August 22, 2014:
Had the same problem .... need to use different static html tabs rather than the Thunderpenny one that seems to be the default choice .... currently looking for the best free alternative
Jay on August 18, 2014:
I have tried remedying the problem of not being able to navigate through category links also but I noticed if you right click to open then it will open in a new tab or window then the A stores category links may be clickable.
Eddie Dagstanyan (author) from California on August 08, 2014:
You're all very welcome, glad it works for you.
@ DPG - Sorry for the delayed reply. Any luck yet? What browser are you using?
Vivian Sudhir from Madurai, India on June 22, 2014:
Great, thanks for the information.
noenhulk on May 30, 2014:
Very useful information. I will try this one. Thanks for sharing!
DPG on May 27, 2014:
Hi, Thank you for your page !
I've successfully added my astore to my FB page but like some others people i can't navigate trough categories, even in visitor mode...
Any idea please ?
Eddie Dagstanyan (author) from California on May 24, 2014:
@cobby - You're very welcome, glad I could help. :)
cobby on May 22, 2014:
thanks your page helped me a lot
Eddie Dagstanyan (author) from California on May 07, 2014:
@ Will Lake - I also don't see anything prohibiting the aStore. There are conditions that prohibit the sales of pharmaceuticals or promotion of gambling websites. The aStore, however, seems to be OK. I would certainly appreciate being corrected if I'm wrong.
Eddie Dagstanyan (author) from California on May 07, 2014:
Thank you all for your patience as I research this (without an awful lot of luck, I might add). For all of you that did have an issue, please make sure you are trying to access the secondary categories in "visitor mode" of the app rather than "edit mode."
To enter visitor mode... Click on your custom tab, it'll bring you into the default edit page. On the upper right corner, click on "view tab as a visitor." This will open a drop-down instructions tab with a second button titled "open visitor mode." Clicking on this button will open a new window with your aStore embedded into your facebook page. Editing in this window will not be possible, in this window you will be viewing the tab just as anyone else without admin privileges.
For some, this may be the hold-up. If it still doesn't work for you, I would appreciate more details (your browser, which version you're using, etc) to help troubleshoot.
Kate on May 01, 2014:
Urgent - I cannot change the tab icon picture and get this message: User Is Not Authorized To Edit App settings
Store displays find inside the tab.
I am signed it as Admin. Please advise how to change icon picture????
William Lake from Siem Reap, Cambodia on April 30, 2014:
Is the aStore OK with regards to the terms and conditions? I'm not talking about the content of the page/aStore, but instead the actual aStore itself.
I've looked at the terms and conditions and I can't find anything!
Jen on April 28, 2014:
Any new updates? I'd love for this to be an option on FB! :)
Andrea on March 09, 2014:
great thank you!
Eddie Dagstanyan (author) from California on February 23, 2014:
Hello, all... Please forgive the delayed reply. I've just had a look at the example used in this Hub and I'm also having some new issues. Interestingly enough, it's Chrome that is behaving well but IE that is giving me the most grief. I'll work on it between different browsers in hopes of finding a solution, assuming that a solution can be found with a modification of our code rather than something within Facebook or Amazon. Stay tuned...
Dan on February 16, 2014:
I had the app working for months but now the add to cart button does not work. A few of the links in the astore work. I am at a loss.
Kelly Manning on January 24, 2014:
I'm having an issue with FireFox and Chrome. The "add to cart" button works just fine in Internet Explorer 11, but the latest Firefox and Chrome just see the button as an unclickable image. Any idea how to remedy this?
PamMcKeen on January 02, 2014:
I'm having the same problem. My Amazon store worked when I first set it up Now the store comes up when I click the tab but I can't click through to the Amazon Store or My Categories. Please advise.
Mary Baker on December 26, 2013:
When I test click on products, it does not take me to my Amazon account. No message, nothing happens. What's up?
Craig Stapleford on November 27, 2013:
Im also having the problem of the categories not opening, anyone got a fix for this? i know accepting unsecured content on your browser fixes this but i don't want customers to loose trust.....facebook isn't the most trustworthy place as it.
your guide did the trick at getting it up tho which i thank you for......just need some way of making them categories Https
Eddie Dagstanyan (author) from California on November 25, 2013:
Happens to the best of us. :) Glad you got your answer, Jane!
Jane Akshar on November 25, 2013:
Ignore my question I had static HTML block, my bad
Jane Akshar on November 25, 2013:
Does this still work as I notice the shop is no longer on your Facebook page?
Eddie Dagstanyan (author) from California on November 25, 2013:
Hmmm... I don't seem to have that issue. What browser are you using?
Myself on November 24, 2013:
problem is, categories do not open up on fb.