The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

> trying to move the date on tumblr posts
A_smith
post Mar 26 2011, 04:37 PM
Post #1


Newbie
*

Group: Members
Posts: 10
Joined: 19-February 11
Member No.: 13,921
I am trying to move the date on my posts from the bottom of the post to the top of the post any help would be great


http://www.loveislife-lifeislove.com/ This is the site im working on

and this is the site I am trying to make it look like
http://www.terrysdiary.com/


thanks!!!


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<!--
Theme: Field Notes (http://fieldnotestheme.tumblr.com)
Version: 4
Creator: Braden Schaeffer (http://manasto.tumblr.com)
-->

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>{Title}{block:PostSummary} | {PostSummary}{/block:PostSummary}{block:SearchPage} | {lang:Search results for SearchQuery}{/block:SearchPage}</title>
<meta name="description" content="{MetaDescription}" />
<link rel="shortcut icon" href="{Favicon}" />
<link rel="alternate" type="application/rss+xml" title="{Title}" href="{RSS}" />

<!-- 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="#683b20">
<meta name="color:Text" content="#000000">
<meta name="color:Links" content="#FFFFFF">
<meta name="font:Body" content="Helvetica, Helvetica, Helvetica, Helvetica, Helvetica"/>
<meta name="image:Background" content="http://static.tumblr.com/h3aw40n/KGtkopm5f/background.jpg" />
<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: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=""/>

<!-- Stylesheets -->
<style type="text/css">
/* <---- Overall Properties ----> */
* {
margin: 0px;
padding: 0px;
-moz-outline-style: none;
outline: none;
}
body {
background: {color:Background} url({image:Background}) top left fixed;
font-family: {font:Body};
font-size: 13px;
color: {color:Text};
}
#container {
width: 511px;
margin: 0px auto;
padding: 0px 15px;
}
h1, h2, h3, h4, h5, h6 {
font-weight: normal;
}
a {
text-decoration: none;
color: {color:Links};
}
a:hover {
text-decoration: underline;
}
/* <---- Firefox Image Border Fix ----> */
a img, img {
border: none;
}
/* <---- Header ----> */
#header {
text-transform: none;
margin: 25px 0px 60px 0px;
padding: 0px 0px 2px 0px;
}
#header a {
color: {color:Text};
}
#header h1 {
margin: 0px 0px 0px -2px;
}
#header a:hover {
text-decoration: none;
color: {color:Links};
}
/* <---- Top Bar Properties ----> */
#upper {
font-size: 1em;
padding: 0px 0px 0px 0px;
border-bottom: 2px {color:Text} none;
border-top: 1px {color:Text} dashed;
}
#upper div {
border-bottom: 1px {color:Text} dashed;

}
#upper #about_container {
border-top: 2px {color:Text} dashed;
}
/* <---- Main Nav & Extra Links Properties ----> */
.nav ol, nav ul {
list-style-position: inside;
padding: 2px 0px 0px 0px;
clear: left;
}
.nav ol {
list-style-type: none;
}
.nav ul {
list-style-type: none;
}
.nav li {
float: left;
margin: 0px 10px 2px 0px;
}
/* <---- About Properties ----> */
a#about {
cursor: pointer;
}
#about_container {
display: none;
font-size: 1em;
text-transform: none;
padding: 10px 0px;
}
#about_container a {
color: {color:Links};
}
#about_container a:hover {
text-decoration: underline;
}
p.avatar {
float: left;
margin: 0px 10px 5px 0px;
}
p.avatar img {
width: 90px;
}
/* <---- Search Properties ----> */
#search {
margin: 0 0 20px 0;
padding: 0 0 15px 0;
text-transform: none;
}
#search h2{
font-size: 2em;
text-align: center;
}
/* <---- Post Properties ----> */
.posts {
margin: 0px 0px 40px 0px;
padding: 0px 0px 40px 0px;
border-bottom: 2px {color:Links} solid;
list-style-type: none;
}
.posts:last-child {
border-bottom: none;
}
.posts h1, .posts h2, .posts ul, .posts p, .posts p, .posts ol, .player, .posts pre {
margin-bottom: 10px;
}
.posts h1 {
font-size: 2.25em;
}
.posts h2 {
font-size: 1.5em;
}
.posts ol {
list-style-type: decimal-leading-zero;
}
.posts ul {
list-style-type: disc;
}
.posts ol ul, .posts ul ul {
list-style-type: circle;
}
.posts ol ol, .posts ul ol {
list-style-type: decimal;
}
.posts ol ul, .posts ol ol, .posts ul ul, .posts ul ol {
margin: 10px 0px 10px 20px;
}
.posts ol, .posts ul {
margin: 10px 0px 10px 30px;
}
.posts li {
margin-bottom: 5px;
}
.caption {
font-size: 14px;
}
.posts img, .posts object {
max-width: 500px;
margin: 10px 0px;
}
p.object {
text-align: center;
}
.posts blockquote {
margin: 10px 0px 10px 15px;
padding-left: 15px;
border-left: 1px {color:Links} dashed;
}
.caption img {
max-width: 500px;
}

