Hi R,
I did exactly as instructed, placed the code just before the </body> however, it didn't work. Here's my image_template.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title><SITE_TITLE></title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<link rel="stylesheet" type="text/css" href="../Downloads/templates/osiris/styles/light.css" title="light" />
<link rel="alternate" type="application/rss+xml" title="RSS Feed" href="../Downloads/index.php?x=rss" />
<link rel="alternate" type="application/atom+xml" title="Atom Feed" href="../Downloads/index.php?x=atom" />
<style type="text/css" media="screen">
#copyright {
text-align: center;
color: <HARMONIOUS_NORMAL>;
font-family: "Trebuchet MS", Tahoma, Verdana, Arial, sans-serif;
font-size: 11px;
background-color: #FFFFFF;
}
#copyright a,
#copyright a:link,
#copyright a:visited {
color: <HARMONIOUS_NORMAL>;
text-decoration: none;
font-weight: normal;
}
body{
background-color: <HARMONIOUS_DARK>;
color: <HARMONIOUS_NORMAL>;
}
#info {
text-align: center;
color: #FFFFFF;
font-family: "Trebuchet MS", Tahoma, Verdana, Arial, sans-serif;
font-size: 11px;
background-color: <HARMONIOUS_DARK>;
}
#info a,
#info a:link,
#info a:visited {
color: #FFFFFF;
text-decoration: none;
font-weight: normal;
}
.style1 {font-family: "Courier New", Courier, monospace}
.style3 {
color: #336699
}
.style4 {font-family: Verdana, Arial, Helvetica, sans-serif}
.style5 {color: #999999}
</style>
<script language='javascript' type='text/javascript'>
<!-- BEGIN
function flip(rid){
current=(document.getElementById(rid).style.displa y == 'none') ? 'block' : 'none';
document.getElementById(rid).style.display = current;
}
function gotohome(){
document.location = 'index.php';
}
function gotocomments(){
document.location = '#comments';
}
// End -->
</script>
<script type="text/javascript">
<!--
function clearBox(box) {
if(box.value==box.defaultValue) {
box.value = "";
}
}
//-->
</script>
</head>
<body>
<div id="content">
<table align="center" border="0" cellpadding="0" cellspacing="0">
<tbody><tr>
<td width="418" align="center">
<div id="transition" class="image">
<div id="picture">
<div class="wrap1">
<div class="wrap2">
<div class="wrap3">
<div style="text-align: center;">
<div align="right" class="style1">
<div align="center" class="style3">riceandnoodles</div>
</div>
</div>
<div id="copyright">
<br />
<a href="../Downloads/index.php" title="home">Fresh</a> |
<a href="../Downloads/index.php?showimage=<IMAGE_PREVIOUS_ID>" title="previous"><<</a> |
<a href="../Downloads/index.php?showimage=<IMAGE_NEXT_ID>" title="next">>></a> |
<a onclick="flip('comments'); gotocomments(); return false;">Info/Comments (
<IMAGE_COMMENTS_NUMBER>)</a> | <LINK_TO_PAGED_ARCHIVE> |
<a href="../Downloads/index.php?x=about" title="about">About</a> |
<a href="../Downloads/index.php?x=rss" title="RSS 2.0 feed">RSS</a>/<a href="../Downloads/index.php?x=atom" title="ATOM feed">Atom</a>
<img class="photobox" src="../Downloads/images/<IMAGE_NAME>" title="<IMAGE_TITLE>" alt="<IMAGE_TITLE>" border="0" width="<IMAGE_WIDTH>" height="<IMAGE_HEIGHT>" /></a>
<div id="copyright"><div id="comments" a name="comments">
<div align="center"><font size=3>
<IMAGE_TITLE>
</font><br />
<br />
</div>
<IMAGE_NOTES>
<div align="left"><br />
<br />
Posted on:
<IMAGE_DATE>
<br />
<IMAGE_CATEGORY>
<br />
<br />
<br />
</div>
<IMAGE_COMMENTS>
<div align="left"><span class="title"><font size=2>Leave me sweet notes...</font></span> </div>
<form method='post' action='../Downloads/index.php?x=save_comment' name='commentform' accept-charset='UTF-8'>
<textarea name='message' rows='2' cols='50' onfocus="clearBox(this);">Your Comment Here...</textarea>
<br />
<br />
<input type='text' name='name' class='input' value='<VINFO_NAME>' id="name"/> <label for="name"><font size=1>Name</font></label><br /><br />
<input type='text' name='url' class='input' value='<VINFO_URL>' id="url"/> <label for="url"><font size=1>Website URL, if any</font></label><br /><br />
<input class='input' type='text' name='email' value='<VINFO_EMAIL>' id="email"/> <label for="email"><font size=1>Email (not visible to others)</font></label><br /><br />
<input type='hidden' name='parent_name' value='<IMAGE_NAME>' />
<input name='vcookie' type='checkbox' id="saveinfo" value='set' checked="checked" />
<label for="saveinfo"><font size=1>Save User Info</font></label><br /><br />
<input type='submit' value='Add' class="comment-button"/>
<br />
<br />
<font size=1><COMMENT_POPUP> As Popup</font>
<br />
<input type='hidden' name='parent_id' value='<IMAGE_ID>' />
<input type='hidden' name='parent_name' value='<IMAGE_NAME>' />
</form>
</div>
</div>
<script language='javascript' type='text/javascript'>flip('comments');</script>
<div class="style4" id="info">
<br />
<span class="style5">All Images Copyright © 2006-2008 Mae Gabriel | All Rights Reserved</span> </div>
</div></td>
</tr>
</tbody></table>
<br clear="all" />
<!-- Start of StatCounter Code -->
<script type="text/javascript">
sc_project=1837610;
sc_invisible=0;
sc_partition=17;
sc_security="dee9962a";
sc_text=2;
</script>
<script type="text/javascript" src="http://www.statcounter.com/counter/counter_xhtml.js"></script><noscript><div class="statcounter"><a title="web stats" class="statcounter" href="http://www.statcounter.com/free_web_stats.html"><img class="statcounter" src="http://c18.statcounter.com/1837610/0/dee9962a/0/" alt="web stats" /></a></div></noscript>
<!-- End of StatCounter Code -->
</body>
</html>
The problem is, the main image is not showing?! It's also doing something funny with my css i.e., comment section and the about page? The counter is at the bottom of the image though before you click on the 'info/comments' section.
Thanks for your help and the compliments. :)
Mae