Skip to content

Instantly share code, notes, and snippets.

@ruslander

ruslander/gist:1674375

Created January 25, 2012 03:00
Show Gist options
  • Save ruslander/1674375 to your computer and use it in GitHub Desktop.
Save ruslander/1674375 to your computer and use it in GitHub Desktop.
Download ZIP
Bootstrap your blog with Tumblr
Raw
gistfile1.txt
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>{Title}</title>
<link rel='icon' href='{Favicon}'>
<link rel='shortcut icon' href='{Favicon}'>
<link rel='alternate' type='application/rss+xml' href='{RSS}'>
<meta name='description' content='{MetaDescription}'>
<meta name='color:Link' content='#6699cc'>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- Das styles -->
<link rel="stylesheet" media="screen" href="http://assets.needium.com/lib/bootstrap/1.4.0/bootstrap.min.css" />
<!--
El fav and touch icons
<link rel="shortcut icon" type="image/x-icon" href="assets/ico/favicon.ico">
<link rel="apple-touch-icon" href="assets/ico/bootstrap-apple-57x57.png">
<link rel="apple-touch-icon" sizes="72x72" href="assets/ico/bootstrap-apple-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="assets/ico/bootstrap-apple-114x114.png">
-->
<style type="text/css">
/* Override some defaults */
html, body {
background-color: #eee;
}
body {
padding-top: 40px; /* 40px to make the container go all the way to the bottom of the topbar */
}
.container > footer p {
text-align: center; /* center align it with the container */
}
.container {
width: 820px; /* downsize our container to make the content feel a bit tighter and more cohesive. NOTE: this removes two full columns from the grid, meaning you only go to 14 columns and not 16. */
}
/* The white background content wrapper */
.content {
background-color: #fff;
padding: 20px;
margin: 0 -20px; /* negative indent the amount of the padding to maintain the grid system */
-webkit-border-radius: 0 0 6px 6px;
-moz-border-radius: 0 0 6px 6px;
border-radius: 0 0 6px 6px;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.15);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.15);
box-shadow: 0 1px 2px rgba(0,0,0,.15);
}
/* Page header tweaks */
.page-header {
padding: 20px 20px 10px;
}
/* Styles you shouldn't keep as they are for displaying this base example only */
.content .span10,
.content .span4 {
min-height: 500px;
}
/* Give a quick and non-cross-browser friendly divider */
.content .span4 {
margin-left: 20px;
padding-left: 10px;
border-left: 1px solid #eee;
}
.topbar .btn {
border: 0;
}
.post p,li{
font-family: "Georgia";
font-size: 16px;
color:black;
}
code{
background-color:#F5F5F5;
}
</style>
<!-- Le fav and touch icons -->
<link rel="shortcut icon" href="images/favicon.ico">
<link rel="apple-touch-icon" href="images/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
</head>
<body>
<!-- Topbar
================================================== -->
<div class="topbar" data-scrollspy="scrollspy" >
<div class="topbar-inner">
<div class="container span11">
<a class="brand" href="/">{Title}</a>
<ul class="nav">
<li><a href="/">Home</a></li>
{block:PreviousPage}
<li><a href="{PreviousPage}">Previous Page</a></li>
{/block:PreviousPage}
{block:NextPage}
<li><a href="{NextPage}">Next Page</a></li>
{/block:NextPage}
<li><a class="pull-right" href="/archive">Archive</a></li>
<li><a href="/rss">{lang:RSS}</a></li>
</ul>
<form action="/search" method="get" class="pull-right">
<input type="text" name="q" value="{SearchQuery}" placeholder="Search"/>
</form>
</div>
</div>
</div>
<div class="container">
<div class="content">
<div class="row">
<div class="span9">
{block:Posts}
<div class="post">
<div>
{block:Text}
{block:Title}
<header class='page-header'>
<a href='{Permalink}'>
<h2>{Title}</h2>
</a>
</header>
{/block:Title}
{/block:Text}
{block:Chat}
{block:Title}
<header class='page-header'>
<h2>{Title}</h2>
</header>
{/block:Title}
{/block:Chat}
{block:Text}
{Body}
{/block:Text}
{block:Photo}
{LinkOpenTag}<img src='{PhotoURL-500}' alt='{PhotoAlt}'/>{LinkCloseTag}
{block:Caption}
<p>{Caption}</p>
{/block:Caption}
{/block:Photo}
{block:Photoset}
{Photoset-500}
{block:Caption}
<p>{Caption}</p>
{/block:Caption}
{/block:Photoset}
{block:Quote}
<p class='quote'>"{Quote}"</p>
{block:Source}
<p>{Source}</p>
{/block:Source}
{/block:Quote}
{block:Link}
<a href='{URL}' class='link' {Target}>{Name}</a>
{block:Description}
<p>{Description}</p>
{/block:Description}
{/block:Link}
{block:Chat}
{block:Title}
<h3>{Title}</h3>
{/block:Title}
<table cellpadding='0' cellspacing='0' width='100%' border='0' class='chat'>
{block:Lines}
<tr class='{Alt}'>
{block:Label}
<td class='label'>{Label}</td>
{/block:Label}
<td>{Line}</td>
</tr>
{/block:Lines}
</table>
{/block:Chat}
{block:Audio}
<div class='audio'>
<div class='audioLeft'>
{AudioPlayerWhite}
</div>
<div class='audioRight'>
{FormattedPlayCount} Plays
</div>
<br class='clear' />
</div>
{block:Caption}
<p>{Caption}</p>
{/block:Caption}
{/block:Audio}
{block:Video}
{Video-500}
{block:Caption}
<p>{Caption}</p>
{/block:Caption}
{/block:Video}
</div>
</div>
{block:HasTags}
<p>
{block:Tags}
<a href="{TagURL}">#{Tag}</a>
{/block:Tags}
</p>
{/block:HasTags}
<div style="font-size: 10px; text-align: left;"><a class="dsq-comment-count" href="{Permalink}#disqus_thread">Comments</a></div>
{/block:Posts}
{block:NoSearchResults}
<div class="post">
<div>
<div>
<h2>{lang:Sorry no posts found}</h2>
<p>{lang:No search results for SearchQuery 2}</p>
</div>
</div>
<div class="post-shadow"></div>
</div>
{/block:NoSearchResults}
<script type="text/javascript">var disqus_url = "{Permalink}"; var disqus_title ="{block:PostTitle}{PostTitle}{/block:PostTitle}";</script>{block:Permalink}
<div id="disqus_thread" style="padding-top:20px;">DISQUS THREAD HERE ... go and configure it</div>
</div>
<div class="span4">
{block:Description}
{Description}
{/block:Description}
{block:Twitter}
<div id="twitter" style="display:none;">
<h4><a href="http://twitter.com/{TwitterUsername}">Latest Tweets</a></h4>
<ol id="tweets"></ol>
</div>
<script type="text/javascript">
function recent_tweets(data) {
for (i=0; i<data.length; i++) {
document.getElementById("tweets").innerHTML =
document.getElementById("tweets").innerHTML +
'<li><a href="http://twitter.com/{TwitterUsername}/status/' +
(data[i].id_str ? data[i].id_str : data[i].id) +
'">' + data[i].text + '</a></li>';
}
document.getElementById("twitter").style.display = 'block';
}
</script>
{/block:Twitter}
</div>
</div>
</div>
<footer>
<p>&copy; {Title} 2011</p>
</footer>
</div> <!-- /container -->
<script src="http://assets.needium.com/lib/jquery/1.7.0/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
<!-- <script src="http://assets.needium.com/lib/bootstrap/1.4.0/js/bootstrap-alerts.js" type="text/javascript" charset="utf-8"></script>
<script src="http://assets.needium.com/lib/bootstrap/1.4.0/js/bootstrap-buttons.js" type="text/javascript" charset="utf-8"></script>
<script src="http://assets.needium.com/lib/bootstrap/1.4.0/js/bootstrap-dropdown.js" type="text/javascript" charset="utf-8"></script>
<script src="http://assets.needium.com/lib/bootstrap/1.4.0/js/bootstrap-tabs.js" type="text/javascript" charset="utf-8"></script>
<script src="http://assets.needium.com/lib/bootstrap/1.4.0/js/bootstrap-twipsy.js" type="text/javascript" charset="utf-8"></script>
<script src="http://assets.needium.com/lib/bootstrap/1.4.0/js/bootstrap-popover.js" type="text/javascript" charset="utf-8"></script>
<script src="http://assets.needium.com/lib/bootstrap/1.4.0/js/bootstrap-modal.js" type="text/javascript" charset="utf-8"></script> -->
<script src="http://assets.needium.com/lib/bootstrap/1.4.0/js/bootstrap-scrollspy.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="/tweets.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment