Skip to content

Instantly share code, notes, and snippets.

@stnc
Created May 14, 2020 01:56
Show Gist options
  • Save stnc/47dfb6cc78be38c0af906d1422e01646 to your computer and use it in GitHub Desktop.
Save stnc/47dfb6cc78be38c0af906d1422e01646 to your computer and use it in GitHub Desktop.
tumblr tema kode
<html lang="en">
<head>
<meta https-equiv="Content-Type" content="text/html; charset=utf-8">
<title>{Title}{block:SearchPage} ({lang:Search results for SearchQuery}){/block:SearchPage}{block:PostSummary} ({PostSummary}){/block:PostSummary}</title>
<meta name="description" content="{block:IndexPage}{block:Description}{MetaDescription}{/block:Description}{/block:IndexPage}{block:PermalinkPage}{PostSummary}{/block:PermalinkPage}" />
<meta name="author" content="Peter Vidani">
<meta name="if:Show note count" content="1">
<meta name="if:Show notes on permalink pages" content="1">
<meta name="image:Background" content="https://static.tumblr.com/thpaaos/YbJkqnqr6/bg.jpg" />
<meta name="color:Title" content="#454545">
<meta name="color:Links" content="#238db1">
<meta name="color:LinksBackground" content="#e5f8ff">
<meta name="color:LinkPost" content="#6db123">
<meta name="color:LinkPostBackground" content="#f1fae7">
<meta name="color:PhotoAndVideoBorders" content="#e1e1da">
<meta name="color:PostTypeCircle" content="#2aabd5">
<meta name="color:PostTypeText" content="#fff">
<meta name="color:NoteCountCircle" content="#e73939">
<meta name="color:NoteCountText" content="#fff">
<meta name="color:NotesLink" content="#f95d5d">
<meta name="color:NotesLinkBackground" content="#fff2f2">
<meta name="color:CommentsCount" content="#fbff86">
<meta name="color:CommentsText" content="#2e2d2a">
<meta name="color:TagText" content="#fff">
<meta name="color:TagBackground" content="#e3e3e3">
<meta name="color:TagTextHover" content="#fff">
<meta name="color:TagBackgroundHover" content="#b69ec8">
<meta name="text:Google Analytics ID" content="" />
<meta name="text:Disqus Shortname" content="" />
<meta name="image:Header" content="0">
<link rel="shortcut icon" href="{Favicon}" />
<!-- Add the following lines to theme's html code right before </head> -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<script src="https://static.tumblr.com/fpifyru/VCxlv9xwi/writecapture.js"></script>
<script src="https://static.tumblr.com/fpifyru/AKFlv9zdu/embedgist.js"></script>
<!--
Usage: just add <div class="gist">[gist URL]</div>
Example: <div class="gist"></div>
-->
<link rel="alternate" type="application/rss+xml" href="{RSS}" />
<link rel="stylesheet" href="https://static.tumblr.com/thpaaos/DIcklyl4z/reset.css" type="text/css">
<style type="text/css">
body {
height: 100%;
color: #454545;
font-size: 14px;
line-height: 21px;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
background: url({image:Background});
-webkit-text-stroke: 1px transparent;
}
a {
color: {color:Links};
text-decoration: none;
}
*:active,*:focus { outline: 0px; }
a img { border-width: 0px; }
p {
margin: 0 0 14px 0;
}
em { font-style: italic; }
strong { font-weight: bold; }
blockquote {
border-left: 4px solid #EFEFEF;
margin: 0 0 14px 0;
padding: 0 0 0 15px;
}
#container {
width: 500px;
height: 100%;
background: url(https://static.tumblr.com/thpaaos/kT3kqnqrm/container-bg.png) repeat-y;
margin: auto;
padding: 50px 45px;
position: relative;
padding-top: 5px;
}
#container .header {
overflow: hidden;
}
#container .header h1 {
font-size: 72px;
letter-spacing: -1px;
font-family: Cufon;
float: left;
}
#container .header a h1 {
color: {color:Title};
text-decoration: none;
}
#container .header td.description {
width: 240px;
font-size: 10px;
line-height: 14px;
text-align: right;
margin: 33px 0 0 0;
float: right;
text-align:center!important;
}
#container .separate {
width: 570px;
height: 8px;
background: #EFEFEF;
margin: 50px 0 50px -35px;
}
#container ul.posts {
}
#container li.post {
min-height: 57px;
list-style-type: none;
margin: 0 0 80px 0;
position: relative;
}
#container li.post a.post_type {
width: 57px;
height: 57px;
background: {color:PostTypeCircle};
border-radius: 28px;
-moz-border-radius: 28px;
-webkit-border-radius: 28px;
filter:alpha(opacity=54);
-moz-opacity:0.54;
-khtml-opacity: 0.54;
opacity: 0.54;
display: block;
position: absolute;
left: -79px;
top: 0px;
}
#container li.post a.note_count,
#container a.heart {
width: 57px;
height: 57px;
background: {color:NoteCountCircle};
border-radius: 28px;
-moz-border-radius: 28px;
-webkit-border-radius: 28px;
filter:alpha(opacity=54);
-moz-opacity:0.54;
-khtml-opacity: 0.54;
opacity: 0.54;
display: block;
position: absolute;
left: -79px;
top: 47px;
}
#container .heart {
top: 0px !important;
}
#container a.heart_icon {
width: 17px;
height: 15px;
background: url(https://static.tumblr.com/thpaaos/k6Eks51ol/heart.png) no-repeat;
position: absolute;
top: 21px;
left: -59px;
display: block;
}
#container li.post a.comments {
width: 103px;
color: {color:CommentsText};
font-size: 12px;
font-weight: bold;
text-transform: uppercase;
line-height: 0px;
background: {color:CommentsCount};
border-top-right-radius: 6px;
border-bottom-left-radius: 6px;
-webkit-border-bottom-right-radius: 6px;
-webkit-border-top-right-radius: 6px;
-moz-border-radius-bottomright: 6px;
-moz-border-radius-topright: 6px;
filter:alpha(opacity=54);
-moz-opacity:0.54;
-khtml-opacity: 0.54;
opacity: 0.54;
padding: 12px 7px 8px 35px;
display: block;
position: absolute;
top: 0px;
right: -167px;
}
li.post .label {
width: 57px;
font-size: 12px;
font-weight: bold;
line-height: 0px;
text-align: center;
text-transform: uppercase;
text-decoration: none;
position: absolute;
display: block;
position: absolute;
left: -79px;
display: block;
}
li.post a.label {
text-decoration: none;
}
li.post a.label.type {
color: {color:PostTypeText};
top: 27px;
}
li.post a.label.noteNumber {
color: {color:NoteCountText};
top: 70px;
font-size: 18px;
}
li.post a.label.noteNumber span {
font-size: 10px;
display: block;
margin: 15px 0 0 0;
}
li.post .label.notes {
color: {color:NoteCountText};
font-size: 10px;
top: 85px;
}
#container li.post img {
max-width: 100%;
}
#container li.post .caption {
}
#container li.post .caption a {
padding: 1px;
}
#container li.post .caption a:hover,
#container .header .description a:hover,
.footer .credit a:hover,
ul#likes a:hover {
background: {color:LinksBackground};
}
#container li.post .caption ol,
#container li.post .caption ul {
margin: 0 0 14px 20px;
}
#container li.post a.title {
font-size: 24px;
line-height: 26px;
margin: 0 0 14px 0;
display: block;
}
#container li.post a.title:hover {
text-decoration: underline;
}
#container li.post a.title.link {
color: {color:LinkPost};
text-decoration: underline;
padding: 0 45px 0 0;
position: relative;
}
#container li.post a.title.link:hover span {
background: {color:LinkPostBackground};
}
#container li.post a.title.link .arrow {
width: 32px;
height: 22px;
background: url(https://static.tumblr.com/thpaaos/4aWkqnqso/sprite-link.png) 0px 0px;
position: absolute;
right: 0px;
top: 3px;
}
#container li.post a.title.link:active .arrow {
background-position: -32px 0px;
}
table.chat {
width: 100%;
margin: 0 0 3px 0;
border-collapse: collapse;
}
h2 + table.chat {
margin: 0 0 14px 0 !important;
}
table.chat tr td {
padding: 3px 10px;
}
table.chat tr td.name {
font-weight: bold;
text-align: right;
vertical-align: top;
}
table.chat tr td.line1 {
background: #F2F2F2;
}
#container li.post .media {
width: 500px;
border: 8px solid {color:PhotoAndVideoBorders};
margin: 0 0 14px -10px;
padding: 2px;
}
#container li.post .quote {
font-size: 24px;
line-height: 26px;
margin: 0 0 14px 0;
}
#container li.post .audio {
background: #fff;
margin: 0 0 14px 0;
padding: 1px;
overflow: hidden;
}
#container li.post .audio .player {
width: 207px;
height: 27px;
border: 1px solid #f2f2f2;
margin: 0 10px 0 0;
padding: 1px;
float: left;
}
#container li.post .audio span.count {
height: 22px;
color: #fff;
font-size: 10px;
font-weight: bold;
background: url(https://static.tumblr.com/thpaaos/TQFkqnqt1/play-count.png) top left;
padding: 4px 0 6px 12px;
position: relative;
}
#container li.post .audio span.count .right {
width: 10px;
height: 22px;
background: url(https://static.tumblr.com/thpaaos/TQFkqnqt1/play-count.png) top right;
position: absolute;
right: -10px;
top: 0px;
}
#container li.post a.download {
width: 25px;
height: 22px;
background: url(https://static.tumblr.com/thpaaos/GqXkqnqth/sprite-download.png) top left;
margin: 0 10px 0 0;
display: block;
float: left;
}
#container li.post a.download:active {
background-position: -25px 0;
}
#container li.post a.download.image {
position: absolute;
top: 25px;
left: 15px;
display: none;
}
#container li.post:hover a.download.image {
display: block;
}
li.post .tags {
}
li.post .tags a.tag {
color: {color:TagText};
font-size: 12px;
font-weight: bold;
text-transform: uppercase;
background: {color:TagBackground};
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
padding: 1px 5px;
}
li.post .tags .tag:hover {
color: {color:TagTextHover};
background: {color:TagBackgroundHover};
}
.footer {
overflow: hidden;
}
.pagination {
width: 148px;
height: 67px;
background: url(https://static.tumblr.com/thpaaos/xNskqnqtx/sprite-pagination.png) top left;
float: right;
overflow: hidden;
}
a.button {
width: 67px;
height: 67px;
background: url(https://static.tumblr.com/thpaaos/xNskqnqtx/sprite-pagination.png);
display: block;
}
a.button.left {
background-position: 0px -67px;
float: left;
}
a.button.left:active { background-position: -0px -134px; }
a.button.right {
background-position: -81px -67px;
float: right;
}
a.button.right:active { background-position: -81px -134px; }
.footer .credit {
height: 50px;
font-size: 11px;
line-height: 17px;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border: 3px solid #efefef;
float: left;
padding: 7px 17px;
}
{block:IndexPage}
ul#likes {
width: 500px;
list-style-type: none;
overflow: hidden;
}
li.like_post {
width: 150px;
font-size: 11px;
padding: 0 25px 0 0;
list-style-type: none;
float: left;
}
li.like_post img {
max-width: 140px;
background: #fff;
border: 4px solid {color:PhotoAndVideoBorders};
margin: 0 0 14px 0;
padding: 1px;
}
li.like_post .like_link a {
color: {color:LinkPost};
text-decoration: underline;
font-size: 14px;
}
li.like_post .like_link a:hover {
background: {color:LinkPostBackground} !important;
}
li.like_post .like_title {
font-size: 14px;
}
li.like_post blockquote {
border-left: 2px solid #EFEFEF;
margin: 0 0 14px 0;
padding: 0 0 0 7px;
}
.post_info_bottom {
background: #F2F2F2;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
padding: 0 6px;
display: block !important;
}
#post_info_bottom a:hover {
background: transparent !important;
text-decoration: underline;
}
li.like_post ul,
li.like_post ol {
margin: 0 0 0 15px;
}
a.arrow.back,
a.arrow.forward {
display: none !important;
}
{/block:IndexPage}
a.install {
width: 96px;
height: 20px;
background: url(https://static.tumblr.com/thpaaos/dHHkt0jor/install_theme.png);
display: block;
position: absolute;
top: 26px;
right: 3px;
}
{block:IfShowNotesOnPermalinkPages}
{block:PermalinkPage}
{block:PostNotes}li.post { border-bottom: 2px dashed #efefef; margin: 0 0 52px 0 !important; padding: 0 0 40px 0;}{/block:PostNotes}
ol.notes { margin: 0px; font-size: 13px; list-style-type: none; }
ol.notes a { color: {color:NotesLink}; }
ol.notes a:hover { background-color: {color:NotesLinkBackground}; }
ol.notes img.avatar { display: block; }
ol.notes blockquote { margin: 0; }
{/block:PermalinkPage}
{/block:IfShowNotesOnPermalinkPages}
#datetime{
display: block;
position: absolute;
top: 0px;
right: -150px;
}
time.icon
{
font-size: 1em; /* change icon size */
display: block;
position: relative;
width: 7em;
height: 8em;
background-color: #fff;
margin: 2em auto;
border-radius: 0.6em;
box-shadow: 0 1px 0 #bdbdbd, 0 2px 0 #fff, 0 3px 0 #bdbdbd, 0 4px 0 #fff, 0 5px 0 #bdbdbd, 0 0 0 1px #bdbdbd;
overflow: hidden;
-webkit-backface-visibility: hidden;
-webkit-transform: rotate(0deg) skewY(0deg);
-webkit-transform-origin: 50% 10%;
transform-origin: 50% 10%;
}
time.icon *
{
display: block;
width: 100%;
font-size: 1em;
font-weight: bold;
font-style: normal;
text-align: center;
}
time.icon strong
{
position: absolute;
top: 0;
padding: 0.4em 0;
color: #fff;
background-color: #fd9f1b;
border-bottom: 1px dashed #f37302;
box-shadow: 0 2px 0 #fd9f1b;
}
time.icon em
{
position: absolute;
bottom: 0.3em;
color: #fd9f1b;
}
time.icon em.em2
{
position: absolute;
bottom: 1.3em;
color: #fd9f1b;
}
time.icon span
{
width: 100%;
font-size: 2.8em;
letter-spacing: -0.05em;
padding-top:45px;
color: #2f2f2f;
}
{CustomCSS}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
{block:IndexPage}<script src="https://static.tumblr.com/thpaaos/78Jks5gyt/carousel.js" type="text/javascript"></script>{/block:IndexPage}
<script src="https://static.tumblr.com/q9z1v7k/dgEkijh8r/cufon-yui.js" type="text/javascript"></script>
<script src="https://static.tumblr.com/thpaaos/JAukqnqi4/cufon_500.font.js" type="text/javascript"></script>
<script type="text/javascript">
{block:English}Cufon.replace('.cufon');{/block:English}
</script>
</head>
<body>
<div id="container">
<div class="header">
<table width="500">
<tr valign="baseline">
{block:IfHeaderImage}<td width="250"><a href="/"><img src="{image:Header}" style="max-width: 100%"/></a></td>{/block:IfHeaderImage}
{block:IfNotHeaderImage}<td width="250"><a href="/"><h1 class="cufon">{Title}</h1></a></td>{/block:IfNotHeaderImage}
{block:Description}<td width="250" class="description">{Description}</td>{/block:Description}
</tr>
</table>
<div style="margin-top: 20px">
{block:HasPages}{block:Pages}<a href="{URL}">{Label}</a>&nbsp;&nbsp;{/block:Pages}{/block:HasPages}
{block:AskEnabled}<a href="/ask">{AskLabel}</a>&nbsp;&nbsp;{/block:AskEnabled}
{block:SubmissionsEnabled}<a href="/submit">{SubmitLabel}</a>{/block:SubmissionsEnabled}
</div>
</div>
<div class="separate"></div>
<ul class="posts">
{block:Posts}
<li class="post"{block:NoteCount} style="min-height: 104px"{/block:NoteCount}>
{block:Date}
{block:IfDisqusShortname}<a href="{Permalink}#disqus_thread" class="comments">{lang:Comments}</a>{/block:IfDisqusShortname}
{block:Date}
<div id="datetime">
<time datetime="{Year}-{DayOfMonthWithZero}-{MonthNumberWithZero}" class="icon">
<em>{DayOfWeek}</em>
<strong>{Month}</strong>
<span>{DayOfMonthWithZero}</span>
<em class="em2">{Year}</em>
</time>
</div>
{/block:Date}
<a href="{Permalink}" class="post_type"></a>
<a href="{Permalink}" class="label type">
{block:Photo}{lang:Photo}{/block:Photo}
{block:Photoset}{lang:Photos}{/block:Photoset}
{block:Video}{lang:Video}{/block:Video}
{block:Link}{lang:Link}{/block:Link}
{block:Audio}{lang:Audio}{/block:Audio}
{block:Chat}{lang:Chat}{/block:Chat}
{block:Text}{lang:Text}{/block:Text}
{block:Quote}{lang:Quote}{/block:Quote}
</a>
{/block:Date}
{block:IfShowNoteCount}{block:NoteCount}<a href="{Permalink}" class="note_count"></a>
<a href="{Permalink}" class="label noteNumber">{NoteCount}<br /></a>
<a href="{Permalink}" class="label notes" style="text-transform:lowercase;">{lang:Notes}</a>{/block:NoteCount}{/block:IfShowNoteCount}
{block:Photo}
{LinkOpenTag}<img src="{PhotoURL-500}" class="media" alt="{PhotoAlt}" />{LinkCloseTag}
{block:HighRes}<a href="{PhotoURL-HighRes}" class="download image" target="_blank"></a>{/block:HighRes}
{block:Caption}
<div class="caption">
<p>{Caption}</p>
</div>
{block:Caption}
{/block:Photo}
{block:Photoset}
{Photoset-500}
{block:Caption}
<div class="caption">
<p>{Caption}</p>
</div>
{block:Caption}
{/block:Photoset}
{block:Video}
<div class="media">{Video-500}</div>
{block:Caption}
<div class="caption">
<p>{Caption}</p>
</div>
{block:Caption}
{/block:Video}
{block:Audio}
<div class="audio">
{block:AudioEmbed}
{AudioEmbed-500}
{/block:AudioEmbed}
{block:AudioPlayer}
<div class="player">{AudioPlayerGrey}</div>
<div style="margin: 4px 0 0 0;">
<span class="count">{block:PlayCount}{PlayCountWithLabel}{/block:PlayCount}<div class="right"></div></span>
{block:ExternalAudio} <a href="{ExternalAudioURL}" class="download"></a>{/block:ExternalAudio}
</div>
{/block:AudioPlayer}
</div>
{block:Caption}
<div class="caption">
<p>{Caption}</p>
</div>
{block:Caption}
{/block:Audio}
{block:Link}
<a href="{URL}" class="title link" target="{Target}"><span>{Name}</span><div class="arrow"></div></a>
{block:Description}
<div class="caption">
<p>{Description}</p>
</div>
{block:Description}
{/block:Link}
{block:Text}
{block:Title}<a href="{Permalink}" class="title"><span>{Title}</span><div class="arrow"></div></a>{/block:Title}
<div class="caption">
<p>
{Body}
{block:More}
<a href="{Permalink}" class="big_ass_button">{lang:Read more}</a>
{/block:More}
</p>
</div>
{/block:Text}
{block:Quote}
<div class="quote">"{Quote}"</div>
{block:Source}
<div class="caption">
<p>{Source}</p>
</div>
{/block:Source}
{/block:Quote}
{block:Chat}
{block:Title}<a href="{Permalink}" class="title"><span>{Title}</span><div class="arrow"></div></a>{/block:Title}
<table class="chat" cellspacing="0">
{block:Lines}
<tr>
{block:Label}<td class="name line{UserNumber}">{Label}</td>{block:Label}<td class="words line{UserNumber}">{Line}</td>
</tr>
{/block:Lines}
</table>
{/block:Chat}
{block:HasTags}
<div class="tags">
{block:Tags}<a href="{TagURL}" class="tag">#{Tag}</a>&nbsp;{/block:Tags}
</div>
{/block:HasTags}
</li>
{block:PermalinkPage}
{block:IfShowNotesOnPermalinkPages}{PostNotes}{/block:IfShowNotesOnPermalinkPages}
{/block:PermalinkPage}
{block:Permalink}
{block:IfDisqusShortname}
<div class="notecontainer" style="margin: 40px 0 0 0; padding: 0;">
<div id="disqus_thread"></div>
<script type="text/javascript" src="https://disqus.com/forums/{text:Disqus Shortname}/embed.js"></script>
<noscript><a href="https://{text:Disqus Shortname}.disqus.com/?url=ref">{lang:View the discussion thread}</a></noscript>
</div>
<div style="text-align: right; margin-top: 5px">
{lang:Blog comments powered by Disqus 2}
</div>
{/block:IfDisqusShortname}
{/block:Permalink}
{/block:Posts}
</ul>
<div class="separate"></div>
<div class="footer">
<div class="pagination">
{block:Pagination}
{block:PreviousPage}<a href="{PreviousPage}" class="button left"></a>{/block:PreviousPage}
{block:NextPage}<a href="{NextPage}" class="button right"></a>{/block:NextPage}
{/block:Pagination}
{block:PermalinkPagination}
{block:NextPost}<a href="{NextPost}" class="button left"></a>{/block:NextPost}
{block:PreviousPost}<a href="{PreviousPost}" class="button right"></a>{/block:PreviousPost}
{/block:PermalinkPagination}
</div>
<div class="credit">
Theme: <a href="https://www.tumblr.com/theme/2807">Papercut</a><br/>
</div>
</div>
{block:IndexPage}
{block:Likes}
<div class="separate"></div>
<div class="infiniteCarousel" style="position: relative">
<div class="wrapper">
<a href="https://www.tumblr.com/liked/by/{Name}" class="heart"></a><a href="https://www.tumblr.com/liked/by/{Name}" class="heart_icon"></a>
{Likes limit="9" width="150"}
</div>
</div>
{/block:Likes}
{/block:IndexPage}
</div>
{block:IfGoogleAnalyticsID}
<script type="text/javascript">var gaJsHost=(("https:"==document.location.protocol)?"https://ssl.":"https://www.");document.write(unescape("%3Cscript src='"+gaJsHost+"google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));</script><script type="text/javascript">try{var pageTracker=_gat._getTracker("{text:Google Analytics ID}");pageTracker._trackPageview()}catch(err){}</script>
{block:IfGoogleAnalyticsID}
{block:IfDisqusShortname}
<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="https://disqus.com/forums/{text:Disqus Shortname}/get_num_replies.js' + query + '"></' + 'script>');
})();
//]]>
</script>
{/block:IfDisqusShortname}
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment