The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

> Adding a sidebar in Tumblr, Need help adding a fixed sidebar in Tumblr.
fortibus
post Nov 20 2010, 05:14 PM
Post #1





Group: Members
Posts: 1
Joined: 20-November 10
Member No.: 13,198
Hey everyone!

I need help adding a simple fixed sidebar on the left side in Tumblr. I can't say I have much HTML experience; I worked with it in high school for a few months so I can read some parts, but I can't locate everything or create anything from scratch.

For someone who knows how to do this, i'm sure it's very easy. I just want a sidebar on the left side.

Thank you for your time and help,

fortibus

CODE


<!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>
        <!-- DEFAULT COLORS -->
        <meta name="color:Text" content="#000"/>
        <meta name="color:Highlight Color" content="#e73839"/>
        <meta name="color:Post Labels" content="#FFFFEA"/>
        {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
        <meta name="text:Disqus Shortname" content="" />
        
        <!-- END DEFAULT COLORS -->

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>{Title}{block:PostSummary} - {PostSummary}{/block:PostSummary}</title>
        <link rel="icon" href="{Favicon}"/>
        <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}"/>
        
        <!-- iPhone -->
        <meta name="viewport" content="width=920"/>
        <link rel="apple-touch-icon" href="{PortraitURL-128}"></link>

        <style type="text/css">
            body {
                text-align: center;
                margin-right: auto;
                margin-left: auto;
                background-color: #eee;
                color: {color:Text};
            }

            #header {
                margin-top: 30px;
                margin-left: 220px;
                margin-bottom: 10px;
                padding: 0;
                width: 540px;
                background: #fff;
                border: 1px solid #ddd;
            }

            #header a, #header a:active {
                outline: 0;
                color: {color:Text};
                text-decoration: none;
            }

                #header h1 {
                    font-family: Helvetica, Georgia, "Times New Roman", Times, serif;
                    font-size: 4.5em;
                    font-weight: bold;
                    text-align: left;
                    margin: 0px 0px 0px 30px;
                    padding: 10px 10px 25px;
                    color: #151515;
                    display: block;
                    letter-spacing: -.08em;
                }

                #header ul {
                    list-style-type: none;
                    display: block;
                    margin: 0;
                    margin-bottom: 10px;
                    padding-bottom: 10px;
                    text-align: left;
                  /*
                    border-top: 1px solid #ccc;
                    border-bottom: 1px solid #ccc;
                  */
                }

                    #header ul li {
                        display: inline;
                    }

                        #header ul li a {
                            font-family: 'Lucida Grande', Helvetica Neue, sans-serif;
                            font-size: 11px;
                            color: #444;
                            background-color: #eee;
                            border: 1px solid #ddd;
                            padding-top: 4px;
                            padding-bottom: 3px;
                            padding-left: 5%;
                            padding-right: 5%;
                            text-decoration: none;
                            font-weight: normal;
                            text-transform: uppercase;
                            line-height: 20px;
                        }

                            #header ul li a:hover {
                                border-color: #ccc;
                            }

            #content {
                margin-left: 220px;
                text-align: left;
                position: relative;
                width: 500px;
                background: #fff;
                padding: 20px;
                border: 1px solid #ddd;
            }
                
            span.noborder a {
                border: none !important;
            }

            .post-header {
                font: Normal 11px 'Lucida Grande';
                color: #444;
                padding: 3px 7px 3px 7px;
                background-color: #eee;
                border-bottom: 1px solid #ddd;
                margin-bottom: 15px;
            }

            .post-header a, .post-header a:active {
                color: #222;
                outline: 0;
                text-decoration: none;
            }
            
            div.text,
            div.photo,
            div.link,
            div.video,
            div.audio,
            div.conversation,
            div.quote {
                padding: 30px
                margin-bottom: 40px;
                font-size: 1em;
                font-family: Helvetica, Georgia, "Times New Roman", Times, serif;
                position: relative;
                min-height: 160px;
                line-height: 1.4em;
            }

                div.text a,
                div.photo a,
                div.link a,
                div.video a,
                div.audio a,
                div.conversation a,
                div.quote a {
                    text-decoration: none;
                    border-bottom-width: 1px;
                    border-bottom-style: dotted;
                    border-bottom-color: {color:Highlight Color};
                    color: {color:Highlight Color};
                }
                
                    div.text a:hover,
                    div.photo a:hover,
                    div.link a:hover,
                    div.video a:hover,
                    div.audio a:hover,
                    div.conversation a:hover,
                    div.quote a:hover {
                        color: {color:Text};
                        text-decoration: none;
                        border-bottom-width: 1px;
                        border-bottom-style: solid;
                        border-bottom-color: {color:Highlight Color};
                    }
                    
            div.text img { max-width: 100%; }

            div.text h2 {
                text-align: left;
                padding: 0px;
                margin: 0px 0px 10px;
                font-size: 150%;
                font-style: normal;
                font-family: Georgia, "Times New Roman", Times, serif;
                color: {color:Text};
                font-weight: normal;
                letter-spacing: -.67px;
            }
            
                div.link h2 a {
                    text-align: left;
                    padding: 0px;
                    margin-top: 20px;
                    font-size: 110%;
                    font-style: normal;
                    font-family: Georgia, "Times New Roman", Times, serif;
                    color: {color:Text};
                    font-weight: normal;
                    letter-spacing: -.67px;
                    text-decoration: underline;
                    border: none;
                }

                div.link h2 a:hover {
                    text-decoration: underline;
                    border: none;
                }
                    
            div.photo a img {
                padding: 1px;
                border: 1px solid #FFFFFF;
                background-color: #333333;
            }
            
                div.photo a img:hover {
                    border: 1px solid #333333;
                    background-color: #FFFFFF;
                }

            div.text ol, div.text ul {
                margin: 10px;
                font-family: Georgia, "Times New Roman", Times, serif;
                font-size: 0.8em;
                text-align: justify;
            }

            div.text blockquote,
            div.photo blockquote,
            div.link blockquote,
            div.quote blockquote,
            div.audio blockquote,
            div.video blockquote {
                font-style: italic;
                text-align: justify;
            }
            
            div.quote h3 {
                font-family: "Times New Roman", Times, serif;
                font-weight: normal;
                font-style: italic;
            }
            
            div.quote h3.long {
                font-size: 135%;
            }
        
            div.quote h3.medium {
                font-size: 160%;
                line-height: 100%;
            }
        
            div.quote h3.short {
                font-size: 185%;
                line-height: 100%;
            }
        
            div.conversation h2 {
                text-align: center;
                padding: 0px;
                margin: 0px 0px 10px;
                font-size: 160%;
                font-style: normal;
                font-family: Georgia, "Times New Roman", Times, serif;
                color: {color:Text};
                font-weight: normal;
                font-variant: small-caps;
                letter-spacing: 0.1em;
                text-transform: capitalize;
            }
            
            div.conversation ul {
                font-size: 1em;
                list-style-type: none;
            }
            
            div.conversation li {
                text-align: left;
            }
            
                div.conversation li span.label {
                    font-weight: bold;
                }
                
            img.sx {
                float: left;
                margin-right: 5px;
            }
        
            div.navigation span {
                margin-right: 10px;
                margin-left: 10px;
                font-size: 1em;
            }
            
            div.navigation p span a {
                padding: 5px;
                background-color: {color:Highlight Color};
                color: #FFFFFF;
                font-weight: bold;
                text-decoration: none;
            }
            
                div.navigation p span a:hover {
                    background-color: {color:Text};
                }
                
            #footer {
                text-align: left;
                padding-top: 20px;
                border-top-width: 1px;
                border-top-style: solid;
                border-top-color: #ccc;
                font: Normal 20px/1.5em Helvetica, Arial, sans-serif;
                margin: 30px 20px;
            }
                
                #footer a {
                    color: {color:Highlight Color};
                    text-decoration: none;
                }

            ol.notes {
                padding: 0px;
                margin: 25px 0px;
                list-style-type: none;
                font-size: .75em;
                background-color: #eee;
                border: 1px solid #ddd;
                color: #444;
            }

            ol.notes li.note {
                padding: 3px 7px 3px 7px;
                border-bottom: 1px solid #ccc;
            }

            ol.notes li.note a {
                color: #222;
                text-decoration: none;
            }

            ol.notes li.note img.avatar {
                vertical-align: -4px;
                margin-right: 10px;
                width: 16px;
                height: 16px;
            }

            ol.notes li.note a img.avatar {
                border: none;
            }

            ol.notes li.note span.action {
                font-weight: normal;
            }

            ol.notes li.note .answer_content {
                font-weight: normal;
            }

            ol.notes li.note blockquote {
                border-color: #eee;
                padding: 4px 10px;
                margin: 10px 0px 0px 25px;
            }

            ol.notes li.note blockquote a {
                text-decoration: none;
            }

            
                        .search_query { font-weight: bold; }
                        
            #disqus_thread {
                border-top: 1px solid #ccc;
                border-bottom: 1px solid #ccc;
                margin: 40px 0;
                padding: 20px 0;
            }

            {CustomCSS}
        </style>
    </head>
    <body>

        <!-- Header -->
        <div id="header">
            <h1><a href="/">{Title}</a></h1>
            
            {block:HasPages}
                <ul>
                    {block:Pages}<li><a href="{URL}">{Label}</a></li>{/block:Pages}
                </ul>
            {/block:HasPages}
            
            <ul>
                {block:AskEnabled}<li><a href="/ask">{AskLabel}</a></li>{/block:AskEnabled}
                {block:SubmissionsEnabled}<li><a href="/submit">{SubmitLabel}</a></li>{/block:SubmissionsEnabled}
            </ul>

            <ul style="display: none; {block:HasPages}display: block;{/block:HasPages}{block:AskEnabled}display: block;{/block:AskEnabled}{block:SubmissionsEnabled}display: block;{/block:SubmissionsEnabled}">
                <li><a href="/">{lang:Home}</a></li>
                <li><a href="/mobile">{lang:Mobile}</a></li>
                <li><a href="{RSS}">{lang:RSS}</a></li>
                <li><a href="/archive">{lang:Archive}</a></li>
                <li><a href="/random">{lang:Random}</a></li>
            </ul>
        </div>


        <!-- Content -->
        <div id="content">
                      {block:SearchPage}
                        <div id="searchresultcount">
                            <p>{lang:Found SearchResultCount results for SearchQuery 2}</p>
                        </div>
                        {/block:SearchPage}
            <!-- Post -->
            {block:Posts}

             <div class="post-header">
               {block:Date}<span class="date"><a href="{Permalink}">{Month} {DayOfMonth}, {Year} {12Hour}:{Minutes}{AmPm}</a></span>{/block:Date}

              
               <span class="notes">
               {NoteCountWithLabel}
              
               {block:IfDisqusShortname}
               <a href="{Permalink}#disqus_thread"></a>
               {block:IfDisqusShortname}
               </span>
              
             </div>

                {block:Regular}  
                    <div class="text">
                        {block:Title}<h2>{Title}</h2>{/block:Title}
                        {Body}
                    </div>
                {/block:Regular}
                  
                    
                {block:Photo}
                    <div class="photo">
                        <span class="noborder">{LinkOpenTag}<img src="{PhotoURL-500}"
                        alt="{PhotoAlt}"/>{LinkCloseTag}</span>
                        {block:Caption}
                            <p>{Caption}</p>
                        {/block:Caption}
                    </div>
                {/block:Photo}
                    
                {block:Quote}
                    <div class="quote">
                        <h3 class="{Length}"> {Quote} </h3>
                        {block:Source}<p>{Source}</p>{/block:Source}
                    </div>
                {/block:Quote}
                    
                {block:Link}
                    <div class="link">
                        <h2><a href="{URL}" class="link" {Target}>{Name}</a></h2>

                        {block:Description}
                            <p>{Description}</p>
                        {/block:Description}
                    </div>
                {/block:Link}
                    
                {block:Conversation}
                    <div class="conversation">
                        {block:Title}<h2>{Title}</h2>{/block:Title}

                        <ul>
                            {block:Lines}
                                <li>
                                    {block:Label}<span class="label">{Label}</span>{/block:Label}
                                    {Line}
                                </li>
                            {/block:Lines}
                        </ul>
                    </div>
                {/block:Conversation}
                    
                {block:Audio}
                    <div class="audio">
                        {AudioPlayerGrey}
                        
                        {block:Caption}<p>{Caption}</p>{/block:Caption}
                    </div>
                {/block:Audio}
                    
                {block:Video}
                    <div class="video">
                        {Video-500}

                        {block:Caption}<p>{Caption}</p>{/block:Caption}
                    </div>
                {/block:Video}
            {/block:Posts}
            

        {block:PermalinkPage}
        {block:IfDisqusShortname}
        <div id="disqus_thread"></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:IfDisqusShortname}
        
        
            {PostNotes}
          
        {/block:PermalinkPage}


            {block:Pagination}
                <div class="navigation">
                    <p>
                        {block:PreviousPage}<span><a href="{PreviousPage}"> {lang:Newer}</a></span>{/block:PreviousPage}
                        {block:NextPage}<span><a href="{NextPage}">{lang:Older} </a></span>{/block:NextPage}
                    </p>
                </div>
            {/block:Pagination}

        </div>

        <!-- Footer -->
        <div id="footer">
                {Description}
        </div>
        
        {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}
    </body>