.caption blockquote img {
max-width: 150px;
}
.posts blockquote blockquote {
margin-left: 5px;
}
.posts code {
background: #333;
padding: 1px 2px;
color: {color:Links};
font-size: 12px;
}
.posts pre {
overflow: auto;
background: #333;
font-size: 12px;
padding: 5px;
color: {color:Links};
margin: 15px 0px;
}
.posts pre p {
margin-bottom: 0px;
}
/* <---- Quote Post Properties ----> */
h1.long {
font-size: 1.5em;
}
h1.short:before, h1.medium:before, h1.long:before, h1.short:after, h1.medium:after, h1.long:after {
content: "''";
}
/* <---- Link Post Properties ----> */
a.link {
padding: 0px 2px;
background: {color:Text};
}
/* <---- Audio Post Properties ----> */
.extAudio {
width: 90px;
float: right;
clear: right;
text-align: right;
text-transform: none;
font-size: 11px;
}
/* <---- Chat Post Properties ----> */
.label, .line {
padding: 2px;
float: left;
clear: left;
}
.label {
background: {color:Text};
color: {color:Links};
}
.line {
background: {color:Links};
color: {color:Text};
}
/* <---- Post Info Properties ----> */
.post_info {
margin: 25px 0px 0px 0px;
text-align: right;
font-size: 12px;
}
/* Tags */
.tags a:after {
content: ",";
}
.tags a:last-child:after {
content: "";
}
/* <---- Page/Post Nav Properties ----> */
#post_nav, #perma_nav {
width: 500px;
font-size: 14px;
text-transform: none;
}
#perma_nav {
margin: -20px 0px 20px 0px;
}
#post_nav {
margin: 0px 0px 70px 0px;
padding: 5px 0px 0px 0px;
}
.older {
float: right;
}
.newer {
float: left;
margin-right: 10px;
}
.pages {
width: 200px;
margin: 0px 150px;
text-align: center;
}
/* <---- Notes Properties ----> */
#notes ol {
list-style-type: none;
margin: 30px 0px 0px 0px;
font-size: 12px;
}
#notes ol li {
padding: 7px 0px;
border-top: 1px {color:Links} dotted;
}
#notes ol li:first-child {
border-top: 1px {color:Links} solid;
}
#notes ol li img {
display: none;
}
/* <---- Footer Properties ----> */
#footer {
margin: 0px 0px 150px 0px;
}
#footer div {
clear: both;
border-top: 1px {color:Text} dashed;
}
#footer div:first-child {
border-top: 2px {color:Text} solid;
}
/* <---- Following Properties ----> */
.following {
padding: 5px 3px;
}
li.follows {
height: 25px;
width: 25px;
list-style-type: none;
float: left;
margin: 2px;
}
.following img {
width: 25px;
}
/* <---- Credits Properties ----> */
#credits {
text-align: center;
font-size: 12px;
padding: 5px 0px 0px 0px;
clear: left;
}
/* <---- 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: none;
}
.links ul {
list-style-type: circle;
}
.links li {
text-transform: none;
float: left;
margin: 0px 10px 2px 0px;
}
/*

The style below is very important to
keeping this theme looking very clean.

I use this style all over this theme
to correct floats, of which there
are a few.

Unless you know what you are doing,
do not mess with this style. This
law is given under penalty of death.

*/
div#clearfix, li#clearfix {
clear: both;
list-style-type: none;
border: none;
}

/* Blog Title Font Size */
#header h1 { font-size: 3em; }

/* Background Color & Image */
body { background: {color:Background} url('{image:Background}'); }

