POP-OUT | CLOSE
MyPDB Login - Username: Password:

About: MyPDB stores and automatically runs your favorite queries. Email alerts are sent when matching structures are found.

    MyPDB Login
MyPDB: Login | Register
A Member of the wwPDB

An Information Portal to Biological Macromolecular Structures

As of Tuesday Jul 27, 2010 at 5 PM PDT there are 66828 Structures RSS Feed for the Latest Released Structures Help | Latest Released  |  PDB Statistics Help | PDB Statistics
RCSB PDB Protein Data Bank | Home

Print Options: BW Safe Color Safe Print




URL:
 

 

RCSB PDB Widgets

A resource for web developers
 
 
The RCSB PDB provides web widgets, small bits of code, which provide PDB functionality that you can embed in your own website. All of the widgets that we provide on our site are 100% self contained JavaScript files which we maintain. When using any of these widgets, please make sure to remote link to our libraries instead of downloading and hosting them yourself. This will insure that any updates or changes we make to our site are automatically reflected in your usage.

RCSB PDB Widgets

3rd Party Widgets

RCSB PDB Comparison Tool Widget


The comparison tool allows to perform pairwise sequence and structure alignments between protein chains.

Example:

Usage:

<script type="text/javascript">
	var wb_width = '250px';
	var wb_headerColor = '#6493c2';  
	var wb_bodyColor = '#eaf2f8';
</script>
<script type="text/javascript" src="http://www.rcsb.org/pdb/widgets/workbench.js">
</script>

Options:

The RCSB PDB Workbench Widget is highly customizable to best fit within your site. There are a number of options you specify to customize the widget and use can see how they are used below. You can omit any of these options, and the widget will use default values.

