1. Copy these two files (CSS and XSL) to your webserver (it's okay to use the ones on kokogiak.com for testing, but please use your own if you choose to place a widget on your live website).
- CSS File (defining dimensions, colors, fonts):
http://www.kokogiak.com/amazon/xmljs/imgTitle.css
- XSL File (defining transformation from XML to Javascript):
http://www.kokogiak.com/amazon/xmljs/imgTitle.xsl
2. Choose your Amazon.com Search (or Browse Node) and Mode
This is for the part of the URL that looks like this: "BrowseNodeSearch=130&mode=dvd". There are many options available, too many to go into at length. They are all defined in the Amazon.com Webservices SDK. -- Click here to see a few examples, and how they are formatted.
3. Copy & paste the code below into the web page you wish (this sample gives a list of the top 10 DVDs)
Please copy the CSS file and XSL files linked above to your own web server, and change the paths in the code appropriately. There is no guarantee that these files will remain on kokogiak.com
4. Alter the code you just copied from above appropriately
- BrowseNodeSearch or KeywordSearch - put the browsenode or keyword you have chosen in place of the sample (top 10 DVDs)
- mode=dvd - be sure your mode matches your browsenode. if the browsenode is under music, the mode would be "mode=music". List of modes here
- t=kokogiak-20 - put your own amazon associates ID in there, for example "t=happymeal-21". You do want to get the fees for referrals, right?
- href="http://www.kokogiak.com/amazon/xmljs/imgTitle.css" - copy the CSS file to your server and change the URL here, for example "href='http://www.booksalot.net/imgTitle.css'"
- f=http://www.kokogiak.com/amazon/xmljs/imgTitle.xsl - copy the XSL file to your server and change the URL here, for example "f=http://www.booksalot.net/imgTitle.xsl"
[optional changes]
- ref=nosim - remove this bit if you like the old-style amazon.com detail page (to see the diff, click nosim vs old-style)
- dev-t=D24ZY08I7E8YCH - change this if/when you get your own Amazon Developer Token.
5. Edit and modify the CSS file
Edit the color, height, font-size, etc. to your heart's desire, this will affect the layout and look of the widget and all of its pieces.
6. That's it
Below is a listing of other, similar widgets available. I invite you to not only re-use these as-is, but to modify the CSS, XSL and Javascript as you see fit.
Here are a few examples of Amazon.com Search (or Browse Node) and Modes:
Top 10 DVDs:
http://xml-na.amznxslt.com/onca/xml3?t=kokogiak-20&dev-t=D24ZY08I7E8YCH&type=lite&sort=+salesrank&f=xml&BrowseNodeSearch=130&mode=dvd
Top 10 Russian History Books:
http://xml-na.amznxslt.com/onca/xml3?t=kokogiak-20&dev-t=D24ZY08I7E8YCH&type=lite&sort=+salesrank&f=xml&BrowseNodeSearch=5032&mode=books
Top 10 Search Results for 'apple' in MP3 Players:
http://xml-na.amznxslt.com/onca/xml3?t=kokogiak-20&dev-t=D24ZY08I7E8YCH&type=lite&sort=+salesrank&f=xml&BrowseNodeSearch=172630&mode=electronics&keywords=apple
General Search for 'cats' in Music:
http://xml-na.amznxslt.com/onca/xml3?t=kokogiak-20&dev-t=D24ZY08I7E8YCH&type=lite&sort=+salesrank&f=xml&KeywordSearch=cats&mode=music
- You can find BrowseNodes by surfing around amazon.com, and looking for something like this ".../browse/-/172630/..." in the URL.
- Modes available on Amazon: books, music, dvd, vhs, electronics, toys, kitchen, garden, magazines, pc-hardware, photo, software, videogames, baby, and universal (tools)
Provided by Kokogiak Media and Amazon Light