How to insert amazon associate ad widget into website

Github Repo (With dummy id(which works))

Update: It looks like the problem may be that the ad widget I am trying to use requires flash. There are other Amazon ads I am able to display(view github repo), but it looks like some of the more specific widgets may be using flash. I figure that using flash widgets may be a bad idea, but some of the widgets recommended to me on the Amazon Associate website may only be possible using flash.

I am trying to insert the deals widget. I select that I want a sidebar which is 160x400(each of the inner divs in my example is about 520x100). When I click “Add to my webpage” they give me the following popup window so I copy and paste that code into my html file.

I don’t know exactly where to put it, so I’ve tried multiple places which include the head, the body, and inside the innerDiv on the left as shown in the code snippet below. None of these attempts have made the widget show.

Note: The text my-amazon-associate-id is used in replacement for my actual amazon associate id, I don’t the link can work because of this but I had to replace it to abide by Amazon’s policies.

#container{
    display: flex;
    height: 1000px;
    align-items: center;
    justify-content: center;
}

.innerDiv{
    display:flex;
    align-items: center;
    justify-content: center;
    width: 33%;
    height: 100%;
}

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Test Webpage</title>
  <link rel="stylesheet" type="text/css" href="./css/style.css">
  <SCRIPT charset="utf-8" type="text/javascript" src="//ws-na.amazon-adsystem.com/widgets/q?ServiceVersion=20070822&MarketPlace=CA&ID=V20070822%2FCA%my-amazon-associate-id%2F8009%2F4246f29c-6400-4a95-9cdd-994f55f4a2dc&Operation=GetScriptTemplate"> </SCRIPT> <NOSCRIPT><A rel="nofollow" HREF="//ws-na.amazon-adsystem.com/widgets/q?ServiceVersion=20070822&MarketPlace=CA&ID=V20070822%2FCA%my-amazon-associate-id%2F8009%2F4246f29c-6400-4a95-9cdd-994f55f4a2dc&Operation=NoScript">Amazon.ca Widgets</A></NOSCRIPT>
</head>

<body>
  <div id="container">
    <div class='innerDiv'>
      <SCRIPT charset="utf-8" type="text/javascript" src="//ws-na.amazon-adsystem.com/widgets/q?ServiceVersion=20070822&MarketPlace=CA&ID=V20070822%2FCA%my-amazon-associate-id%2F8009%2F4246f29c-6400-4a95-9cdd-994f55f4a2dc&Operation=GetScriptTemplate"> </SCRIPT> <NOSCRIPT><A rel="nofollow" HREF="//ws-na.amazon-adsystem.com/widgets/q?ServiceVersion=20070822&MarketPlace=CA&ID=V20070822%2FCA%my-amazon-associate-id%2F8009%2F4246f29c-6400-4a95-9cdd-994f55f4a2dc&Operation=NoScript">Amazon.ca Widgets</A></NOSCRIPT>
    </div>
    <div class='innerDiv'>
      Hello World
    </div>
    <div class='innerDiv'>
      World
    </div>
  </div>
  <SCRIPT charset="utf-8" type="text/javascript" src="//ws-na.amazon-adsystem.com/widgets/q?ServiceVersion=20070822&MarketPlace=CA&ID=V20070822%2FCA%my-amazon-associate-id%2F8009%2F4246f29c-6400-4a95-9cdd-994f55f4a2dc&Operation=GetScriptTemplate"> </SCRIPT> <NOSCRIPT><A rel="nofollow" HREF="//ws-na.amazon-adsystem.com/widgets/q?ServiceVersion=20070822&MarketPlace=CA&ID=V20070822%2FCA%my-amazon-associate-id%2F8009%2F4246f29c-6400-4a95-9cdd-994f55f4a2dc&Operation=NoScript">Amazon.ca Widgets</A></NOSCRIPT>
</body>
</html>

There must be something really simple that I don’t know about because this doesn’t seem that hard, do not assume I have any common knowledge in this subject.

Answer

Edit: You could try this:

<iframe src="/other_page_in_my_site.html"></iframe>

and fill /other_page_in_my_site.html with following content:

<html>
 <body>
  <SCRIPT charset="utf-8" type="text/javascript" src="//ws-na.amazon-adsystem.com/widgets/q?ServiceVersion=20070822&MarketPlace=CA&ID=V20070822%2FCA%my-amazon-associate-id%2F8009%2F4246f29c-6400-4a95-9cdd-994f55f4a2dc&Operation=GetScriptTemplate"> </SCRIPT> <NOSCRIPT><A rel="nofollow" HREF="//ws-na.amazon-adsystem.com/widgets/q?ServiceVersion=20070822&MarketPlace=CA&ID=V20070822%2FCA%my-amazon-associate-id%2F8009%2F4246f29c-6400-4a95-9cdd-994f55f4a2dc&Operation=NoScript">Amazon.ca Widgets</A></NOSCRIPT>
 </body>
</html>

Pay attention to use the code from amazon site to get the real code.

Another possible source of problem could be having disabled flash in your browser.

Another one possible source of problem could it be having AD blockers enabled.

Hope this helps.

Advertisement

Answer