How to add Fullsize in WordPress

By: Alexandru Vornicescu | April 12, 2009 | How To | No Comments

Fullsize is very helpful when you have a lot of pictures on you blog and you want to view the fullsize of the image in the same window just in a click.

It is based on JQuery developed by Drew Wilson, from the official site of Fullsize:

Fullsize is an attempt to get a new <IMG> attribute called fullsize into the next version of HTML.

Hopefully this site will get the attention of the W3C, and they will add fullsize to HTML and make it a standard.

But until the W3C will add the code to all browsers, we can use it right now and I will show you how to add it in WordPress .

Codes:

1
2
3
4
5
6
7
8
9
10
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.js"></script>
 
<link href="<?php bloginfo('stylesheet_directory'); ?>/fullsize/fullsize.css" media="screen" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<?php bloginfo('stylesheet_directory'); ?>/fullsize/jquery.fullsize.js"></script>
 
<script type="text/javascript">
	jQuery(document).ready(function(){
    jQuery("img").fullsize([]);
});
</script>

Add these codes in the header.php of your WordPress theme.

Script files:

Download the script files and extract them in your theme folder.

Example of image tag:

1
<img src="URL_SHORT_IMAGE.jpg" alt="Me" longdesc="URL_FULLSIZE_IMAGE.jpg" />

This image tag is used in the post, longdesc represents the full image that will open.

Fullsize already is integrated in WPCrowd and you can view the demo.

Demo:

Leave a Reply