/* 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>

<!-- Scripts -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://static.tumblr.com/h3aw40n/Lhpkmxpx8/functions.js"></script>
<script type="text/javascript">
$(document).ready(function() {
//Set this variable (x) to change the initial display
//of the number of people you follow before hovering.
//Each row is a multiple of 17.
var x = 34;
hideFollows(x);
{block:IfFlickrID}
var flickr_id = '{text:Flickr ID}';
flickr(flickr_id);
{/block:IfFlickrID}
});
</script>

<!-- Javascript Disabled Styles -->
<noscript><style type="text/css">
li#search { display: none; }
</style></noscript>

</head>

<body>

<div id="container"><!--BEGIN container-->

<div id="header"> <!--BEGIN header -->

<div id="top">
<div id="title"><h1>
<span style="font-size:46px">Love is Life<FONT COLOR="eb008b">.</FONT> Life is Love</font></div>
</div>

<div id="upper">

<div class="nav">

<ol>
<UL>
<div class="nav">
<ol>
<ul>
<li class="topnav"><a href="http://www.loveislife-lifeislove.com/tagged/work">WORK</a></li>
<li class="topnav"><a href="http://www.loveislife-lifeislove.com/tagged/acclaim">ACCLAIM</a></li>
<li class="topnav"><a href="http://www.loveislife-lifeislove.com/tagged/inspiration">INSPIRATION</a></li>
<li class="topnav"><a href="http://www.loveislife-lifeislove.com/tagged/love">LOVE</a></li>
<li class="topnav"><a href="http://www.loveislife-lifeislove.com/tagged/life">LIFE</a></li>
<li class="topnav"><a href="http://www.loveislife-lifeislove.com/tagged/ear_candy">EAR CANDY</a></li> </ul>
<br>
<br>
<ul>
<li class="bottomnav"><a href="http://www.loveislife-lifeislove.com/archive">archive</a></li>
<li class="bottomnav"><a href="http://www.http://loveislife-lifeislove.com/contact">contact</a></li> <li class="bottomnav"><a href="http://www.twitter.com/agentjackson">twitter</a></li>
<li class="bottomnav"><a href="http://www.Facebook.com/agentjackson">facebook</a></li>
<li class="bottomnav"><a href="http://www.loveislife-lifeislove.com/rss">subscribe</a></li>
</ul>
</ol>
<div id="clearfix"></div>
</div>
</UL>
</ol>


{block:HasPages}
<ol style="border-top: 1px dashed #000">
{block:Pages}<li><a href="{URL}">{Label}</a></li>{/block:Pages}
</ol>
{/block:HasPages}

<div id="clearfix"></div>

</div>

{block:IfDisplayCustomLinks}
<div class="links">

<ol>







{block:AskEnabled}<li><a href="/ask">{AskLabel}</a></li>{/block:AskEnabled}
{block:SubmissionsEnabled}<li><a href="/submit">{SubmitLabel}</a></li>{/block:SubmissionsEnabled}
</ol>
<div id="clearfix"></div>
</div>

{/block:IfDisplayCustomLinks}
<ul>

<P ALIGN=Right><a href="http://www.agentjackson.com/flash/index.html"><img src="http://www.bapetalk2.com/uploads/agentjackson/black.jpg" /ALIGN=RIGHT></a>
</ul>
<!--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 id="clearfix"></div>
</div>
{/block:IfFlickrID}

<!--Put your Twitter/Flickr badges and extra links above here-->

{block:Description}<div id="about_container">
<p class="avatar"><img alt="{Title}"src="{PortraitURL-96}" /></p>
<p>{Description}</p>
</div>{/block:Description}

<div id="clearfix"></div>

</div>


</div> <!--END header-->

<div id="content"><!--BEGIN content-->

{block:SearchPage}<div id="search">
{block:SearchResults}
<h2>{lang:Your search for SearchQuery returned SearchResultCount results 2}</h2>
{/block:SearchResults}

{block:NoSearchResults}
<h2>{lang:No search results for SearchQuery 2}</h2>
{/block:NoSearchResults}
</div>{/block:SearchPage}

{block:PermalinkPagination}
<div id="perma_nav">
{block:NextPost}<div class="newer"><a href="{NextPost}">{lang:Newer}</a></div>{/block:NextPost}

{block:PreviousPost}<div class="older"><a href="{PreviousPost}">{lang:Older}</a></div>{/block:PreviousPost}

<div id="clearfix"></div>
</div>
<img src="http://www.bapetalk2.com/uploads/agentjackson/black.jpg">
<p>{/block:PermalinkPagination}

</p>
<ul>

{block:Posts}<li class="posts">

{block:Text}
{block:Title}<h1><a href="{Permalink}" title ="{Title}">{Title}</a></h1>{/block:Title}
<div class="caption">{Body}</div>
{/block:Text}

{block:Photo}
<p class="object">{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</p>
{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
{/block:Photo}

{block:Photoset}
<p class="object">{Photoset-500}</p>
{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
{/block:Photoset}

{block:Quote}

<h1 class="{Length}">{Quote}</h1>
{block:Source}<div class="caption">{Source}</div>{/block:Source}

{/block:Quote}

{block:Link}
<h1><a href="{URL}" class="link" {Target}>{Name}</a></h1>
{block:Description}<div class="caption">{Description}</div>{/block:Description}
{/block:Link}

{block:Chat}
{block:Title}<h1>{Title}</h1>{/block:Title}
<div class="chatLines caption">
{block:Lines}
<div class="{Alt}">
{block:Label}<div class="label">{Label}</div>{/block:Label}
<div class="line">{Line}</div>
</div>
{/block:Lines}
<div id="clearfix"></div>
</div>
{/block:Chat}

{block:Video}
<p class="object">{Video-500}</p>
{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
{/block:Video}

{block:Audio}
<div class="extAudio">{lang:Plays}: {FormattedPlayCount}</div>
{block:ExternalAudio}<div class="extAudio"><a href="{ExternalAudioURL}" alt="download">{lang:Download}</a></div>{/block:ExternalAudio}
<div class="player">{AudioPlayerBlack}</div>

{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
{/block:Audio}

<div class="post_info">
{block:HasTags}{/block:Tags}
</p>{/block:HasTags}

<p class="info">

<a href="{Permalink}">{lang:Posted on Month DayOfMonth Year}</a>{block:RebloggedFrom} via <a href="{ReblogRootURL}" title="{ReblogRootTitle}">{ReblogRootTitle}</a>{/block:RebloggedFrom}{block:NoteCount} with <a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}{block:IfDisqusShortname}&nbsp;(<a href="{Permalink}#disqus_thread"></a>){block:IfDisqusShortname}
</p>

<p style="source_url">
{block:ContentSource}
{lang:Source}: <a href="{SourceURL}">{block:SourceLogo}<img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" style="margin:0 0 0 5px; vertical-align:text-top;" />{/block:SourceLogo}{block:NoSourceLogo}{SourceTitle}{/block:NoSourceLogo}</a>
{/block:ContentSource}
</p>
</div>

{block:IfDisqusShortname}
{block:Permalink}
<div id="disqus_thread" style="border-top: 1px solid #fff; margin: 30px 0; padding: 10px 0 0 0;"></div>
<script type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/embed.js"></script>
<noscript><a href="http://{text:Disqus Shortname}.disqus.com/?url=ref">{lang:View the discussion thread}</a></noscript>
{/block:Permalink}
{/block:IfDisqusShortname}

{block:PostNotes}<div id="notes">{PostNotes}</div>{/block:PostNotes}

</li>{/block:Posts}

</ul>


{block:Pagination}
<div id="post_nav">
{block:PreviousPage}<div class="newer"><a href="{PreviousPage}">{lang:Newer}</a></div>{/block:PreviousPage}

{block:NextPage}<div class="older"><a href="{NextPage}">{lang:Older}</a></div>{/block:NextPage}

<div class="pages">{lang:Page CurrentPage of TotalPages}</div>
<div id="clearfix"></div>
</div>
{/block:Pagination}

</div><!--END content-->

<div id="footer"><!--BEGIN footer-->

<!--Put your Twitter/Flickr badges and extra links below here-->

<!--Put your Twitter/Flickr badges and extra links above here-->
{block:IfDisplayFollowing}
{block:Following}<div class="following">
<ul>
{block:Followed}
<li class="follows"><a href="{FollowedURL}" title="{FollowedTitle}"><img alt="{FollowedName}" src="{FollowedPortraitURL-48}" /></a></li>{/block:Followed}
</ul>
<div id="clearfix"></div>
</div>{/block:Following}
{/block:IfDisplayFollowing}

{block:Description}<noscript>
<div id="about_container" style="display:block;border-top: 1px {color:Text} dashed;">
<a name="me"></a>
<p class="avatar"><img alt="{Title}"src="{PortraitURL-96}" /></p>
<p>{Description}</p>
</div>
</noscript>{/block:Description}

<div id="credits">

</div>

</div><!--END footer-->

</div><!--END container-->

</body>
{block:IfDisplayTwitterUpdates}{block:Twitter}
<script type="text/javascript">
function recent_tweets(data) {
document.getElementById("tweets").innerHTML = '<li>' + data[0].text +
' <a href="http://twitter.com/{TwitterUsername}" title="{TwitterUsername} on Twitter">follow me &rarr;</a></li>';
}
</script>
<script type="text/javascript" src="/tweets.js"></script>
{block:Twitter}{/block:IfDisplayTwitterUpdates}

{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="http://disqus.com/forums/{text:Disqus Shortname}/get_num_replies.js' + query + '"></' + 'script>');
})();
//]]>
</script>
{/block:IfDisqusShortname}
</html>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
 
 Reply to this topicStart new topic
Replies(1 - 1)
Frederiek
post Mar 27 2011, 04:44 AM
Post #2


Programming Fanatic
********

Group: Members
Posts: 5,146
Joined: 23-August 06
From: Europe
Member No.: 9
AFAICS (I don't know anything about Tumblr), you just need to put the div with class="post_info" at the start of li with class="posts" to make it appear at the top of the post.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
« Next Oldest · Web Site Functionality · Next Newest »
 

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 

Display Mode: Switch to: Standard · Linear+ · Switch to: Outline

Track this topic · Email this topic · Print this topic · Subscribe to this forum

- Lo-Fi Version Time is now: 23rd April 2024 - 12:06 PM
Invision Power Board © 2024  IPS, Inc.
Licensed to: HTMLHelp.com, LLC