Notice: Amazon Product Previews stopped working in Blogger here on June 4, 2010. The problem appears if a jQuery script tag (either 1.2.6 or 1.3.2) is included in the Blogger template. Amazon uses a customized version of jQuery 1.2.6 and a lot of scripting for the previews. I want to keep my jQuery script tag, so the information provided below will work in Blogger, as illustrated by the screenshots, as long as it doesn't collide with the standard jQuery library.
When you use Amazon's Link Builder to create a text or basic image link, instructions for adding the product previews script to a standard web page are displayed at the bottom of the "Get Link" step. You can also add the same script to the blogger template or to a single post.
Here is an example of an Amazon text-only link with product preview:
Beowulf and the Beowulf Manuscript (rev sub edition 1997). Mouseover the link to see a box with the book cover image, customer rating, and price. The preview should look like the screenshot below.
Screenshot of preview with text link in Firefox 3.5:
Be aware that product previews work with Internet Explorer and Firefox. In Chrome and Safari(win), both WebKit browsers, the preview box might not display or appear as an empty box. In Opera, the preview does not display at all.
Product previews with image links, such as the example at left, work in Firefox and Internet Explorer. I have had a recurring problem with IE, in that the product preview displays and then disappears unless instantly grabbed with the mouse. The product preview should look like the screenshot below.
Screenshot of preview with image link in Firefox 3.5:
To include the product preview script in a post, click the "Edit Html" tab in the blogger editor and paste the script at the end of your post. Important: Remove any line breaks in the pasted script because they magically become <br /> tags that will cause errors. Then change the ampersand (&) in the script's "src" attribute to &.
The script should look like this, with the script tag all on one line:
<script src="http://www.assoc-amazon.com/s/link-enhancer?tag=yourTagID&o=1" type="text/javascript"></script> <noscript><div><img alt="" src="http://www.assoc-amazon.com/s/noscript?tag=yourTagID"/></div></noscript>
The code has been added to this post, so it can be seen with "View Source". However, since I have also added the same script to the blogger template, product previews will display in any post that has Amazon text links in both Internet Explorer and Firefox, or in Firefox with image links. Please see this related post for more information about adding the product previews script to the blogger template.
1 comments:
Please be aware that the product previews script works only with text and basic image links. It doesn't work with text+image iframes, but the same product info is already in the iframe, so there is no need.
Post a Comment