wb_width
Specify the width of the widget (ex. 200px). The default width is 250px.
wb_headerColor
Specify the color of the header and borders in html hex form (ex. #ff6600). This should be a dark color. The default is #6493c2.
wb_bodyColor
Specify the color of the body in html hex form (ex. #ff6600). This should be a light color. The default is #eaf2f8.

RCSB PDB Molecule of the Month Widget


The Molecule of the Month widget embeds a Molecule of the Month image on your website and links to that feature. The widget can be customized to specify width, colors, amount of text show, and which feature to display. If you do not specify a particular issue, the widget will automatically use the current structure.

The widget comes in two versions, Full and Simple, both of which are shown below.

Examples

Full Widget:

Simple Widget:
RCSB PDB Molecule of the Month
July 2002


p53 Tumor Suppressor

Usage (Full Widget Example):


<div style="float:left; margin-right: 10px;">
	<script type="text/javascript">
	rcsb_mom_width = '250px';
	rcsb_mom_headerColor = '#ff6600';
	rcsb_mom_bodyColor = '#ffffcc';
	rcsb_mom_type = 'full';
</script>
<script type="text/javascript" src="http://www.rcsb.org/pdb/widgets/rcsbPdbMotm.js">
</script>

Options:

The RCSB PDB Molecule of the Month Widget is highly customizable to best fit within your site. There are a number of options you specify to customize the widget and use can see how they are used below. You can omit any of these options, and the widget will use default values.

rcsb_mom_width
Specify the width of the widget (ex. 200px). The default width is 250px.
rcsb_mom_headerColor
Specify the color of the header and borders in html hex form (ex. #ff6600). This should be a dark color. The default is #6493c2.
rcsb_mom_bodyColor
Specify the color of the body in html hex form (ex. #ff6600). This should be a light color. The default is #eaf2f8.
rcsb_mom_type
This property can be either 'full' or 'simple'. The example of each is listed on the left. Full display is set by default.
rcsb_mom_month
Specify a month for a specific RCSB PDB Molecule of the Month in numeric format (ex. 6). This property must be used with the rcsb_mom_year property. If both fields are omitted, the widget automatically defaults to using the latest available feature.
rcsb_mom_year
Specify year for a specific RCSB PDB Molecule of the Month (ex. 2006). This property must be used with the rcsb_mom_month property. If both fields are omitted, the widget automatically defaults to using the latest available feature.

RCSB PDB Tag Library


The RCSB PDB Tag Library is a rich markup widget that allows you to easily tag PDB ID's and keywords on your own site and automatically provide enhanced functionality that links back to us. Check out the example below by rolling over any of the underlined words. We currently provide 4 different tags: rcsb_id_tag that provides an image and link to the structure explorer page, rcsb_menu_tag that provides a menu with useful links, rcsb_author_tag that provides a link to an exact author query and rcsb_keyword_tag that provides a link to a keyword query results page. Note that the author tag searches both primary and citation authors.

Important: When including widgets in your own site, make sure you have a doctype defined. Without a doctype, certain features that the widgets provide will not display properly. Here is an example doctype we use:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Example:

Following example text has been marked up using this library.

Text from doi: 10.2210/rcsb_pdb/mom_2009_1

In a Nobel-prize-winning study, Wendell Stanley coaxed the virus to form crystals, and discovered that it was composed primarily of protein. Others quickly discovered that there was also RNA in the virus. Then, many prominent structural researchers (including J. D. Bernal, Rosalind Franklin, Ken Holmes, Aaron Klug, Don Caspar, and Gerald Stubbs) used X-ray diffraction and electron microscopy to probe the structure of the virus.
Several structures of the whole tobacco mosaic virus are available in the PDB, including the ground-breaking one solved by X-ray fiber diffraction (shown here from PDB entry 2tmv), and a recent structure solved by analysis of many electron micrographs (PDB entry 2om3). The virus is composed of one strand of RNA (shown in red) wrapped inside a sheath of protein (shown in blue). The protein coat is composed of about 2130 copies of a small protein, which stack like bricks in a cylindrical chimney. The RNA strand encodes four proteins, which together orchestrate the life cycle of the virus. These include two proteins that replicate the viral RNA, a protein that transports the RNA from cell to cell, spreading the infection, and the capsid protein seen in the PDB structures.

Usage:

<script type="text/javascript" src="http://www.rcsb.org/pdb/widgets/rcsbPdbTagLib.js">
</script>

...study, <span class="rcsb_author_tag" rel="Stanley, W.A.">Wendell Stanley</span>...
...PDB entry <span class="rcsb_menu_tag">2tmv</span>), and...
...entry <span class="rcsb_id_tag" title="Tobacco Mosaic Virus">2om3</span>...
...chimney. The <span class="rcsb_keyword_tag">RNA</span> strand...
...and the <span class="rcsb_id_tag" rel="3BWQ">capsid protein</span> seen...


Options:

Simple ID Tag (rcsb_id_tag):

The simple ID Tag is used when you wish to provide some extra information for a structure you are writing about. By default, you can just encase a PDB ID with a span tag with class rcsb_id_tag and a the library will display a rollover picture with a link to the structures explorer page. For example you can do <span class="rcsb_id_tag">4hhb</span> to get the following result 4hhb. If you wish to use anything else but an ID as a trigger, such as a title, you can pass the id to be displayed in the rel attribute. For example, <span class="rcsb_id_tag" rel="2om3">Tobacco Mosaic Virus</span> will give you the following result: Tobacco Mosaic Virus. You can also specify a title for the rollover by using the title tag.

IMPORTANT: To be compliant with all modern browsers, it is recommended to use <span> tags and specify the rel whenever possible. Using the <a> tag without specifying the rel attribute has shown to be incompatible with certain version of Internet Explorer.

Tag Attributes:
class="rcsb_id_tag"
rel="PDBID" - to override the content of the tag, you can specify the PDB ID
title="Any String" - You can add your own title
Menu Tag (rcsb_menu_tag):

The Menu tag is an alternative way to mark up a desired PDB ID. Instead of an image, the menu tag provides a drop down list of useful links. These include a link to viewing the structure in a Jmol viewer, its structure explorer page, and links to view and download the PDB file. Like the ID tag, you can encase the desired ID with the class rcsb_menu_tag or pass the desired ID via the rel attribute.

Tag Attributes:
class="rcsb_menu_tag"
rel="PDBID" - to override the content of the tag, you can specify the PDB ID
Author Tag (rcsb_author_tag):

The author tag provides a quick link to an exact author search of the RCSB PDB database. Clicking on this type of tag will take you to a query result browser page for an exact author query which queries both primary and citation authors. Like the previous tags, you can either encase an authors name in a tag, or override it using the rel tag.

NOTE: This is an exact author search and you have to use the name provided in the CIF fields in order to get a propper result. (ex. "Lawson, C.")

Tag Attributes:
class="rcsb_author_tag"
rel="AUTHOR" - to override the content of the tag you can specify the author name to search.
Keyword Tag (rcsb_keyword_tag):

The keyword tag is the simplest tag to use since there are no options to pass. Simply encase a word or phrase with this tag and it will create a link to a keyword query for the specified text.

Tag Attributes:
class="rcsb_keyword_tag"

RCSB PDB Image Library

Version 2.0

The RCSB PDB Image Library widget embeds an image of a structure based on PDB ID. The image size and type of assembly (asymmetric or biological) can be customized. This library also links to all the RCSB PDB static images for your specified ID. Using this widget means that the images don't have to be downloaded on your server, and links never have to be checked or updated - the library maintains this automatically.

Important: When including widgets in your own site, make sure you have a doctype defined. Without a doctype, certain features that the widgets provide will not display properly. Here is an example doctype we use:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Note: Version 2 is backward compatible with the old version of markup, but we do recommend you use the new format in order to be more W3 compliant.

Examples

Usage:

// Full Version
<script type="text/javascript" src="http://www.rcsb.org/pdb/widgets/rcsbPdbImageLib.js"></script>

// or Compressed Version
<script type="text/javascript" src="http://www.rcsb.org/pdb/widgets/rcsbPdbImageLib.min.js"></script> 

<span class="rcsb_image" title="4hhb|bio_1|medium|This is awesome!" ></span> <br />
<span class="rcsb_image" title="1ksr|asr|small|This is more awesome!" ></span> 
<span class="rcsb_image" title="1ott|bio|80|This is awesomest!"></span>

Options:

All options are now passed via the title tag to conform with W3 standards.

Format: title="PDB ID|Molecule Type|Size|Title"

Example: title="1ott|bio|80|This is awesomest!"

PDB ID - 4 character ID of the structure you want to use.

Molecule Type - "asr" for Asymmetric Unit, "bio" for Biological Assembly or "bio_#" where # is the number of the biological assembly e.x. "bio_2".

Size - You can pass the image size in 2 ways: by simple string or by pizel size. Simple string sizes include xsmall(65px), small(80px), medium(250px), large(500px). You can also pass in a pixel size e.x. "200". Our maximum image size is 500px.

Title - "Any String" - You can add your own title which will show in the shadowbox view.

CSS Styling

By default, the latest version of the widget automatically links the stylesheet from our server. If you would rather host the style yourself, you can disable the cross loading by modifying the usage as so:
<link rel="stylesheet" type="text/css" href="http://www.rcsb.org/pdb/widgets/rcsbPdbWidgets.css" media="screen" />
<script type="text/javascript" src="http://www.rcsb.org/pdb/widgets/rcsbPdbImageLib.js" ></script>

<script type="text/javascript" >
	rcsbPdbImageLib.isLocalCSS = true;
</script>

You can download the stylesheet here.
 

Widgets provided by 3rd Parties

 
 

PSI SGKB Widget


The PSI SGKB widget provides a dynamic display of the current content of the KB site and will automatically detect new articles, structures and features when the site updates on the third Thursday of each month.

Example:

Usage:

<!------------------ optional start ------------------>
<script type="text/javascript">
var SGKB_width='200px';// or default is 250px
var SGKB_color='grey'; // or default is RED
</script>
<!------------------ optional end   ------------------>
<!------------------ default          ---------------->
<script type="text/javascript" src="http://kb.psi-structuralgenomics.org/Widget/SGKBWidget.js"></script>

Mac-OSX Dashboard Widget


Brian Weitzner and Roland Dunbrack (Fox Chase Cancer Center) are providing an OSX Dashboard widget. It provides easy downloads of PDB files and allows quick access to the Structure Explorer web page for any given PDB ID. This Mac-OSX widget will not work on Linux or Windows computers.

Availability

In order to download and install this widget, please go to the Dunbrack's lab web site .