</html>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
 
 Reply to this topicStart new topic
Replies(1 - 8)
Alex_Be
post Dec 22 2010, 11:54 AM
Post #2





Group: Members
Posts: 1
Joined: 22-December 10
Member No.: 13,445
From what it looks like there is not sidebar already included.

If you want to add a sidebar that will constantly sit on the left hand side you'll want to add something in your CSS that looks something like:

.sidebar {
position: relative;
left: 0px;
top: 0px;
}

You'll style this however you want. That code should at the very least get it to sit on the left hand side.

Then, in your HTML you will want to add this div in this part of the code:

QUOTE

<div id="header">
...
</div>

<div class="sidebar">
...
</div>

<!-- Content -->
<div id="content">
...
</div>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Treva
post Jan 5 2011, 03:05 AM
Post #3





Group: Members
Posts: 2
Joined: 5-January 11
Member No.: 13,526
I'm having similar issues. I used this guide as well as the sticky sidebar guide located here to add a sidebar to my own Tumblr -- very helpful and I finally got it to work! Except for one thing: My links don't seem to function. The email link will work in the 'customize' mode, but isn't clickable in the regular view, and none of the links to other sites are clickable in either mode. I wrote it in plain ol HTML and when I view the page sources on other Tumblrs with sidebars, they look the same as what I wrote. I don't get what I'm doing wrong here.

Here is the URL of my Tumblr: http://whenitpours.tumblr.com/

The full HTML code seems to be too long to post in full here, so here is the first portion including the sidebar I added:

