Show Language:

Displaying a Single Thumbnail Image on a Web Page

Displaying a website thumbnail image on a web page involves:

The 'get_thumbnail_link' Function

The examples on this page call the get_thumbnail_link function in the ThumbnailUtility package to display a single site thumbnail image on a web page. The get_thumbnail_link function takes the following parameters:

Parameter Description
Access Key Id Your Amazon Web Services Access Key
Secret Access Key Your Amazon Web Services Secret Key
Size 'Small' (for 111x82 pixel thumbnails) or 'Large' (for 201x147 pixel thumbnails)
Default Image The URL of an image to display when no thumbnail is available. For example, http://client.alexa.com/common/images/noimages.gif. If this value is blank or null, the Alexa default image will be displayed.
SiteUrl The URL of the website to return a thumbnail image for

The get_thumbnail_link function makes a request to the AlexaSiteThumbnail web service to get the URL of the thumbnail image, and returns an HTML snippet containing an IMG tag for the thumbnail image. Your code should write this HTML snippet out to the web page to display the thumbnail image.

For example, the returned HTML snippet for a yahoo.com thumbnail image might be:

<a href="http://yahoo.com"><img src="http://s3-external-1.amazonaws.com/al exa-thumbnails/E557348CEA2764469ED1D09849AEFE271C85BF26s?Signature=%2F2l6vKH5Rfv A7xO8tX5LTTTBKr4%3D&Expires=1153262153&AWSAccessKeyId=31VZ0JNFJDA5TK457BR2" alt= "yahoo.com"/></a>

Displaying a thumbnail image

Below are code samples for simple web pages that display a thumbnail image of 'yahoo.com'

Note: Be sure to insert your Access Key ID and Secret Access Key where appropriate. For example, change "[INSERT YOUR ACCESS KEY ID]" to something like "03S5C8M38R4THHBHJJ82".

Java - example.jsp

Here's how to display a thumbnail image using java on a web page generated using JSP. The ThumbnailUtility.jar file must be in your WEB-INF/lib directory or elsewhere on your class path. 

<%@ page import="com.alexa.service.thumbnail.ThumbnailUtility" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%!
    private static String AWSAccessKeyId = "[INSERT YOUR ACCESS KEY ID]";
    private static String AWSSecretKey   = "[INSERT YOUR SECRET ACCESS KEY]";
    private static String DEFAULT_NOIMAGE = "[http://your default no image location]";
%>
<html>
<body>
<%
	out.println(ThumbnailUtility.get_thumbnail_link(AWSAccessKeyId, AWSSecretKey, "Large", DEFAULT_NOIMAGE, "yahoo.com"));
%>
</body>
</html>

C# - example.aspx

Here's how to display a thumbnail image using C# on a web page generated using aspx. The ThumbnailUtility.cs file must be in a sub-directory called App_Code. 

<%@ Page Language="C#" %>

<%
    string access_key_id = "[INSERT YOUR ACCESS KEY ID]";
    string secret_access_key = "[INSERT YOUR SECRET ACCESS KEY]";
    string DEFAULT_NOIMAGE = "[http://your default no image location]";
    string link = ThumbnailUtility.get_thumbnail_link(access_key_id, secret_access_key, "Small", DEFAULT_NOIMAGE, "yahoo.com");
%>

<html>
<body>
    <% Response.Write(link); %>
</body>
</html>

Perl - example.cgi

Here's how to display a thumbnail image on a web page generated using perl. The ThumbnailUtility.pm file must be in the same directory as example.cgi. 

#!/usr/bin/perl -w

use ThumbnailUtility;

my $access_key_id = "[INSERT YOUR ACCESS KEY ID]";
my $secret_access_key = "[INSERT YOUR SECRET ACCESS KEY]";
my $default_noimage = "[http://your default no image location]";

my $link = ThumbnailUtility::get_thumbnail_link($access_key_id, $secret_access_key, "Small", $default_noimage, "yahoo.com");

print "Content-type:text/html\n\n";

print $link;

PHP- example.php

Here's how to display a thumbnail image on a web page generated using php. The ThumbnailUtility.php file must be in the same directory as example.php. 

<?php

require("ThumbnailUtility.php");

$access_key_id = "[INSERT YOUR ACCESS KEY ID]";
$secret_access_key = "[INSERT YOUR SECRET ACCESS KEY]";
$default_noimage = "[http://your default no image location]";

$link = get_thumbnail_link($access_key_id, $secret_access_key, "Small", $default_noimage, "yahoo.com");

echo "Content-type:text/html\n\n";

?>

<html>
<body>
<?php echo "$link";  ?>
</body>
</html>

Next Step: Displaying Multiple Thumbnails