Customizing an Amazon Widget in a Wordpress Widget

I recently built a site for sorting and selling authentic luxury watches. In the sidebar I placed an Amazon widget to sell similar watches. However, I wanted the Amazon widget to change based on the contents of the page. Amazon's Omakase didn't do the job, so I needed something else.

I came up with a Javascript solution that searches the URL for certain strings, and then builds the Amazon widget with a custom search parameter.

Here's the code:

<!-- Switching Amazon Widget -->
<script type="text/javascript"><!--
    var aSearch = new Array( "blancpain", "breitling", "bulgari", "cartier", "corum",
                             "omega", "patek", "rolex"  );
    var aQuery  = new Array( "watches&search=blancpain",
			 "watches&search=breitling%20new",
			 "watches&search=bvlgari%20new",
			 "watches&search=cartier%20new%20watch%20-longi%2A",
			 "watches&search=corum%20new%20watch",
			 "watches&search=omega%20new%20watch",
			 "watches&search=patek%20philippe%20watch",
                         "watches&search=rolex%20oyster"  );
    var sAmazonBegin = "<iframe src=\"http://rcm.amazon.com/e/cm?t=fondant-20&o=1&p=14&l=st1&mode=";
    var sAmazonEnd   = "&fc1=000000&lt1=&lc1=3366FF&bg1=FFFFFF&f=ifr\" marginwidth=\"0\" marginheight=\"0\"" +
                       " width=\"160\" height=\"600\" border=\"0\" frameborder=\"0\" style=\"border:none;\" +
                       " scrolling=\"no\"></iframe>";

    // Look through the URL for one of the strings in the search array
    var sUrl = window.location.href;
    var sTarget=aQuery[0]; // Default search if we do not find anything
    var i=0;

    for (i=0; i<aSearch.length; i++) {
        if (sUrl.indexOf(aSearch[i]) >= 0) {
            // Woo ho! We found the search string. Now grab the search "meat".
            sTarget=aQuery[i];
            break;
        }
    }

    // Now build the Amazon widget.
    var sFullAmazon = sAmazonBegin + sTarget + sAmazonEnd;
    document.write(sFullAmazon);
--></script>

Code (markup):

It took a while to figure out the best search strings. The AMZN widgets are kind of finicky. For instance, "Rolex" gives almost any other watch.

Now when I click on Corum for Men, the AMZN widget shows Corum watches, etc.

The original blog post can be found at: Customizing an Amazon Widget in a Wordpress Widget

 

Where exactly do you place this file?

 

I use a Wordpress "text" widget in the sidebar. The contents of the widget now change based on the url of the current page.