CODE
<!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" />
  <title>{block:SearchPage}{lang:Search results for SearchQuery} {/block:SearchPage}{block:PostSummary}{PostSummary} {/block:PostSummary}{Title}</title>
    
    {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
    
    <meta name="author" content="Matthew Buchanan" />
    <meta name="color:Accent" content="#ee3322" />
    
    <meta name="text:Disqus Shortname" content="" />
    
    <link rel="icon" href="{Favicon}" />
    <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.5.2/build/reset/reset-min.css" media="all" />
    <link rel="alternate" type="application/rss+xml" title="RSS Feed" href="{RSS}" />

    <style type="text/css" media="screen">
        /*
            Vertigo Theme by Matthew Buchanan v1.20
            Released under Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License
            http://creativecommons.org/licenses/by-nc-sa/3.0/
        */

        html { background-color: transparent; }
        html, body { height: 100%; }
        body { font: normal 62.5%/1 "Helvetica Neue", Helvetica, Arial, sans-serif; background-color: #000; color: #ddd; }
        #page { position: relative; width: 960px; min-height: 100%; margin: 0 auto; }
        #header { background: url("http://static.tumblr.com/gpln05e/ScKMC9xSQ/header-bg.png") no-repeat 50% 0; padding-top: 110px; margin-bottom: 60px; }
        #header h1 { font-size: 250%; color: #fff; text-align: center; text-transform: uppercase; }
        #header h2 { width: 500px; margin: 0 auto; background: url("http://static.tumblr.com/gpln05e/23vSi9xSQ/header-h2-bg.png") no-repeat 50% 100%; padding: 15px 0 60px 120px; font-size: 130%; text-align: center; color: #fff; }
        #header h2.pages { display: none; {block:HasPages}display: block;{/block:HasPages}{block:AskEnabled}display: block;{/block:AskEnabled}{block:SubmissionsEnabled}display: block;{/block:SubmissionsEnabled} }
        .pagetype { font-size: 130%; color: #666; text-transform: lowercase; margin: -10px 0 30px; padding: 0 0 20px 415px; }
        .pagetype span { border: 1px solid #222; padding: 0.66em 1em; }
        .pagetype strong { font-weight: normal; text-transform: uppercase; }
        .pagetype a:link, .pagetype a:visited { color: #fff; }
        .pagetype a:hover, .pagetype a:active { color: {color:Accent}; }

        /* Posts */

        .post { margin-bottom: 60px; font-size: 130%; }
        .post .container { position: relative; }

        .video { background: url("http://static.tumblr.com/gpln05e/lTMkzBxSQ/video-bg.png") repeat-y 250px 100%; margin-bottom: 40px; }
        .video .container { position: relative; background: url("http://static.tumblr.com/gpln05e/lWXujBxSQ/video-projector.png") no-repeat 250px 100%; padding: 0 285px 165px 275px; }
        .video .embed { background: url("http://static.tumblr.com/gpln05e/GqRzjBxSQ/video-top.png") no-repeat 0 0; padding: 50px 0 0 35px; margin: 0 -35px 1em -35px; }
        .video .projector { position: absolute; width: 80px; height: 100px; left: 805px; bottom: 54px; background: url("http://static.tumblr.com/gpln05e/cZPpDBxSQ/video-projector-anim.gif") no-repeat 0 0; }
        .video .meta { top: 50px; }

        .audio .container { position: relative; padding: 10px 260px 0 240px; background: url("http://static.tumblr.com/gpln05e/G1YyS5xSQ/audio-cite-bg.png") no-repeat 200px 100%; }
        .audio .embed { width: 300px; height: 220px; padding: 30px 0 0 100px; margin-bottom: 10px; background: url("http://static.tumblr.com/gpln05e/LidPi5xSQ/audio-bg.png") no-repeat 0 0; }
        .audio .cassette { position: absolute; width: 270px; height: 120px; left: 281px; top: 81px; background: url("http://static.tumblr.com/gpln05e/ttmoS5xSQ/audio-cassette-anim.gif") no-repeat 0 0; }
        .audio .content { padding-left: 20px; }
        .audio .plays { margin-bottom: 1em; color: #777; }
        .audio .plays a:link, .audio .plays a:visited { color: #777; text-decoration: none; border-bottom: 1px dotted #aaa; }
        .audio .plays a:hover, .audio .plays a:active { color: #444; border-bottom: 1px dotted #555; }
        .audio .plays + p { text-indent: 0; }
        .audio .plays + p + p { text-indent: 2.5em; }
        .audio .meta { top: 35px; }

        .quote { margin-top: -20px; }
        .quote .container { padding: 30px 260px 0 240px; background: url("http://static.tumblr.com/gpln05e/gR8GjBxSQ/quote-bg.png") no-repeat 710px 0; }
        .quote .quotetext { padding: 0; color: #fff; }
        .quote .quotetext p + p { text-indent: 2em; }
        .quote .long { font-size: 140%; line-height: 135%; }
        .quote .medium { font-size: 185%; line-height: 120%; }
        .quote .short { font-size: 230%; line-height: 120%; }
        .quote .content { width: 430px; min-height: 80px; margin-top: 10px; padding: 50px 20px 0 20px; background: url("http://static.tumblr.com/gpln05e/G4zMzBxSQ/quote-cite-bg.png") no-repeat 0 0; }
        .quote .hand { float: left; width: 150px; height: 80px; }
        .quote .meta { top: 30px; }
        .long .meta { top: 28px; }
        .short .meta { top: 34px; }

        .link .container { padding: 0 0 0 240px; }
        .link .link-wrap { position: relative; width: 590px; min-height: 90px; }
        .link .hand { position: absolute; top: 0; right: 0; width: 165px; height: 90px; background: {color:Accent} url("http://static.tumblr.com/gpln05e/BgCdi9xSQ/link-hand.png") no-repeat 100% 0; }
        .link h2 { font-size: 200%; margin-right: 165px; background: {color:Accent} url("http://static.tumblr.com/gpln05e/F8chS9xSQ/link-top.png") no-repeat 0 0; }
        .link h2 span { display: block; padding: 35px 0 20px 20px; background: transparent url("http://static.tumblr.com/gpln05e/5GBYS9xSQ/link-bot.png") no-repeat 0 100%; }
        .link h2 a:link, .link h2 a:visited { color: #fff; }
        .link h2 a:hover, .link h2 a:active { text-decoration: none; border-bottom: 1px dotted #fff; }
        .link .content { padding: 0 260px 0 20px; margin-top: 10px; }
        .link .meta { top: 35px; }

        .chat .container { padding: 0 240px 0 210px; }
        .chat h2 { font-size: 190%; color: #fff; margin-bottom: 15px; padding: 2px 0 0 30px; }
        .chat .transcript li { background: url("http://static.tumblr.com/gpln05e/ACX8i5xSQ/chat-bg.png") repeat-y 0 0; margin-bottom: 5px; padding: 5px 40px 5px 50px; color: #fff; font-size: 115%; line-height: 1.3; }
        .chat .transcript li.even { background-position: 0 100%; }
        .chat .label { font-weight: normal; text-transform: lowercase; color: #888; }

        .photo .container { padding: 20px 270px 0 240px; }
        .photo .photo-wrap { background: url("http://static.tumblr.com/gpln05e/aVsCzBxSQ/photo-bg.png") no-repeat 0 0; padding: 25px 20px 0; }
        .photo .photo-wrap img { display: block; border: 3px solid #000; margin: 0 auto; }
        .photo .photo-wrap img:hover { border: 3px solid {color:Accent}; }
        .photo .photo-wrap .frame { height: 30px; margin-left: -20px; margin-right: -20px; background: url("http://static.tumblr.com/gpln05e/aVsCzBxSQ/photo-bg.png") no-repeat 0 100%; }
        .photo .content { padding-left: 20px; margin-top: 10px; }
        .photo .meta { top: 45px; }

        .text .container { padding: 35px 270px 0 260px; background: url("http://static.tumblr.com/gpln05e/w0MdTBxSQ/text-bg.png") no-repeat 600px 0; }
          .text .container p > img { max-width: 100%; text-indent: 0 !important; }
          .text .container p + img { text-indent: 0em !important; }
        .text h2.title { font-size: 185%; text-transform: uppercase; margin: 5px 0 15px; }
        .text h2.title a:link, .text h2.title a:visited { color: #fff; }
        .text h2.title a:hover, .text h2.title a:active { color: {color:Accent}; text-decoration: none; }
        .text .meta { top: 35px; }

        /* Notes */

        .shownotes { margin-top: 10px; padding-left: 20px; color: #777; }
        .shownotes a:link, .shownotes a:visited { color: #777; text-decoration: none; border-bottom: 1px dotted #777; }
        .shownotes a:hover, .shownotes a:active { color: #444; border-bottom: 1px dotted #555; }
        .text .shownotes, .video .shownotes { padding-left: 0; }
        .chat .shownotes { padding-left: 50px; }
        
        .notes { width: 520px; margin: 15px 0 0 -25px; }
        .notes li { background: url("http://static.tumblr.com/gpln05e/ACX8i5xSQ/chat-bg.png") repeat-y 0 0; margin-bottom: 5px; padding: 5px 40px 5px 50px; color: #888; font-size: 100%; line-height: 1.3; }
        .notes .reblog { background-position: 0 100%; }
        .notes a:link, .notes a:visited { color: #fff; }
        .notes .avatar { display: none; }
        .notes blockquote { margin: 0.5em 0 0 1.5em; font-style: italic; }
        .notes blockquote a:link, .notes blockquote a:visited { color: #888;}
        .chat .notes { margin-left: 0; }

        /* Content */

        .content { line-height: 154%; color: #bbb; }
        .content h1, .content h2 { font-size: 131%; color: #fff; margin-bottom: 0.5em; }
        .content h3, .content h4 { font-size: 115%; color: #fff; margin: 0.75em 0 0.25em; }
        .content h5, .content h6 { color: #fff; text-transform: uppercase; margin: 0.75em 0 0.25em; }
        .content p + p { text-indent: 2.5em; }
        .content blockquote { font-style: italic; margin: 1em 0; padding-left: 2.5em; }
        .content ul, .content ol { margin: 0.75em 0; padding-left: 2.5em; }
        .content ul li { list-style: disc; }
        .content ol li { list-style-type: decimal; }
        .content pre { margin: 1em 0; padding: 5px 10px; background-color: #222; color: #fff; overflow: auto; width: 410px; }
        .content code { padding: 1px 2px; font: normal 108%/1.57 "Lucida Console", Consolas, monospace; background-color: #222; color: #fff; }
        .content abbr, .content acronym { border-bottom: 1px dotted #bbb; cursor: help; }

        /* Metadata */

        .meta { position: absolute; top: 0; left: 0; width: 220px; }
        .meta .permalink { position: absolute; top: 0; right: 0; width: 30px; height: 30px; background: url("http://static.tumblr.com/gpln05e/w297S9xSQ/permalink.png") no-repeat 0 0; overflow: hidden; }
        .meta .permalink a { display: block; width: 30px; height: 0; padding-top: 30px; overflow: hidden; }
        .meta .data { text-align: right; margin-right: 40px; background-color: #000; }
        .meta .data p, .meta .tags { margin: 0.7em 0; }
        .meta .data p em { color: #666; font-style: normal; padding-bottom: 0.25em; border-bottom: 1px solid #333; }
        .meta .data p.divider em { border-bottom: 1px solid #333; }
        .meta .tags li { padding-bottom: 0.5em; }

        .hidden { display: none; }

        /* Content */

        strong, b, strong em, strong i { font-weight: bold; }
        em, i, em strong, em b { font-style: italic; }

        /* Footer */

        #footer { background: url("http://static.tumblr.com/gpln05e/eQTAi9xSQ/footer-bg.png") no-repeat 50% 0; padding: 60px 0; }
        #footer #tumblr-logo, #footer #controls { position: absolute; bottom: 0; width: 100px; height: 30px; }
        #footer #tumblr-logo { left: 220px; background: url("http://static.tumblr.com/gpln05e/6FRgjBxSQ/tumblr-logo.png") no-repeat 0 0; }
        #footer #controls { width: 130px; left: 610px; background: {color:Accent} url("http://static.tumblr.com/gpln05e/u2qGy9xSQ/footer-controls.png") no-repeat 0 0; }
        #footer #controls li, #footer #controls li a { display: block; float: left; width: 30px; height: 30px; }
        #footer #controls .random, #footer #controls .random a { width: 40px; }
        #footer #tumblr-logo, #footer #controls li a { text-indent: -999em; overflow: hidden; }
        #footer #search { display: none; position: absolute; bottom: 0; left: 454px; width: 160px; height: 30px; background: url("http://static.tumblr.com/gpln05e/H523jBxSQ/search-bg.png") no-repeat 0 0; z-index: 10; }
        #footer #search label { display: none; }
        #footer #search-query { position: absolute; left: 8px; bottom: 3px; background-color: #333; border: none; font-size: 130%; width: 150px; height: 21px; color: #fff; }
        #footer .older, #footer .newer { width: 180px; height: 40px; float: left; margin-left: 285px; background: url("http://static.tumblr.com/gpln05e/5FfxC9xSQ/nav-older-bg.png") no-repeat 0 0; }
        #footer .newer { margin-left: 20px; background-image: url("http://static.tumblr.com/gpln05e/j8JnS9xSQ/nav-newer-bg.png"); }
        #footer .older a, #footer .newer a { display: block; height: 40px; text-indent: -999em; overflow: hidden; background: {color:Accent} url("http://static.tumblr.com/gpln05e/YxL1S9xSQ/nav-older.png") no-repeat 0 0; }
        #footer .newer a { background-image: url("http://static.tumblr.com/gpln05e/rKctC9xSQ/nav-newer.png"); }
        #footer .older a:hover, #footer .newer a:hover { background-position: 0 -40px; }
        #footer .credits, #footer .pages { clear: both; text-align: center; font-size: 130%; line-height: 130%; padding-top: 1em; color: #666; }
        #footer .pages { color: #333; }
        #footer .credits a:link, #footer .credits a:visited { color: #999; }
        #footer .credits a:hover, #footer .credits a:active { color: {color:Accent}; }

        /* Following */
        
        #following { overflow: hidden; width: 360px; margin: 20px auto 0; padding-top: 30px; background: url("http://static.tumblr.com/gpln05e/F9Fkfgd11/header-following.png") no-repeat 50% 0; }
        #following li { display: block; float: left; width: 24px; height: 24px; margin: 0; padding: 8px; background: #000 url("http://static.tumblr.com/gpln05e/OkOkfgc9y/avatar-bg.png") no-repeat 0 0; }
        #following li.alt2 { background-position: -40px 0; }
        #following li.alt3 { background-position: -80px 0; }
        #following li.alt4 { background-position: -120px 0; }

        /* Links */

        a:link, a:visited { color: {color:Accent}; text-decoration: none; }
        a:hover, a:active { text-decoration: underline; }
        .data a:link, .data a:visited { color: #666; }
        .data a:hover, .data a:active { color: {color:Accent}; text-decoration: none; }
        
        /* Localization */
        
        .tag, .search_query { font-weight: bold; }
        .search_query:before { content:''; }
        .search_query:after { content:''; }
        .pagetype .date { font-weight: bold; }
        
        {CustomCSS}
    </style>

    <link rel="stylesheet" href="http://static.tumblr.com/gpln05e/hvJwzJxSQ/sifr-3.css" type="text/css" media="screen" />

    <!--[if lt IE 7]>
        <style type="text/css" media="screen">
            body, #header { text-align: center; }
            #page { text-align: left; }
            .link .link-wrap { height: 90px; }
            .content p { text-indent: 2.5em; }
            .content pre { width: 430px; overflow-x: auto; overflow-y: visible; }
            .content code { font-size: 91%; }
            .meta { left: -240px; }
            .video .meta { left: -275px; }
            .text .meta { left: -260px; }
            .audio .embed { width: 400px; height: 250px; }
            .audio .cassette { left: 41px; }
            #footer .older, #footer .newer { display: inline; }
        </style>
    <![endif]-->
    <!--[if IE 7]>
        <style type="text/css" media="screen">
            .content pre { overflow-x: scroll; overflow-y: visible; }
            .content code { font-size: 91%; }
        </style>
    <![endif]-->

    <script type="text/javascript" src="http://static.tumblr.com/gpln05e/weB2DJxSQ/sifr-3.js"></script>
    <script type="text/javascript" src="http://static.tumblr.com/gpln05e/IxqIzNxSQ/sifr-vertigo-config.js"></script>    
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
    
    <script type="text/javascript">
    // <![CDATA[

        sIFR.replace(hitchcock, {
            selector: '#header h1',
            css: [
                '.sIFR-root { background-color: #000000; color: {color:Accent}; text-transform: uppercase; text-align: center; }',
                'a { text-decoration: none; }',
                'a:link { color: {color:Accent}; }',
                'a:hover { color: #ffffff; }'
                ]
        });
        sIFR.replace(hitchcock, {
            selector: 'h2.title',
            css: [
                '.sIFR-root { background-color: #000000; color: {color:Accent}; text-transform: uppercase; }',
                'a { text-decoration: none; }',
                'a:link { color: {color:Accent}; }',
                'a:hover { color: #ffffff; }'
                ]
        });

        var obj = null;
        function fadeObject() {
            if (obj) obj.find(".data").fadeOut("slow");
        }
        $(document).ready(function() {
            $(".meta").hover(function() {
                if (obj) {
                    obj.find(".data").fadeOut("slow");
                    obj = null;
                }
                $(this).find(".data").fadeIn("fast");
            }, function() {
                obj = $(this);
                setTimeout("fadeObject()",1000);
            });
            $(".video").hover(function() {
                $(this).find(".projector").removeClass("hidden");
            }, function() {
                $(this).find(".projector").addClass("hidden");
            });
            $(".video #notes").appendTo(".video")
                .css("background-color","#000")
                .find(".notes").css({"margin-left": "200px", "margin-top": "0"});
            $(".audio").hover(function() {
                $(this).find(".cassette").removeClass("hidden");
            }, function() {
                $(this).find(".cassette").addClass("hidden");
            });
            $("#footer .search").click(function(event) {
                event.preventDefault();
                $("#search").slideToggle();
                if ($("#search-query").val() == "") {
                    $("#search-query").val("Search");
                    $("#search-query").focus(function() {
                        if ($("#search-query").val() == "Search") {
                            $("#search-query").val("");
                        }
                    });
                    $("#search-query").blur(function() {
                        if ($("#search-query").val() == "") {
                            $("#search-query").val("Search");
                        }
                    });
                }
            });
            $("#following li").each(function() {
                var num = Math.ceil(Math.random()*4);
                $(this).addClass("alt"+num);
            });
            $("p,div.content,blockquote").each(function() {
                var para = $(this).html();
                para = para.replace(/:[-]?[\)D]/g, "<img src='http://static.tumblr.com/gpln05e/nEO9jBxSQ/smiley.png' />");
                $(this).html(para);
            });
        });
    // ]]>    
    </script>
</head>
<body>
    <div id="page">

        <div id="header">

            <h1><a href="/">{Title}</a></h1>
            {block:Description}<h2>{Description}</h2>{/block:Description}
            <h2 class="pages">
            {block:HasPages}
                <br/><br/>
                {block:Pages}<a href="{URL}">{Label}</a>{/block:Pages}
            {/block:HasPages}
            {block:AskEnabled}<a href="/ask">{AskLabel}</a>{/block:AskEnabled}
            {block:SubmissionsEnabled}<a href="/submit">{SubmitLabel}</a>{/block:SubmissionsEnabled}
            </h2>
        </div>

<div class="sidebar">

<img src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-snc4/hs228.ash2/49296_775518097_5504706_n.jpg"><BR><BR>

<P>My name is Treva. My husband is C. Our son Sid was born in 2009. Start the Riot. <3<BR><BR>

<P><A href="mailto:itreallyrains@gmail.com">Email Me</a><BR><BR>

<P>Fighting the Good Fight:<BR><BR>

<p><a href="http://www.drewgilbert.com/">Drew Gilbert</a><br>
<a href="http://www.happiness-project.com/">The Happiness Project</a><br>
<a href="http://www.mom-101.com/">Mom-101</a><br>
<a href="http://tales.twitter.com/2010/08/twitter-is-about-life.html">@natashabadhwar</a>
<br><a href="http://www.sweet-juniper.com/">Sweet Juniper!</a></p>
                        
</div>
        <div id="main">

            {block:TagPage}
            <div class="pagetype">
                <p><span>{lang:Posts tagged Tag 3}</span></p>
            </div>
            {/block:TagPage}
            {block:DayPage}
            <div class="pagetype">
                <p><span>{lang:Posted on DayOfWeek DayOfMonth Month Year 2}</span></p>
            </div>


Hopefully that's the right information for someone far more skilled than I am to see what's going on here. Many thanks for taking the time to read this and for helping me if you can!

This post has been edited by Treva: Jan 5 2011, 03:21 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Frederiek
post Jan 5 2011, 03:24 AM
Post #4


Programming Fanatic
********

Group: Members
Posts: 5,146
Joined: 23-August 06
From: Europe
Member No.: 9
I don't know anything about Tumblr, but it seems to me that the #sidebar is covered by #main. Try putting #sidebar AFTER #main.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Treva
post Jan 5 2011, 03:04 PM
Post #5





Group: Members
Posts: 2
Joined: 5-January 11
Member No.: 13,526
QUOTE(Frederiek @ Jan 5 2011, 12:24 AM) *

I don't know anything about Tumblr, but it seems to me that the #sidebar is covered by #main. Try putting #sidebar AFTER #main.


THANK YOU! I put the #sidebar code just before the closing div tag for the #main code and now it works as it should. Phew, that was driving me batty. Thank you thank you!
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Frederiek
post Jan 6 2011, 02:30 AM
Post #6


Programming Fanatic
********

Group: Members
Posts: 5,146
Joined: 23-August 06
From: Europe
Member No.: 9
You're welcome.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
daisy.mb
post Mar 21 2011, 08:53 PM
Post #7





Group: Members
Posts: 1
Joined: 21-March 11
Member No.: 14,174
i'm having the same problem, i can't seem to get the header to be a sidebar instead..
my tumblr url is daystocomeuk.tumblr.com

sorry i'm an idiot and couldnt see how to post it in a code box...

<!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" />

<title>{Title}{block:PostSummary} | {PostSummary}{/block:PostSummary}{block:SearchPage} | {lang:Search results for SearchQuery}{/block:SearchPage}</title>
<meta name="description" content="{MetaDescription}" />
<meta name="if:Show description" content="1" />
<meta name="if:Show search" content="1" />
<meta name="text:Twitter name" content="" />
<meta name="text:Disqus Shortname" content="" />
<meta name="text:Google Analytics ID" content="" />
<link rel="shortcut icon" href="{Favicon}" />
<link rel="alternate" type="application/rss+xml" title="{Title}" href="{RSS}" />


<!-- Styles -->

<link rel="stylesheet" href="http://static.tumblr.com/f1whv92/Mp9l6ewcg/reset.css" />
<style type="text/css">

/*----- GENERAL -----*/

header, footer, section, article, nav, aside {
display: block;
}

body {
background: #ffffff;
color: #222;
font: 12px/20px Georgia, "Times New Roman", Times, serif;
padding-top: 25px;
text-align: center;
width:500px;
margin: 0 auto;
}

h1, h2, h3, hQ {
font-family: Cufon;
}

h1 {
font-size: 50px;
line-height: 50px;
}

h2 {
font-size: 31px;
line-height: 37px;
}

h3 {
font-size: 21px;
line-height: 27px;
}

a:link, a:visited {
color: #222222;
font-weight: bold;
text-decoration: none;
}

a:hover, a:active {
text-decoration: underline;
}

hr{
border:0 #ccc solid;
border-top-width:1px;
clear:both;
height:0;
}

ol{list-style:decimal}

ul{list-style:disc}

li{margin-left:30px}

p,dl,hr,h1,h2,h3,h4,h5,h6,ol,ul,pre,table,address,fieldset{margin-bottom:15px}

#main {
padding: 0px;
}

/*----- MASTHEAD -----*/

.noMeta > div {
padding: 0px;
}

#masthead {
margin-bottom: 0px;
}

#masthead h1 {
margin-bottom: 0;
}

#masthead h1 a:link, #masthead h1 a:visited {
text-transform: Uppercase;
color: #222;
text-decoration: none;
}

#masthead h1 a:active {
outline: 0;
}

#masthead p {
font-family: Georgia, serif;
font-size: 10px;
color: #fff;
margin-bottom: 0;
}

#masthead a:link, #masthead a:visited {
color: #fff;
}

#siteDescription{
font-size: 13px;
color: #222;
text-transform: Uppercase;
border-top: 1px solid #222;
margin-top: 20px;
margin-bottom: -5px;
padding: 15px 0 0 0;
font-family: Cufon;
}

/*----- SEARCH FORM -----*/

#frmSearch {
padding-top: 20px;
display: none;
}

#txtSearch {
background: url(http://static.tumblr.com/bpryy0m/6lRl6gmys/search.jpg) left no-repeat;
width: 225px;
padding: 2px 0 0 20px;
font: 12px/12px Georgia, "Times New Roman", Times, serif;
color: #222;
border: 0px;
}

/*----- MAIN HEADER NAV STRIP -----*/

#mainNav {
border-top: 1px solid #222;
border-bottom: 2px solid #222;
margin-top: 20px;
padding: 15px;
font-family: Cufon;
}

#mainNav ul {
list-style: none;
margin: 0;
padding: 0;
}

#mainNav li {
margin: 5px;
display: inline;
padding: 0;
}

#mainNav a:link, #mainNav a:visited {
padding: 0;
font-size: 14px;
line-height: 14px;
margin: 0 2px;
text-decoration: none;
color: #222;
text-transform: Uppercase;
}

#mainNav a:hover, #mainNav a:active {
outline: none;
text-decoration: none;
border-bottom: 1px solid #222;
}

#mainNav a.active {
text-decoration: none;
border-bottom: 1px solid #222;
}

/*----- ARTICLE META INFO -----*/

#designline {
margin-top: 50px;
}

h5{
position: relative;
top: -35px;
margin-bottom: 0px;
font-family: Georgia, serif;
font-size: 10px;
color: #bca474;
text-decoration: none;
text-transform: Uppercase;
font-weight: bold;
border-bottom: 1px solid #bca474;
background: #fff;
}

h5 a:link, .line a:visited{
font-family: Georgia, serif;
font-size: 10px;
color: #bca474;
text-decoration: none;
text-transform: Uppercase;
font-weight: bold;
}

h5 a:hover{
text-decoration: underline;
}

h5 abbr{
display: inline-block;
position: relative;
margin: 0 auto;
padding: 0 8px;
background: #fff;
top: 10px;
}

h5.postDate a{
color: #bca474;
}



/*----- ARTICLE -----*/

article {
background: #fff;
margin-bottom: 20px;
text-align: left;
position: relative;
}

article img {
border: none;
margin-bottom: 15px;
max-width: 500px;
}

article p img {
margin: 0;
}
article > div {
padding: 0px;
overflow: hidden;
}
article .searchPage {
margin: 35px 0 0 0;
}

.searchPageText {
margin: 0 0 30px 0;
}

article .meta a:link, article .meta a:visited {
text-decoration: none;
}

article .meta a:hover, article .meta a:active {
text-decoration: underline;
}

article h2 {
text-align: center;
color: #222222;
}

article h2 a:link, article h2 a:visited {
text-transform: Uppercase;
color: #222;
text-decoration: none;
}

article h2 a:hover, article h2 a:active {
text-decoration: none;
border-bottom: 1px solid #222;
}

blockquote {
border-left: 2px solid #bca474;
margin-left: 0;
padding-left: 1em;
}

#quoteSource{
margin: 0 auto;
text-align: left;
}

#quoteText h2 {
text-align: left;
color: #222222;
}

article .chat {
list-style: none;
padding: 0;
margin: 0;
}

article .chat li {
margin: 0 0 2px;
padding: 2px 0 2px 0;
}

.photoCaption {
text-align: center;
}


/*----- AUDIO PLAYER -----*/

.audio {
height: 28px;
width: 26px;
overflow: hidden;
margin: auto;
padding-top: 7px;
}

.audioc {
background-image:url('http://static.tumblr.com/f1whv92/9iCl6bfgp/audiocircle.png');
background-repeat: no-repeat;
height: 41px;
width: 41px;
}

.audioCaption {
margin-top: 1px;
}

.audioleft {
width: 41px;
float: left;
}

.audioright {
width: 444px;
float: right;
}

.audioContainer {
margin-top: 5px;
}

.audioClear {
clear:both;
}

/*----- ARTICLE NOTES -----*/

.notes {
border-top: 1px solid #bca474;
list-style: none;
padding: 20px 0 5px 0;
margin: 30px 0 0 0;
}
.notes li {
margin: 0;
}

.notes .avatar {
margin: 0 5px 0 0;
position: relative;
top: 5px;
}

.notes blockquote {
margin: 10px 0 0 35px;
padding-left: 10px;
border-left: 2px solid #222222;
}

.media {
width: 500px;
margin-bottom: 20px;
}

<a href="http://twitter.com/share" class="twitter-share-button" data-count="none" data-via="OoohChristy">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

/*----- PAGE NAVIGATION -----*/

#pageNav {
margin-top: 20px;
border-top: 1px solid #222;
}

#pageNav ul {
list-style: none;
padding: 10px 15px;
margin: 10px 0;
}

#pageNav li {
margin: 0;
display: inline;
}

#pageNav a:link, #pageNav a:visited {
font: 11px Georgia, "Times New Roman", Times, serif;
padding: 0;
margin: 0 2px;
background: #34hdf5;
color: #222;
text-decoration: none;
}

#pageNav a:hover, #pageNav a:active, #pageNav a.active:link, #pageNav a.active:visited {
text-decoration: underline;
}

#pageNavOlder:after {
content: " ";
font-size: 10px;
}

#pageNavNewer:before {
content: " ";
}

/*----- FOOTER META -----*/

#sitemeta {
border-top: 2px solid #222;
color: #222;
padding: 20px 0 32px 0;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 11px;
}

#sitemeta p {
margin: 0;
}

#sitemeta a:link, #sitemeta a:visited {
color: #222;
font-weight: bold;
}

{CustomCSS}
</style>

<!-- Scripts -->

<!--[if IE]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="http://static.tumblr.com/q9z1v7k/dgEkijh8r/cufon-yui.js" type="text/javascript"></script>
<script src="http://static.tumblr.com/f1whv92/fgIl65bo1/cufon_300.font.js" type="text/javascript"></script>

<script type="text/javascript">
Cufon.replace('h1',{ fontFamily: "Cufon" });
Cufon.replace('h2',{ fontFamily: "Cufon" });
Cufon.replace('h3',{ fontFamily: "Cufon" });
Cufon.replace('#mainNav',{ fontFamily: "Cufon" });
Cufon.replace('#siteDescription',{ fontFamily: "Cufon" });
</script>

<script>
$(function() {
var search = $("#txtSearch").val();
var placeholder = "Search...";
var fadeToOpacity = 0.4;
$("#txtSearch").fadeTo("normal", fadeToOpacity);
if (search == "") {
$("#txtSearch").val(placeholder);
}
$("#txtSearch").blur(function() {
search = $("#txtSearch").val();
if (!(search != "" && search != placeholder)) {
$("#txtSearch").val(placeholder);
}
$("#txtSearch").fadeTo("normal", fadeToOpacity);
});
$("#txtSearch").focus(function() {
search = $("#txtSearch").val();
if (search == placeholder) {
$("#txtSearch").val("");
}
$("#txtSearch").fadeTo("normal", 1);
});
$("#btnSearch").click(function() {
$("#frmSearch").slideToggle("normal");
$(this).toggleClass("active");
// $("#txtSearch").focus();
});
});
</script>

</head>
<body>

<header id="masthead" class="clearfix">
<div id="thehead">
<h1 class="cufon"><a href="/">{Title}</a></h1>
<form action="/search" method="get" id="frmSearch">
<input type="text" id="txtSearch" name="q" value="{SearchQuery}" />
</form>

{block:Description}
<div id="siteDescription">{Description}</div>
{block:Description}

<nav id="mainNav">
{block:HasPages}
{block:Pages}<li><a href="{URL}">{Label}</a></li>{block:Pages}
{/block:HasPages}
{block:AskEnabled}<li><a href="/ask">Ask</a></li>{/block:AskEnabled}
{block:SubmissionsEnabled}<li><a href="/submit">Submit</a></li>{/block:SubmissionsEnabled}
<li><a href="/archive">Archive</a></li>
<li><a href="/random">Random</a></li>
<li><a href="{RSS}">RSS</a></li>
<li><a href="java script:;" id="btnSearch">Search</a></li>
{block:IfTwitterName}
<li><a href="http://twitter.com/{text:Twitter name}">Twitter</a></li>
{/block:IfTwitterName}
</nav>
</div>
</header>

<section id="main" class="clearfix">
<div class="layout">
{block:SearchPage}
<article>
<div>
<div class="searchPage">
<h2>Search results for <a href="{URLSafeSearchQuery}">{SearchQuery}</a></h2>
</div>
{block:NoSearchResults}
<div class="searchPageText">
<p>I’m sorry, but we couldn't find anything matching "<b>{SearchQuery}</b>". Suggestions:</p>
<ul>
<li>Make sure all words are spelled correctly.</li>
<li>Try different keywords.</li>
<li>Try more general keywords.</li>
</ul>
</div>
{/block:NoSearchResults}
</div>
</article>
{/block:SearchPage}

{block:TagPage}
<article>
<div>
<div class="searchPage">
<h2>Posts tagged <a href="{TagURL}">{Tag}</a></h2>
</div>
</div>
</article>
{/block:TagPage}

{block:Posts}



<div id="designline">
<h5 class="postDate">
<abbr>{block:Date}<a href="{Permalink}">{DayOfMOnth}{DayOfMonthSuffix} {ShortMonth} {Year}</a>{/block:Date}{block:NoteCount} | <a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}
</abbr>
</h5>
</div>

<article>
<div>
{block:Text}
{block:Title}<h2><a href="{Permalink}">{Title}</a></h2>{/block:Title}
{Body}
{/block:Text}

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

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

{block:Quote}
<div id="quoteText"><h2>{Quote}</h2></div>
{block:Source}<div id="quoteSource"><p>&mdash;{Source}</p></div>{/block:Source}
{/block:Quote}

{block:Link}
<h2><a href="{URL}" {Target}>{Name}</a></h2>
{block:Description}
<div>{Description}</div>
{/block:Description}
{/block:Link}

{block:Chat}
{block:Title}<h2>{Title}</h2>{/block:Title}
<ul class="chat">
{block:Lines}
<li>{block:Label}<strong>{Label}</strong>{/block:Label} {Line}</li>
{/block:Lines}
</ul>
{/block:Chat}

{block:Audio}
<div class="audioleft">
<div class="audioc">
<div class="audio">{AudioPlayerBlack}</div>
</div>
</div>
<div class="audioright">
<div class="audioCaption">{block:Artist}<b>{Artist}</b>{/block:Artist}
<p>&mdash;{block:TrackName}{TrackName}{/block:TrackName}</p>
</div>
</div>
<div class="audioClear"></div>
<div class="audioContainer">
{block:Caption}{Caption}{/block:Caption}
</div>
{/block:Audio}

{block:Video}
<div class="media">{Video-500}</div>
{block:Caption}<div>{Caption}</div>{/block:Caption}
{/block:Video}

{block:Answer}
<h3>{Asker} asked: {Question}</h3>
{Answer}
{/block:Answer}

{block:Date}

{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}

{block:PostNotes}
{PostNotes}
{/block:PostNotes}

{block:Date}

</div>
</article>

<a href="http://twitter.com/share" class="twitter-share-button" data-count="none" data-via="OoohChristy">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

{/block:Posts}


{block:PermalinkPagination}
<nav id="pageNav">
<ul class="clearfix">
{block:PreviousPost}<li><a href="{PreviousPost}" id="pageNavNewer">Previous</a></li>{/block:PreviousPost}
{block:NextPost}<li><a href="{NextPost}" id="pageNavOlder">Next</a></li>{/block:NextPost}
</ul>
</nav>
{/block:PermalinkPagination}



{block:Pagination}
<nav id="pageNav">
<ul class="clearfix">
{block:PreviousPage}<li><a href="{PreviousPage}" id="pageNavNewer">Newer</a></li>{/block:PreviousPage}
{block:JumpPagination length="5"}
{block:CurrentPage}<li><a href="{URL}" class="active">{PageNumber}</a></li>{/block:CurrentPage}
{block:JumpPage}<li><a href="{URL}">{PageNumber}</a></li>{/block:JumpPage}
{/block:JumpPagination}
{block:NextPage}<li><a href="{NextPage}" id="pageNavOlder">Older</a></li>{/block:NextPage}
</ul>
</nav>
{/block:Pagination}



{block:DayPagination}
<nav id="pageNav">
<ul class="clearfix">
{block:PreviousDayPage}<li><a href="{PreviousDayPage}">&laquo; {DayOfMonth} {ShortMonth}</a></li>{/block:PreviousDayPage}{block:NextDayPage}|<li><a href="{NextDayPage}">{DayOfMonth} {ShortMonth} &raquo;</a></li>{block:NextDayPage}
</ul>
</nav>

{/block:DayPagination}

</div><!-- END layout -->
</section>

<footer id="sitemeta">
<div class="clearfix">
<div class="thefooter">
<p><a href="http://www.tumblr.com/theme/12051">The Minimalist Theme</a> designed by <a href="http://minimalist.co">The Minimalist</a> | Powered by <a href="http://tumblr.com">Tumblr</a></p>
</div>
</div>
</footer>

{block:IfGoogleAnalyticsID}
<script type="text/javascript">var gaJsHost=(("https:"==document.location.protocol)?"https://ssl.":"http://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}

</body>
</html>

This post has been edited by daisy.mb: Mar 21 2011, 08:56 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Peter in Japan
post May 26 2011, 04:57 AM
Post #8





Group: Members
Posts: 1
Joined: 26-May 11
Member No.: 14,613
Hi, on the off chance you can help me, I saw this thread and have been trying to follow the instructions. I am also putting a sidebar in a Tumblr, an iframe that's 800 pixels high or so. Long story short, I added the sidebar custom CSS and it addd the iframe I wanted, but the main body gets pushed down 800 pixels, so that the sidebar is along the left, then the content begins 800 pixels down, when the sidebar iframe is finished. Can you give me suggestions for how to tackle this? I don't have the knowledge of CSS that I'd like, though Tumblr is pretty darned flexible.

The tumblr in question is http://peterpayne.tumblr.com, I have turned off the side code to keep things from messing up. Let me know if you can give any suggestions -- thanks!
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
ketta3
post Mar 19 2014, 03:52 PM
Post #9





Group: Members
Posts: 2
Joined: 19-March 14
Member No.: 20,570
Im having a problem. im following directions it just doesnt seem to work.






<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">
<meta name="if:Show portrait" content="1"/>
<meta name="if:Show title" content="1"/>
<meta name="if:Show search" content="1"/>
<meta name="if:Show date" content="1"/>
<meta name="if:Show tags" content="0"/>
<meta name="if:Show notes count" content="0"/>


{block:Description}
<meta name="description" content="{MetaDescription}" />
{/block:Description}

<title>{Title}</title>

<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">

<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<style type="text/css">
/* --------------------------------------------------------------------------
$BODY-ELEMENTS
/--------------------------------------------------------------------------*/
body
{
margin:0;
padding:20px 0;
background-color:#eeeeee;
background-image:url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/ 2wCEAAkGBxQTEhQUExQWFhUXGBgaFRgYFxgYHRwcGBcYFxwdGB8aHCggHCAlHBcYITEhJSkrLi4uFx8z
ODMsNygtLisBCgoKDg0OGhAQGywkHyQsLCw0LCw0LCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCwsLCws
LCwsLCwsLCwsLCwsLP/AABEIAN4A4wMBIgACEQEDEQH/xAAcAAABBQEBAQAAAAAAAAAAAAAFAAMEBgcBAgj/ xABAEAACAQIEBAQDBgYBAwMFAQABAhEAAwQSITEFIkFRBhNhcTKBkQcjQqGxwRRSctHh8GIVM4JTkqIk
Q7Kz8Qj/xAAZAQADAQEBAAAAAAAAAAAAAAAAAQIDBAX/xAAkEQACAgICAgICAwAAAAAAAAAAAQIRAyESMUFRImEEMhMjcf/aAAwDAQACEQMRAD8A2KlSrtZlipUqVACpvFX1toz3GCooLMxMAACSTTorOft44i1rhoRTHnXVRv6QGc/XKBTS2DA/E/txtrcixhjctgxnd8hI7gBTHz/ Krv4P8c4biAi2Sl2JNt4mO6xoRXy2qE7GnsFjrllw9tyrrqrKdRWzgqM+TPsY1ys7+zr7TLWMCWL5yYi
NzAV+mh2zelaLWLVFp2cilFdrlIZyKVdrkUAKuV2u0AcpUq7QBylFdpUAKu0q6KAORVe8ZeLbHD7We6Z
dp8u2N2I/Qetd8a+LbPDrBuXdWMi2g3Y/sO5r5q47xu9jbxvXWl26E6KJ2UdBWkIWTKvb script:likelink('{PostID}','{Permalink}','');" class="icon like">like</a>
</li>
<li>
<a href="#" class="icon reblog">reblog</a>
</li>
<li>
<a href="#" class="notes">{NoteCount}</a>
</li>
</ul>
<!--/ .media-icons -->

</div>


{block:Title}
<!-- .title -->
<h2 class="title">
<a href="{Permalink}">{Title}</a>
</h2>
<!--/ .title -->
{/block:Title}
{Body}
</div>
<!--/ .post-body -->
<!-- .post-meta.meta -->
<div class="post-meta meta">
{block:IfShowDate}
Posted <a href="{Permalink}" class="subtle">{TimeAgo}</a>{/block:IfShowDate}{block:IfShowTags}{block:HasTags}{block:IfShowDate}, under {/block:IfShowDate}
<ul class="tags">
{block:Tags}
<li><a href="{TagURL}">{Tag}</a>
{/block:Tags}
</ul>
{/block:HasTags}
{/block:IfShowTags}
{block:IfShowNotesCount}
{block:IfShowDate} with {/block:IfShowDate}
{block:IfNotShowDate}{block:IfShowTags} with {/block:IfShowTags}{/block:IfNotShowDate}
<a href="{Permalink}" class="subtle">{NoteCountWithLabel}</a>
{/block:IfShowNotesCount}
</div>
<!--/ .post-meta.meta -->
</div>
<!--/ .post-container -->
</li>
<!--/ .post.text -->
{/block:Text}
{block:Answer}
<!-- .post.text -->
<li class="post text masonry-item">
<!-- .post-container -->
<div class="post-container">
<!-- .post-body -->
<div class="post-body">

<div class="post-veil ">

<!-- .media-icons -->
<ul class="media-icons style2">
<li>
<a href="java script:likelink('{PostID}','{Permalink}','');" class="icon like">like</a>
</li>
<li>
<a href="#" class="icon reblog">reblog</a>
</li>
<li>
<a href="#" class="notes">{NoteCount}</a>
</li>
</ul>
<!--/ .media-icons -->

</div>

<!-- .title -->
<h2 class="title">
<a href="{Permalink}">{Question}</a>
</h2>
<!--/ .title -->

{Answer}
</div>
<!--/ .post-body -->
<!-- .post-meta.meta -->
<div class="post-meta meta">
{block:IfShowDate}
Posted <a href="{Permalink}" class="subtle">{TimeAgo}</a>{/block:IfShowDate}{block:IfShowTags}{block:HasTags}{block:IfShowDate}, under {/block:IfShowDate}
<ul class="tags">
{block:Tags}
<li><a href="{TagURL}">{Tag}</a>
{/block:Tags}
</ul>
{/block:HasTags}
{/block:IfShowTags}
{block:IfShowNotesCount}
{block:IfShowDate} with {/block:IfShowDate}
{block:IfNotShowDate}{block:IfShowTags} with {/block:IfShowTags}{/block:IfNotShowDate}
<a href="{Permalink}" class="subtle">{NoteCountWithLabel}</a>
{/block:IfShowNotesCount}
</div>
<!--/ .post-meta.meta -->
</div>
<!--/ .post-container -->
</li>
<!--/ .post.text -->
{/block:Answer}
{block:Photo}
<!-- .post.photo -->
<li class="post photo masonry-item">
<!-- .post-container -->
<div class="post-container">
<!-- .post-body -->
<div class="post-body">

<div class="post-veil ">

<!-- .media-icons -->
<ul class="media-icons style2">
<li>
<a href="java script:likelink('{PostID}','{Permalink}','');" class="icon like">like</a>
</li>
<li>
<a href="#" class="icon reblog">reblog</a>
</li>
<li>
<a href="#" class="notes">{NoteCount}</a>
</li>
</ul>
<!--/ .media-icons -->

</div>


<img src="{PhotoURL-500}" alt="">

<!-- .caption -->
<div class="caption">
<span>{Caption}</span>
</div>
<!--/ .caption -->
</div>
<!--/ .post-body -->
</div>
<!--/ .post-container -->
</li>
<!--/ .post.photo -->
{/block:Photo}
{block:Photoset}
<!-- .post.photoset -->
<li class="post photoset masonry-item">
<!-- .post-container -->
<div class="post-container">
<!-- .post-body -->
<div class="post-body">

<div class="post-veil ">

<!-- .media-icons -->
<ul class="media-icons style2">
<li>
<a href="java script:likelink('{PostID}','{Permalink}','');" class="icon like">like</a>
</li>
<li>
<a href="#" class="icon reblog">reblog</a>
</li>
<li>
<a href="#" class="notes">{NoteCount}</a>
</li>
</ul>
<!--/ .media-icons -->

</div>


<ul class="photos">
{block:Photos}
<li><img src="{PhotoURL-500}" alt=""></a>
{/block:Photos}
</ul>
<!-- .caption -->
<div class="caption">
<span>{Caption}</span>
</div>
<!--/ .caption -->
</div>
<!--/ .post-body -->
<!-- .post-meta.meta -->
<div class="post-meta meta">
{block:IfShowDate}
Posted <a href="{Permalink}" class="subtle">{TimeAgo}</a>{/block:IfShowDate}{block:IfShowTags}{block:HasTags}{block:IfShowDate}, under {/block:IfShowDate}
<ul class="tags">
{block:Tags}
<li><a href="{TagURL}">{Tag}</a>
{/block:Tags}
</ul>
{/block:HasTags}
{/block:IfShowTags}
{block:IfShowNotesCount}
{block:IfShowDate} with {/block:IfShowDate}
{block:IfNotShowDate}{block:IfShowTags} with {/block:IfShowTags}{/block:IfNotShowDate}
<a href="{Permalink}" class="subtle">{NoteCountWithLabel}</a>
{/block:IfShowNotesCount}
</div>
<!--/ .post-meta.meta -->
</div>
<!--/ .post-container -->
</li>
<!--/ .post.photoset -->
{/block:Photoset}
{block:Quote}
<!-- .post.quote -->
<li class="post quote masonry-item">
<!-- .post-container -->
<div class="post-container">
<!-- .post-body -->
<div class="post-body">

<div class="post-veil ">

<!-- .media-icons -->
<ul class="media-icons style2">
<li>
<a href="java script:likelink('{PostID}','{Permalink}','');" class="icon like">like</a>
</li>
<li>
<a href="#" class="icon reblog">reblog</a>
</li>
<li>
<a href="#" class="notes">{NoteCount}</a>
</li>
</ul>
<!--/ .media-icons -->

</div>


<blockquote>
<p>
"{Quote}"
</p>
</blockquote>
{block:Source}
<cite>{Source}</cite>
{/block:Source}
</div>
<!--/ .post-body -->
<!-- .post-meta.meta -->
<div class="post-meta meta">
{block:IfShowDate}
Posted <a href="{Permalink}" class="subtle">{TimeAgo}</a>{/block:IfShowDate}{block:IfShowTags}{block:HasTags}{block:IfShowDate}, under {/block:IfShowDate}
<ul class="tags">
{block:Tags}
<li><a href="{TagURL}">{Tag}</a>
{/block:Tags}
</ul>
{/block:HasTags}
{/block:IfShowTags}
{block:IfShowNotesCount}
{block:IfShowDate} with {/block:IfShowDate}
{block:IfNotShowDate}{block:IfShowTags} with {/block:IfShowTags}{/block:IfNotShowDate}
<a href="{Permalink}" class="subtle">{NoteCountWithLabel}</a>
{/block:IfShowNotesCount}
</div>
<!--/ .post-meta.meta -->
</div>
<!--/ .post-container -->
</li>
<!--/ .post.quote -->
{/block:Quote}
{block:Link}
<!-- .post.link -->
<li class="post link masonry-item">
<!-- .post-container -->
<div class="post-container">
<!-- .post-body -->
<div class="post-body">

<div class="post-veil ">

<!-- .media-icons -->
<ul class="media-icons style2">
<li>
<a href="java script:likelink('{PostID}','{Permalink}','');" class="icon like">like</a>
</li>
<li>
<a href="#" class="icon reblog">reblog</a>
</li>
<li>
<a href="#" class="notes">{NoteCount}</a>
</li>
</ul>
<!--/ .media-icons -->

</div>

<!-- .title -->
<h2 class="title">
<a href="{URL}" {Target}>{Name} <span class="pull-right">→</span></a>
</h2>
<!--/ .title -->
{block:Description}
<p>
{Description}
</p>
{/block:Description}
</div>
<!--/ .post-body -->
<!-- .post-meta.meta -->
<div class="post-meta meta">
{block:IfShowDate}
Posted <a href="{Permalink}" class="subtle">{TimeAgo}</a>{/block:IfShowDate}{block:IfShowTags}{block:HasTags}{block:IfShowDate}, under {/block:IfShowDate}
<ul class="tags">
{block:Tags}
<li><a href="{TagURL}">{Tag}</a>
{/block:Tags}
</ul>
{/block:HasTags}
{/block:IfShowTags}
{block:IfShowNotesCount}
{block:IfShowDate} with {/block:IfShowDate}
{block:IfNotShowDate}{block:IfShowTags} with {/block:IfShowTags}{/block:IfNotShowDate}
<a href="{Permalink}" class="subtle">{NoteCountWithLabel}</a>
{/block:IfShowNotesCount}
</div>
<!--/ .post-meta.meta -->
</div>
<!--/ .post-container -->
</li>
<!--/ .post.link -->
{/block:Link}
{block:Chat}
<!-- .post.chat -->
<li class="post chat masonry-item">
<!-- .post-container -->
<div class="post-container">
<!-- .post-body -->
<div class="post-body">

<div class="post-veil ">

<!-- .media-icons -->
<ul class="media-icons style2">
<li>
<a href="java script:likelink('{PostID}','{Permalink}','');" class="icon like">like</a>
</li>
<li>
<a href="#" class="icon reblog">reblog</a>
</li>
<li>
<a href="#" class="notes">{NoteCount}</a>
</li>
</ul>
<!--/ .media-icons -->

</div>

{block:Title}
<!-- .title -->
<h2 class="title">
<a href="{Permalink}">{Title}</a>
</h2>
<!--/ .title -->
{/block:Title}
<!-- .conversation -->
<ul class="conversation">
{block:Lines}
<li class="line_{Alt}">
{block:Label}<strong>{Label}</strong>   {block:Label}
{Line}
</li>
{/block:Lines}
</ul>
<!--/ .conversation -->
</div>
<!--/ .post-body -->
<!-- .post-meta.meta -->
<div class="post-meta meta">
{block:IfShowDate}
Posted <a href="{Permalink}" class="subtle">{TimeAgo}</a>{/block:IfShowDate}{block:IfShowTags}{block:HasTags}{block:IfShowDate}, under {/block:IfShowDate}
<ul class="tags">
{block:Tags}
<li><a href="{TagURL}">{Tag}</a>
{/block:Tags}
</ul>
{/block:HasTags}
{/block:IfShowTags}
{block:IfShowNotesCount}
{block:IfShowDate} with {/block:IfShowDate}
{block:IfNotShowDate}{block:IfShowTags} with {/block:IfShowTags}{/block:IfNotShowDate}
<a href="{Permalink}" class="subtle">{NoteCountWithLabel}</a>
{/block:IfShowNotesCount}
</div>
<!--/ .post-meta.meta -->
</div>
<!--/ .post-container -->
</li>
<!--/ .post.chat -->
{/block:Chat}
{block:Video}
<!-- .post.video -->
<li class="post video masonry-item">
<!-- .post-container -->
<div class="post-container">
<!-- .post-body -->
<div class="post-body">

<div class="post-veil ">

<!-- .media-icons -->
<ul class="media-icons style2">
<li>
<a href="java script:likelink('{PostID}','{Permalink}','');" class="icon like">like</a>
</li>
<li>
<a href="#" class="icon reblog">reblog</a>
</li>
<li>
<a href="#" class="notes">{NoteCount}</a>
</li>
</ul>
<!--/ .media-icons -->

</div>


{VideoEmbed-700}
{block:AudioEmbed}
{AudioEmbed}
{/block:AudioEmbed}
<!-- .media-icons -->
<ul class="media-icons style2">
<li>
<a href="java script:likelink('{PostID}','{Permalink}','');" class="icon like">Like</a>
</li>
<li>
<a href="{ReblogURL}" class="icon reblog">Reblog</a>
</li>
<li>
<a href="#" class="notes">{NoteCount}</a>
</li>
</ul>
<!--/ .media-icons -->
</div>
<!--/ .post-body -->
<!-- .post-meta.meta -->
<div class="post-meta meta">
{block:IfShowDate}
Posted <a href="{Permalink}" class="subtle">{TimeAgo}</a>{/block:IfShowDate}{block:IfShowTags}{block:HasTags}{block:IfShowDate}, under {/block:IfShowDate}
<ul class="tags">
{block:Tags}
<li><a href="{TagURL}">{Tag}</a>
{/block:Tags}
</ul>
{/block:HasTags}
{/block:IfShowTags}
{block:IfShowNotesCount}
{block:IfShowDate} with {/block:IfShowDate}
{block:IfNotShowDate}{block:IfShowTags} with {/block:IfShowTags}{/block:IfNotShowDate}
<a href="{Permalink}" class="subtle">{NoteCountWithLabel}</a>
{/block:IfShowNotesCount}
</div>
<!--/ .post-meta.meta -->
</div>
<!--/ .post-container -->
</li>
<!--/ .post.video -->
{/block:Video}
{block:Audio}
<!-- .post.audio -->
<li class="post audio masonry-item">
<!-- .post-container -->
<div class="post-container">
<!-- .post-body -->
<div class="post-body">

<div class="post-veil ">

<!-- .media-icons -->
<ul class="media-icons style2">
<li>
<a href="java script:likelink('{PostID}','{Permalink}','');" class="icon like">like</a>
</li>
<li>
<a href="#" class="icon reblog">reblog</a>
</li>
<li>
<a href="#" class="notes">{NoteCount}</a>
</li>
</ul>
<!--/ .media-icons -->

</div>

<!-- .title -->
<h2 class="title">
<a href="{Permalink}">{block:TrackName}{TrackName}{/block:TrackName} {block:Artist}- {Artist}{/block:Artist} {block:Album}{Album}{/block:Album}</a>
</h2>
<!--/ .title -->

{block:AudioPlayer}
<br>
{AudioPlayer}
{/block:AudioPlayer}

{block:AudioEmbed}
<br>
{AudioEmbed}
{/block:AudioEmbed}

{block:Caption}
{Caption}
{/block:Caption}
</div>
<!--/ .post-body -->
<!-- .post-meta.meta -->
<div class="post-meta meta">
{block:IfShowDate}
Posted <a href="{Permalink}" class="subtle">{TimeAgo}</a>{/block:IfShowDate}{block:IfShowTags}{block:HasTags}{block:IfShowDate}, under {/block:IfShowDate}
<ul class="tags">
{block:Tags}
<li><a href="{TagURL}">{Tag}</a>
{/block:Tags}
</ul>
{/block:HasTags}
{/block:IfShowTags}
{block:IfShowNotesCount}
{block:IfShowDate} with {/block:IfShowDate}
{block:IfNotShowDate}{block:IfShowTags} with {/block:IfShowTags}{/block:IfNotShowDate}
<a href="{Permalink}" class="subtle">{NoteCountWithLabel}</a>
{/block:IfShowNotesCount}
</div>
<!--/ .post-meta.meta -->
<!--/ .post-container -->
</div>
</li>
<!--/ .post.audio -->
{/block:Audio}
{/block:Posts}
</ol>
<!--/ ol.posts -->

<div class="clearfix"></div>

<br><br>


{block:Pagination}

<!-- .pagination.older-newer -->
<ol class="pagination older-newer ">
{block:PreviousPage}
<li class="previous"><a href="{PreviousPage}">← Newer</a></li>
{/block:PreviousPage}

{block:NextPage}
<li class="next"><a href="{NextPage}">→ Older</a></li>
{/block:NextPage}
</ol>
<!--/ .pagination.older-newer --> {/block:Pagination}

</div>
<!--/ .inner -->
</div>
<!--/ .content -->
</div>
<!--/ .wrapper -->

<iframe id="likeiframe" style="width: 0px; height: 0px;"></iframe>


<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="http://masonry.desandro.com/jquery.masonry.min.js"></script>
<script type="text/javascript" src="http://static.tumblr.com/uiqhh9x/UYAm6i0bc/like.js"></script>
<script src="https://raw.github.com/paulirish/infinite-scroll/master/jquery.infinitescroll.js"></script>
<script>
$(document).ready(function() {

$('#ask_form').parent().parent().children('.post-veil').remove();
// remove the veil from ask form post
});
</script>
</body> <!--Hypster Music Player-->
<script type="text/javascript" src="http://scm.hypster.com/script.php" ><!--//--></script>
<script type="text/javascript">
<!--
SCMMusicPlayer.init("{'skin':'skins/black/skin.css','playback':{'autostart':'false','shuffle':'false','volume':'100'},'playlist':'6894078','placement':'bottom','showplaylist':'false'}");
//-->
</script>
<!--Hypster Music Player-->

</html>
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: 19th April 2024 - 04:08 AM
Invision Power Board © 2024  IPS, Inc.
Licensed to: HTMLHelp.com, LLC