By way of one of the comments on an older post, I’ve had a question about how to embed Jmol in WordPress posts. It isn’t trivial, but you can do it. Here’s the recipe:
- unpack the latest jmol binary distribution inside your wp-content directory:
cd wp-content; tar -zxvf ~/jmol-11.0.RC4.tar.gz
- To make upgrading Jmol easy at a later time, make a link from that directory to jmol:
ln -s jmol-11.0.RC4 jmol
- add simple javascript function to your theme’s header:
<script type="text/javascript"> <!-- function insertJmol(me,width,height,myMolecule) { document.getElementById(me).innerHTML = '<applet width="' +width+'" height="'+height+ '" code="JmolApplet" archive="wp-content/jmol/JmolApplet.jar">' +'<param name="progressbar" value="true">' +'<param name="load" value="wp-content/' +myMolecule+'">'; } //--> </script> - Then, upload both your coordinate file and a snapshot of the molecule to your wp-content directory
- Insert code like this:
<div class="jmol" id="caffeine_applet"> <img src="wp-content/caffeine.jpg" onLoad="insertJmol('caffeine_applet',400,400,'caffeine.xyz')" alt="caffeine screenshot"/> </div>
This is a quick hack. I’ve done an end-run around the Jmol.js javascript library to get it to work with WordPress (that’s the reason for the <param name="progressbar" value="true"> part of the script above). However, it does work.
The caffeine molecule below is a live sample; you should be able to spin it.

I’m still working on this. I should have a way to do this using the full functionality of Jmol.js (and all of the applet parameters) soon.
Pingback: Weblog Tools Collection » Blog Archive » WordPress Plugin Releases for 1/18
How would you set it up so that it starts to spin on the x axis as soon as you load the .mol file?
Pingback: plonewars.com - » Embedding Jmol applet in Wordpress posts
Pingback: ChemDev » Blog Archiv » Einbetten von Jmol in WordPress-Blogs
Hi there,
I just don’t get it running.
“…add simple javascript function to your theme’s header:…”
Does this mean adding the Code snippet to the -section of my header.php?
Thx
it works … and well. I tried it here http://theobromine.uchini.be/?p=78
More explanations (in english) here http://www.milomuses.com/chemicalmusings/?page_id=343 . No need to add code in the theme’s header.
Hi All,
I have used the javascript and the code given above in my server.The molecule is loading fine and I am also getting the message “Jmol Script terminated”…But I am getting following error messages from Java Console………….
—————————————
Java Plug-in 1.6.0_07
Using JRE version 1.6.0_07 Java HotSpot(TM) Client VM
User home directory = C:\Documents and Settings\Pinak
—————————————————-
c: clear console window
f: finalize objects on finalization queue
g: garbage collect
h: display this help message
l: dump classloader list
m: print memory usage
o: trigger logging
p: reload proxy configuration
q: hide console
r: reload policy configuration
s: dump system and deployment properties
t: dump thread list
v: dump thread stack
x: clear classloader cache
0-5: set trace level to
—————————————————-
Jmol applet [null] destroyed
Jmol applet null[null] initializing
language=en_US
AppletRegistry.checkIn(null[null])
(C) 2007 Jmol Development
Jmol Version 11.4.6 2007-12-20 06:37
java.vendor:Sun Microsystems Inc.
java.version:1.6.0_07
os.name:Windows XP
memory:36.3/59.1
appletId:null
appletDocumentBase=http://192.168.50.215/resources/bioinfo/geometry1/geometry.php?num=8502&res1=ASP&res2=PHE
appletCodeBase=http://192.168.50.215/resources/bioinfo/geometry1/
Jmol applet [null] initializing
language=en_US
AppletRegistry.checkIn([null])
(C) 2007 Jmol Development
Jmol Version 11.4.6 2007-12-20 06:37
java.vendor:Sun Microsystems Inc.
java.version:1.6.0_07
os.name:Windows XP
memory:35.9/61.4
appletId:
appletDocumentBase=http://192.168.50.215/resources/bioinfo/geometry1/geometry.php?num=8502&res1=ASP&res2=PHE
appletCodeBase=http://192.168.50.215/resources/bioinfo/geometry1/
FileManager.openFile(8502\8502.pdb) //8502\8502.pdb
FileManager opening http://192.168.50.215/resources/bioinfo/geometry1/8502\8502.pdb
The Resolver thinks Pdb
openFile(8502\8502.pdb)16 ms
ModelSet: haveSymmetry:false haveUnitcells:true haveFractionalCoord:false
1 model in this collection. Use getProperty “modelInfo” or getProperty “auxiliaryInfo” to inspect them.
ModelSet: autobonding; use autobond=false to not generate bonds automatically
FileManager.openFile(8502\8502.pdb) //8502\8502.pdb
FileManager opening http://192.168.50.215/resources/bioinfo/geometry1/8502\8502.pdb
The Resolver thinks Pdb
Exception in thread “Thread-692″ java.lang.NullPointerException
at java.applet.Applet.showStatus(Unknown Source)
at org.jmol.applet.Jmol.showStatusAndConsole(Unknown Source)
at org.jmol.applet.Jmol$MyStatusListener.notifyScriptTermination(Unknown Source)
at org.jmol.viewer.StatusManager.setStatusScriptTermination(Unknown Source)
at org.jmol.viewer.Viewer.evalStringWaitStatus(Unknown Source)
at org.jmol.viewer.ScriptManager.runScript(Unknown Source)
at org.jmol.viewer.ScriptManager.runNextScript(Unknown Source)
at org.jmol.viewer.ScriptManager$ScriptQueueRunnable.run(Unknown Source)
at java.lang.Thread.run(Unknown Source)
openFile(8502\8502.pdb)15 ms
ModelSet: haveSymmetry:false haveUnitcells:true haveFractionalCoord:false
1 model in this collection. Use getProperty “modelInfo” or getProperty “auxiliaryInfo” to inspect them.
ModelSet: autobonding; use autobond=false to not generate bonds automatically
—————————————
I also want to set the parameters such as,spin on,style->scheme->trace,color->atoms->By Scheme->Chain, bla bla.. automatically at the time of loading of the molecule.
Please help……..Thanks in advance…..
If only there were a way to embed an applet in wordpress and have it show up in the rss feed. I subscribed to the feed just to see if it showed up – sadly, it didn’t.