I am using the Autumn Leaves Template.
In the image below is how I want all avatars and comments to be presented on my comic pages. If you look here you can see that everything is centered and fairly messy: http://thefayth.smackjeeves.com/comics/ ... e-changes/

Here is the code:
- Code: Select all
<script language="JavaScript">
var dir = "";
var pic_unselected = "http://www.smackjeeves.com/templates/autumn_leaves/images/rating1.png";
var pic_selected = "http://www.smackjeeves.com/templates/autumn_leaves/images/rating2.png";
// "Buffers" the image to the browser
document.write('<img style="display: none" src="' + dir + pic_unselected + '" />');
document.write('<img style="display: none" src="' + dir + pic_selected + '" />');
<!-- BEGIN switch_user_has_voted -->
var default_rating = {switch_user_has_voted.RATING};
<!-- END switch_user_has_voted -->
<!-- BEGIN switch_user_hasnt_voted -->
var default_rating = 0;
<!-- END switch_user_hasnt_voted -->
function build_vote()
{
document.write('<h2>Rate this Comic: ');
for (n = 1; n<= 5; n++)
{
if (n <= default_rating)
{
default_pic = pic_selected;
} else {
default_pic = pic_unselected;
}
document.write('<a href="#" onClick="vote(' + n + '); return false;" onMouseOver="rateover(' + n + ');" onMouseOut="rateover(default_rating);"><img src="http://www.smackjeeves.com/templates/autumn_leaves/images/rating2.png" name="star_' + n + '" border=0></a> ');
}
document.write('</ul>');
}
function rateover(star_num)
{
for (n = 1; n <= 5; n++)
{
if (n <= star_num)
{
da_code = 'document.star_' + n + '.src="' + dir + pic_selected + '"';
} else {
da_code = 'document.star_' + n + '.src="' + dir + pic_unselected + '"';
}
eval(da_code);
}
}
function vote(rating)
{
var new_window = window.open("/ratecomic.php?cid={COMIC_ID}&rating=" + rating, "sj_ratecomic", "height=300, width=400");
new_window.focus();
}
</script>
</h2>
<h1>{COMIC_TITLE}</h1>
<h2>{COMIC_POST_DATE}</h2>
<!-- BEGIN comic_image -->
{comic_image.FORMATTED}
<!-- END comic_image -->
<!-- BEGIN switch_no_comic_image -->
<img src="http://www.smackjeeves.com/images/image_na.gif" width="600" height="400">
<!-- END switch_no_comic_image -->
<div id="rating">
<h2>Average Rating: <b>{AVERAGE_RATING}</b></h2>
</div>
<div id="rate">
<script language="JavaScript">build_vote();</script>
</td></tr></table>
<div style="padding: 8px 0 3px">{SHARE_THIS_COMIC}</div>
<script type="text/javascript">
jsbookmark_pageUrl = "{COMIC_URL}";
</script>
<script type="text/javascript" src="http://www.smackjeeves.com/templates/default/jsbookmark2.js"></script>
<style>
.comicnav a img
{
vertical-align: middle;
}
</style>
<div class="comicnav">
<a href="{NAV_FIRST}"><img src="http://i61.photobucket.com/albums/h55/JGflight/first_day.jpg" alt="<< First" /></a>
<a href="{NAV_PREV}"><img src="http://i61.photobucket.com/albums/h55/JGflight/previous_day.jpg" alt="< Previous" /></a>
{JUMPBOX_FORMATTED}
<a href="{NAV_NEXT}"><img src="http://i61.photobucket.com/albums/h55/JGflight/next_day.jpg" alt="Next >" /></a>
<a href="{NAV_LAST}"><img src="http://i61.photobucket.com/albums/h55/JGflight/last_day.jpg" alt="Most Recent >>" /></a>
</div>
<!-- BEGIN switch_author_comments -->
<div style="width: 750px; background: #C7846B; margin: 20px auto; padding: 15px;">
<h1 class="sub-title" style="margin: 0"><u>Author's Comments</u></h1>
</div>
<!-- END switch_author_comments -->
<!-- BEGIN loop_author_comments -->
<span>
<!-- BEGIN switch_user_can_edit -->
<a href="{loop_author_comments.EDIT_LINK}" onClick="var new_window = window.open('{loop_author_comments.EDIT_LINK}', 'sj_comment', 'height=320, width=420'); new_window.focus(); return false;">Edit</a>
<!-- END switch_user_can_edit -->
<!-- BEGIN switch_user_can_delete -->
<a href="{loop_author_comments.DELETE_LINK}" onClick="var new_window = window.open('{loop_author_comments.DELETE_LINK}', 'sj_comment', 'height=320, width=420'); new_window.focus(); return false;">Delete</a>
<!-- END switch_user_can_delete -->
</span>
<a href="{loop_author_comments.POSTER_PROFILE_URL}" target="_profile">{loop_author_comments.NAME}</a>, {loop_author_comments.DATE_POSTED}
</h1>
<p>
<!-- BEGIN switch_poster_avatar -->
<img src="{loop_author_comments.POSTER_AVATAR_IMG_SRC}" height="{loop_author_comments.POSTER_AVATAR_IMG_HEIGHT}" width="{loop_author_comments.POSTER_AVATAR_IMG_WIDTH}" />
<!-- END switch_poster_avatar -->
<b>{loop_author_comments.POST_TITLE}</b>
<align="left"> {loop_author_comments.MESSAGE}
</p>
<!-- END loop_author_comments -->
<!-- BEGIN switch_user_comments -->
<h1 class="sub-title"><u>User's Comments</u></h1>
<!-- END switch_user_comments -->
<!-- BEGIN loop_user_comments -->
<span>
<!-- BEGIN switch_user_can_edit -->
<a href="{loop_user_comments.EDIT_LINK}" onClick="var new_window = window.open('{loop_user_comments.EDIT_LINK}', 'sj_comment', 'height=320, width=420'); new_window.focus(); return false;">Edit</a>
<!-- END switch_user_can_edit -->
<!-- BEGIN switch_user_can_delete -->
<a href="{loop_user_comments.DELETE_LINK}" onClick="var new_window = window.open('{loop_user_comments.DELETE_LINK}', 'sj_comment', 'height=320, width=420'); new_window.focus(); return false;">Delete</a>
<!-- END switch_user_can_delete -->
</span>
<a href="{loop_user_comments.POSTER_PROFILE_URL}" target="_profile">{loop_user_comments.NAME}</a>, {loop_user_comments.DATE_POSTED}</h1>
<p>
<!-- BEGIN switch_poster_avatar -->
<img src="{loop_user_comments.POSTER_AVATAR_IMG_SRC}" height="{loop_user_comments.POSTER_AVATAR_IMG_HEIGHT}" width="{loop_user_comments.POSTER_AVATAR_IMG_WIDTH}" />
<!-- END switch_poster_avatar -->
<b>{loop_user_comments.POST_TITLE}</b>
{loop_user_comments.MESSAGE}
</p>
<!-- END loop_user_comments -->
<h1 class="post-me"><a href="/postcomment.php?cid={COMIC_ID}" onClick="var new_window = window.open('/postcomment.php?cid={COMIC_ID}', 'sj_comment', 'height=350, width=420'); new_window.focus(); return false;">Post A Comment</a></h1>
If anyone can help me with this, I would be very grateful. Thanks a bunch!



