Hello everyone, I am a semi-amateur web designer/programmer, however I am confused with the designing/coding of tumblr blogs, could someone help me code it.
I want a two column design, one side for content with a header, the width of the content/ header will be 500px
There will be a sidebar, that will display links and pages, (tumblr metadata)
I cannot figure out how to make the twitter messages appear,
I have too much BS code in here too, it looks very crappy.
I need the padding to be removed on most of the layout.
I also would like instead of next/prev to have java enabled autoscroll/autoload pages like my other blog http://tinanewtonart.tumblr.com
I would like to intergrate facebook/twitter/digg ect like buttons to individual posts, not the whole page..
the google images are placeholders for my add links like with the deviantart one.
This is my sample blog, to work with design coding. http://ditto-doctor.tumblr.com/
I would like the right sidebar not to be fixed but scroll with the content.
<!--tinanewtonart@yahoo.com 2010 -->
<html>
<!--****************************** HEADER ****************************************************-->
<head>
<div class="head"><a href="http://tinaNEWTONART.TUMBLR.COM"_blank"><img src="http://www.madrasgeek.com/wp-content/uploads/2010/03/buzz-off-google.jpg
" width="500" height="240" border="0" alt="Photo of a big bunny rabbit!" /></a></div>
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
{block:Description}
<meta name="description" content="{MetaDescription}" />
{/block:Description}
<!-- iPhone Meta Data -->
<meta name="viewport" content="width=500, user-scalable=yes" />
<link rel="apple-touch-icon" href="{PortraitURL-96}" />
<!-- Custom Tumblr Theme Data -->
<meta name="color:Background" content="#759FEB">
<meta name="color:Text" content="#000000">
<meta name="color:Links" content="#FFFFFF">
<meta name="font:Body" content="Futura, Georgia, Helvetica, Arial, serif"/>
<meta name="image:Background" content="#759FEB" />
<meta name="if:Display Twitter Updates" content="1"/>
<meta name="if:Display Following" content="1"/>
<meta name="if:Display Custom Links" content="0"/>
<meta name="text:Disqus Shortname" content="" />
<meta name="text:Flickr ID" content=""/>
<meta name="text:Twitter ID" content=""/>
<meta name="text:Link Title 1" content=""/>
<meta name="text:Link URL 1" content=""/>
<meta name="text:Link Title 2" content=""/>
<meta name="text:Link URL 2" content=""/>
<meta name="text:Link Title 3" content=""/>
<meta name="text:Link URL 3" content=""/>
<meta name="text:Link Title 4" content=""/>
<meta name="text:Link URL 4" content=""/>
<meta name="text:Link Title 5" content=""/>
<meta name="text:Link URL 5" content=""/>
<meta name="text:Link Title 6" content=""/>
<meta name="text:Link URL 6" content=""/>
<meta name="text:Link Title 7" content=""/>
<meta name="text:Link URL 7" content=""/>
<meta name="text:Link Title 8" content=""/>
<meta name="text:Link URL 8" content=""/>
<meta name="text:Link Title 9" content=""/>
<meta name="text:Link URL 9" content=""/>
<!-- *************************************************** Stylesheets ************************ -->
<style type="text/css">
/* <---- Overall Properties ----> */
body {
font-family: {font:Text};
font-size: 12px;
color: {color:Text};
background-color: {color:Background};
}
a {
color: {color:Link};
font-weight: bold;
text-decoration: none;
}
a:hover {
color: {color:Link Hover};
}
h1 {
color: #FFFFFF;
text-shadow: 1px 1px 4px #000000;
text-transform: uppercase;
letter-spacing: -1px;
font-size: 20px;
margin: 0px;
}
h2 {
color: #FFFFFF;
text-shadow: 1px 1px 4px #000000;
letter-spacing: 1px;
font-size: 15px;
margin: 0px;
}
.menu{
position: absolute;
top: 0px;
left: 250px;
width:500px;
height: 15px;
padding: 0px;
background-color: #759FEB;
}
.head{
position: absolute;
top: 35px;
left: 250px;
width:500px;
height: 240px;
padding: 15px;
background-color: #759FEB;
}
.content {
position: absolute;
top: 265px;
left: 250px;
width: 500px;
padding: 15px;
background-color: #759FEB;
}
.footer {
position: float;
bottom: 20px;
left: 250px;
width: 500px;
padding: 15px;
background-color: #759FEB;
}
.sidebar {
position: fixed;
top: 35px;
left: 10px;
width: 200px;
padding: 15px;
background-color: #759FEB;
}
.rightsidebar {
position: fixed;
top: 35px;
left: 790px;
width: 200px;
padding: 0px;
}
.postheader {
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
display: block;
font-weight: bold;
font-size: 18px;
margin-bottom: 5px;
padding: 1px;
}
.date {
color: #343CEB;
padding: 2px;
}
.time {
color: #248BEB;
padding: 2px;
}
.notes {
color: #FFFFFF;
padding: 2px;
}
.permalink a {
background-color: #759FEB;
color: #000000;
float: right;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 5px;
padding-right: 5px;
}
<!--POST MARGINS-->
.post {
margin-top: 10px;
margin-bottom: 10px;
}
<!--QUOTE STYLE-->
.post.quote {
font-size: 16px;
font-weight: bold;
letter-spacing: -1px;
}
.source {
font-size: 12px;
font-weight: normal;
text-align: right;
}
<!-- “post link,” “link,” and “description.”-->
.link a {
background-color: #FFF200;
color: black;
padding: 5px;
font-size: 16px;
}
.link a:hover {
background-color: black;
color: #FFF200;
}
<!-- ALTERNATING COLORS -->
ul.chat {
list-style-type: none;
}
ul li.odd {
color: #343CEB;
}
ul li.even {
color: #5D29EB;
}
.label {
font-weight: bold;
}
<!--REBLOGGED POSTS-->
h3 {
font-size: 16px;
text-transform: uppercase;
}
blockquote {
margin: 0px;
padding-top: 0px;
padding-bottom: 0px;
padding-right: 0px;
padding-left: 20px;
color: #5D29EB;
border-left: 3px solid #00ADEF;
font-size: 11px;
}
/* <---- Flickr Badge Properties ---->*/
#flickr {
padding: 5px 0 0 0;
background: no-repeat 0 5px;
text-indent: 25px;
text-transform: none;
min-height: 15px;
}
#flickr #photos {
border: none;
}
#largeImage {
position: absolute;
border: 3px solid {color:Links};
}
#photos {
margin-left: 16px;
}
#photos img {
float: left;
padding: 0px 0px 5px 10px;
width: 38px;
height: 38px;
}
/* <---- Twitter Badge Properties ----> */
#twitter_div {
background: no-repeat 0 6px;
clear: left;
min-height: 27px;
}
#twitter_div a {
color: {color:Links};
}
#twitter_div a:hover {
text-decoration: underline;
}
#tweets {
list-style-type: none;
font-size: 13px;
padding: 5px 0px;
margin: 0 0 0 25px;
text-transform: none;
}
/* <---- Custom Links Properties ----> */
.links {
padding: 2px 0px 0px 0px;
}
.links ol, .links ul {
list-style-position: inside;
clear: left;
}
.links ol {
list-style-type: decimal-leading-zero;
}
.links ul {
list-style-type: circle;
}
.links li {
margin: 0px 5px 2px 0px;
}
}
/* <---- Main Nav & Extra Links Properties ----> */
.nav {
padding: 2px 0px 0px 0px;
}
.nav ol, nav ul {
list-style-position: inside;
clear: left;
}
.nav ol {
list-style-type: decimal-leading-zero;
}
.nav ul {
list-style-type: circle;
}
.nav li {
margin: 0px 5px 2px 0px;
}
/* Twitter Icon (16x16) */
#twitter_div { background-image: url(http://static.tumblr.com/h3aw40n/giskhqyi3/twitter.png); }
/* Flickr Icon (16x16) */
#flickr { background-image: url(http://static.tumblr.com/h3aw40n/BRMkhqyh4/flickr.png); }
.tag:before, .search_query:before { content:'“'; }
.tag:after, .search_query:after { content:'”'; }
{CustomCSS}
</style>
</head><!--***************************************TOP MENU**************************************-->
<div class="menu">
<p align="center"><a href="{RSS}">RSS</a>|<a href="/archive">Archive</a>|<a href="/mobile">Mobile</a>|<a href="/random">Random</a>
</div>
<!--******************************************* BODY ************************************-->
<body>
<!--SIDEBAR-->
<!--*******************************************SIDEBAR PLACED HERE -->
<div class="sidebar">
<center>
<img src="{PortraitURL-128}">
</center>
<br/><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>{Title}</title>
<h1>
<center>
{Title}
</center>
</h1>
<p align="center"> {block:Pagination}{PreviousPage} <a href="{PreviousPage}">PREV</a>{/block:PreviousPage}
|
{block:NextPage}<a href="{NextPage}">NEXT</a>{/block:NextPage}{/block:Pagination}
<!---navigation-->
<div class="nav"> {block:HasPages}
<ol style="border-top: 1px dashed #000">
{block:Pages}
<li><a href="{URL}">{Label}</a></li>
{/block:Pages}
</ol>
{/block:HasPages} </div>
<p align="left", style=" border-top: 1px dashed #000">
{block:IfDisplayCustomLinks}
<div class="links">
<ol>
{block:IfLinkURL1}
<li><a href="{text:Link URL 1}">{text:Link Title 1}</a></li>
{/block:IfLinkURL1}
{block:IfLinkURL2}
<li><a href="{text:Link URL 2}">{text:Link Title 2}</a></li>
{/block:IfLinkURL2}
{block:IfLinkURL3}
<li><a href="{text:Link URL 3}">{text:Link Title 3}</a></li>
{/block:IfLinkURL3}
{block:IfLinkURL4}
<li><a href="{text:Link URL 4}">{text:Link Title 4}</a></li>
{/block:IfLinkURL4}
{block:IfLinkURL5}
<li><a href="{text:Link URL 5}">{text:Link Title 5}</a></li>
{/block:IfLinkURL5}
{block:IfLinkURL6}
<li><a href="{text:Link URL 6}">{text:Link Title 6}</a></li>
{/block:IfLinkURL6}
{block:IfLinkURL7}
<li><a href="{text:Link URL 7}">{text:Link Title 7}</a></li>
{/block:IfLinkURL7}
{block:IfLinkURL8}
<li><a href="{text:Link URL 8}">{text:Link Title 8}</a></li>
{/block:IfLinkURL8}
{block:IfLinkURL9}
<li><a href="{text:Link URL 9}">{text:Link Title 9}</a></li>
{/block:IfLinkURL9}
</ol>
</div>
{/block:IfDisplayCustomLinks}
<!--Put your Twitter/Flickr badges and extra links below here-->
{block:IfDisplayTwitterUpdates}{block:Twitter}
<div id="twitter_div">
<ul id="tweets">
<noscript>
Sorry, but you can't see my twitter updates because you have disabled javascript. Try visiting my twitter profile <a href="http://twitter.com/{TwitterUsername}">here</a>.
</noscript>
</ul>
</div>
{/block:Twitter}{/block:IfDisplayTwitterUpdates}
{block:IfFlickrID}
<div id="flickr">
<noscript>
Sorry, but you can't see my Flickr photos because you have disabled javascript.
</noscript>
</div>
{/block:IfFlickrID}
<!--Put your Twitter/Flickr badges and extra links above here-->
</div>
<!--*******************************************CONTENT PLACED HERE -->
<div class="content"> <h2>{Description}</h2>
<!--header markup-->
{block:Posts}
<div class="postheader"> <span class="date">{ShortMonth} {MonthNumberWithZero} {Year}</span> <span class="time">{12HourWithZero}:{Minutes} {CapitalAmPm}</span> <span class="notes">{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}</span> <span class="permalink"><a href="{Permalink}">Permalink</a></span> </div>
<!--posting-->
{block:Text}
<div class="post text"> {block:Title}
<h3><a href="{Permalink}">{Title}</a></h3>}
{/block:Title}
{Body} </div>
{/block:Text}
{block:Photo}
<div class="post photo">
<center>
{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}
</center>
{block:Caption}
<div class="caption">{Caption}</div>
{/block:Caption} </div>
{/block:Photo}
{block:Photoset}
<div class="post photoset">
<center>
{Photoset-500}
</center>
{block:Caption}
<div class="caption">{Caption}</div>
{/block:Caption} </div>
{/block:Photoset}
{block:Quote}
<div class="post quote"> "{Quote}"
{block:Source}
<div class="source">{Source}</div>
{/block:Source} </div>
{/block:Quote}
{block:Link}
<div class="post link">
<center>
<a href="{URL}" class="link" {Target}>{Name}</a>
</center>
{block:Description}
<div class="description">{Description}</div>
{/block:Description} </div>
{/block:Link}
{block:Chat}
<div class="post chat"> {block:Title}
<h3><a href="{Permalink}">{Title}</a></h3>
{/block:Title}
<ul class="chat">
{block:Lines}
<li class="{Alt} user_{UserNumber}"> {block:Label} <span class="label">{Label}</span> {/block:Label}
{Line} </li>
{/block:Lines}
</ul>
</div>
{/block:Chat}
{block:Video}
<div class="post video">
<center>
{Video-500}
</center>
{block:Caption}
<div class="caption">{Caption}</div>
{/block:Caption} </div>
{/block:Video}
{block:Audio}
<div class="post audio"> {AudioPlayerBlack}
{block:Caption}
<div class="caption">{Caption}</div>
{/block:Caption} </div>
{/block:Audio}
{/block:Posts}
<div id="footer"><!--BEGIN footer-->
<div id="credits">
<p><a href="http://tinanewtonart.tumblr.com/">tinanewtonart Theme</a>. Designed by <a href="http://tinanewtonart.tumblr.com/">TINANEWTONART</a>. {lang:Powered by Tumblr 2}.</p>
</div>
</div><!--END footer-->
<!--****************************** right sidebar * **********************************-->
<div class="rightsidebar">
<!-- photo links 200 x 50 only-->
<table border="0" bordercolor="#759FEB" style="background-color:#759FEB" width="200" cellpadding="10" cellspacing="0">
<tr>
<td><a href="http://tinaNEWTONART.TUMBLR.COM"_blank"> <img src="http://www.cs.adelaide.edu.au/news/images/google-logo.jpg
" width="200" height="50" border="0" alt="Photo of a big bunny rabbit!" /> </a></td>
</tr>
<tr>
<td><a href="http://tinaNEWTONART.TUMBLR.COM"_blank"> <img src="http://www.cs.adelaide.edu.au/news/images/google-logo.jpg
" width="200" height="50" border="0" alt="Photo of a big bunny rabbit!" /> </a></td>
</tr>
<tr>
<td><a href="http://tinaNEWTONART.TUMBLR.COM"_blank"> <img src="http://www.cs.adelaide.edu.au/news/images/google-logo.jpg
" width="200" height="50" border="0" alt="Photo of a big bunny rabbit!" /> </a></td>
</tr>
<tr>
<td><a href="http://tinaNEWTONART.TUMBLR.COM"_blank"> <img src="http://www.cs.adelaide.edu.au/news/images/google-logo.jpg
" width="200" height="50" border="0" alt="Photo of a big bunny rabbit!" /> </a></td>
</tr>
<tr>
<td><a href="http://tinaNEWTONART.TUMBLR.COM"_blank"> <img src="http://www.cs.adelaide.edu.au/news/images/google-logo.jpg
" width="200" height="50" border="0" alt="Photo of a big bunny rabbit!" /> </a></td>
</tr>
<tr>
<td><a href="http://tinanewtonart.deviantart.com"_blank"> <img src="http://a.yfrog.com/img814/2004/evp.jpg
" width="200" height="50" border="0" alt="Photo of a big bunny rabbit!" /> </a></td>
</tr>
<tr>
<td><!--codehere--></td>
</tr>
</table>
</div>
<!--END OF RIGHTSIDEBAR-->
</div>
<!END OF cONTENT-->
</body>
</html>
This is the other blog, I would also like the media bar in the above code, but when I add it is messes with the layout, this code also contains the script for autoscroll that I talked about.
<!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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
<meta name="text:Twitter Username" content=""/>
<meta name="text:Flickr Username" content=""/>
<meta name="text:Disqus Shortname" content=""/>
<meta name="color:Asterisk" content="#17f0ff"/>
<title>{block:PostSummary}{PostSummary} - {/block:PostSummary}{Title}</title>
<link rel="shortcut icon" href="{Favicon}" />
<link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}"/>
<link href="http://static.tumblr.com/xz44nnc/qVpkyo84x/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://static.tumblr.com/xz44nnc/o5lkyivqw/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="http://static.tumblr.com/xz44nnc/k24kyivst/poop.js"></script>
<style type="text/css">
ol#nav li.home a { color: {color:Asterisk}; }
{CustomCSS}
</style>
<script type="text/javascript" src="http://o.aolcdn.com/art/merge?f=/_media/sp/sp-player.js&f=/_media/sp/sp-player-tumblr.js&expsec=86400&ver=11"></script>
</head>
<body>
<ol id="nav">
<li class="home"><a href="/" title="{Title}">*</a></li>
<li><a href="/"><b>Sketchbook</b></a></li>
{block:HasPages}{block:Pages}<li><a href="{URL}">{Label}</a></li>{/block:Pages}{/block:HasPages}
{block:AskEnabled}<li><a href="/ask">Ask Me</a></li>{/block:AskEnabled}
{block:SubmissionsEnabled}<li><a href="/submit">Ask</a></li>{/block:SubmissionsEnabled}
{block:IfFlickrUsername}<li><a href="http://flickr.com/photos/{text:Flickr Username}">Flickr</a></li>{/block:IfFlickrUsername}
{block:IfTwitterUsername}<li><a href="http://twitter.com/{text:Twitter Username}">Twitter</a></li>{/block:IfTwitterUsername}
<li><a href="/archive">Archive</a></li>
<li><a href="{RSS}">RSS</a></li>
</ol>
<div id="content">
<div id="page">
<div id="center">
<h1>Tina Newton's<br><strong>Sketchbook</strong></h1><br><h2><br> Chronological Digital Sketch Diary of <br>
<a href="mailto:tinanewtonart@yahoo.com">Christina Backlund Newton</a><br><br> Just keep scrolling down to see my older works.
<br><br>
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Ftinanewtonart.tumblr.com&layout=standard&show_faces=true&width=450&action=like&colorscheme=light&height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe>
</h2><br><br> </div></div>
<ol>
{block:Posts}
{block:Text}
<li class="regular">
{block:Title}<h3><a href="{Permalink}">{Title}</a></h3>{/block:Title}
{Body}
<p class="meta"><a href="{Permalink}">{TimeAgo}</a> / <a href="{Permalink}#notes">{NoteCountWithLabel}</a>{block:IfDisqusShortname} / <a class="dsq-comment-count" href="{Permalink}#disqus_thread">Comments</a>{/block:IfDisqusShortname}</p>
</li>
{/block:Text}
{block:Photo}
<li class="photo">
<p class="noborder">{LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/>{LinkCloseTag}</p>
{block:Caption}{Caption}{/block:Caption}
<p class="meta"><a href="{Permalink}">{TimeAgo}</a> / <a href="{Permalink}#notes">{NoteCountWithLabel}</a>{block:IfDisqusShortname} / <a class="dsq-comment-count" href="{Permalink}#disqus_thread">Comments</a>{/block:IfDisqusShortname}</p>
</li>
{/block:Photo}
{block:Photoset}
<li class="photoset">
<p class="noborder">{Photoset-500}</p>
{block:Caption}{Caption}{/block:Caption}
<p class="meta"><a href="{Permalink}">{TimeAgo}</a> / <a href="{Permalink}#notes">{NoteCountWithLabel}</a>{block:IfDisqusShortname} / <a class="dsq-comment-count" href="{Permalink}#disqus_thread">Comments</a>{/block:IfDisqusShortname}</p>
</li>
{/block:Photoset}
{block:Quote}
<li class="quote">
<blockquote>{Quote}</blockquote>
{block:Source}<cite>– {Source}</cite>{/block:Source}
<p class="meta"><a href="{Permalink}">{TimeAgo}</a> / <a href="{Permalink}#notes">{NoteCountWithLabel}</a>{block:IfDisqusShortname} / <a class="dsq-comment-count" href="{Permalink}#disqus_thread">Comments</a>{/block:IfDisqusShortname}</p>
</li>
{/block:Quote}
{block:Link}
<li class="link">
<h3><a href="{URL}" class="link" {Target}>{Name} →</a></h3>
{block:Description}{Description}{/block:Description}
<p class="meta"><a href="{Permalink}">{TimeAgo}</a> / <a href="{Permalink}#notes">{NoteCountWithLabel}</a>{block:IfDisqusShortname} / <a class="dsq-comment-count" href="{Permalink}#disqus_thread">Comments</a>{/block:IfDisqusShortname}</p>
</li>
{/block:Link}
{block:Video}
<li class="video">
{Video-500}
{block:Caption}{Caption}{/block:Caption}
<p class="meta"><a href="{Permalink}">{TimeAgo}</a> / <a href="{Permalink}#notes">{NoteCountWithLabel}</a>{block:IfDisqusShortname} / <a class="dsq-comment-count" href="{Permalink}#disqus_thread">Comments</a>{/block:IfDisqusShortname}</p>
</li>
{/block:Video}
{block:Chat}
<li class="chat">
{block:Title}<h3><a href="{Permalink}">{Title}</a></h3>{/block:Title}
{block:Lines}<p>{block:Label}<strong>{Label}</strong>{/block:Label} {Line}</p>{/block:Lines}
<p class="meta"><a href="{Permalink}">{TimeAgo}</a> / <a href="{Permalink}#notes">{NoteCountWithLabel}</a>{block:IfDisqusShortname} / <a class="dsq-comment-count" href="{Permalink}#disqus_thread">Comments</a>{/block:IfDisqusShortname}</p>
</li>
{/block:Chat}
{block:Audio}
<li class="audio">
{AudioPlayerBlack}
{block:Caption}{Caption}{/block:Caption}
<p class="meta"><a href="{Permalink}">{TimeAgo}</a> / <a href="{Permalink}#notes">{NoteCountWithLabel}</a>{block:IfDisqusShortname} / <a class="dsq-comment-count" href="{Permalink}#disqus_thread">Comments</a>{/block:IfDisqusShortname}</p>
</li>
{/block:Audio}
{block:PostNotes}
<li id="notes">
{PostNotes}
</li>
{/block:PostNotes}
{/block:Posts}
{block:IfDisqusShortname}<li><script type="text/javascript">var disqus_url = "{Permalink}"; var disqus_title ="{block:PostTitle}{PostTitle}{/block:PostTitle}";</script>{block:Permalink}<div id="disqus_thread"></div><script type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/embed.js"></script><noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript=jessakalani">comments powered by Disqus.</a></noscript><a href="http://disqus.com" class="dsq-brlink">blog comments powered by <span class="logo-disqus">Disqus</span></a>{/block:Permalink}<script type="text/javascript">
//<![CDATA[
(function() {
var links = document.getElementsByTagName('a');
var query = '?';
for(var i = 0; i < links.length; i++) {
if(links[i].href.indexOf('#disqus_thread') >= 0) {
query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&';
}
}
document.write('<script charset="utf-8" type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/get_num_replies.js' + query + '"></' + 'script>');
})();
//]]>
</script></li>
{/block:IfDisqusShortname}
</ol>
<div id="pagination">
{block:NextPage}<a class="button next" id="next_page" href="{NextPage}">← Older</a>{/block:NextPage}
{block:PreviousPage}<a class="button right" href="{PreviousPage}">Newer →</a>{/block:PreviousPage}
</div>
</div>
</body>
</html>