Tag Archives: associates

Selective Amazon Product Preview Popups

As an Amazon Associate, I appreciate being able to easily incorporate popups; however, the Product Preview javascript, turns every single Amazon link into a popup. There is a very simple way to for some links to have popups while disabling popups on others.

The standard link to 

<a href="http://www.amazon.com/dp/B003L1ZYYM/?tag=tidgubi-20">AmazonBasics HDMI Cable (6.5 Feet/2.0 Meters)</a>

renders as follows: AmazonBasics HDMI Cable (6.5 Feet/2.0 Meters) (hover to see the popup)

It appears that the Amazon code parses links for "http://www.amazon.com", so updating the link with "https" to 

<a href="https://www.amazon.com/dp/B003L1ZYYM/?tag=tidgubi-20">AmazonBasics HDMI Cable (6.5 Feet/2.0 Meters)</a>

renders without a popup as follows: AmazonBasics HDMI Cable (6.5 Feet/2.0 Meters)
The link works fine, because Amazon automatically redirects from https to http.

Eliminating Mixed Content Warnings with Amazon Associates

Mixed-ContentOnce I enabled SSL for tidgubi.com for free, I realized that most Amazon.com content is plain HTTP, so it was causing Google Chrome to give me mixed content (encrypted page with some unencrypted elements) warning messages:

Two as I dug into the HTML, I found that the Amazon Banner Ads, Widgets, and Payments Button were the cause of the mixed content warnings.

Banner Ads and Widgets

All of the Amazon Associates banner ads and widgets can be loaded over HTTPS; however, the banners any widget that displays product images load these images over HTTP. I couldn’t figure out a way to force the widget/javascript based ads to use HTTPS for images, but I was able to find a little trick to get the iframe based ads to use HTTPS. To do this, simply add &internal=1 to the end of the URL in the iframe’s src attribute and removed http: from the beginning of the URL. Removing http: tells the browser to use the same type of connection that was used to load the page, so these links automatically switch between HTTP and HTTPS. For example my "Kindle Banner" is <iframe src="//rcm-na.amazon-adsystem.com/e/cm?t=tidgubi-20&o=1&p=48&l=ur1&category=kindlerotating&f=ifr&internal=1" width="728" height="90" scrolling="no" border="0" marginwidth="0" style="border:none;" frameborder="0">

Warning: "internal=1" is used in Amazon’s example banners, so while it doesn’t strip associate IDs from links, it might cause these clicks not to count.

Donate/Pay Button

There are two easy fixes for the Donate/Pay button image.

The first option is to download the image and host it on from your webserver. For me the donate image is now at www.tidgubi.com/wp-content/themes/tidgubi/img/golden_small_donate_withmsg_whitebg.gif.

The second option is to link to Amazon’s SSL image server. To do this, just replace http://g-ecx.images-amazon.com with https://images-na.ssl-images-amazon.com. Since Amazon uses a different domain name for HTTP and HTTPS, there aren’t any tricks with HTML to switch how the image is loaded. If you always use HTTPS, it will make the page marginally slower since it needs to establish an HTTPS connection to ssl-images-amazon.com each time. If a page dynamically generates this HTML, you can dynamically pick the imager server based on the protocol used to load the main webpage.