Tag Archives: tumblr

fixing iLindsay’s tumblr

This post is going to be actually something I have never done before, and I don’t know if I will ever do again. It’s a post meant for one, as it’s code to fix their tumblr. If you don’t know what a tumblr is get one, it’s a wonderful service. This is basically just css, however I did slice out some code from the original page (page breaks for example) and replaced it with css where applicable.

I will try to provide some description so that if you want to read on it will be of some use to you, however I will be addressing Lindsay directly in this post, so don’t be mad at me if I call you Lindsay, I assure you it’s nothing personal.

Before continuing Lindsay I would highly recomend you somehow back up your code, as who knows I could make an error or you could make an error and I don’t want you to ruin what already is working just in case.

Anyways Lindsay the code snippet you will see below is css that should be able to be added at the end of your existing css without causing any issues for your existing page. The “twitter_div” id selector simply takes the enclosing div and adds that graphic to it as a background image, it also seperates it from the marquee above, as well as spacing it out the inner ul from the background image so your tweet does not cover up the background image in any way.

The “twitter_update_list” is listed with “header” before it to overwrite the inherited css from the previous “header ul” declaration. Chiefly this declaration affects the tweet’s appearance, however it also removes padding and margins from the previous declaration as well.

The “twitter_update_list a” id is simply used to take the time stamp link and place it on it’s own line below the tweet itself.


/* div that contains entire tweet */
#twitter_div {background-image: url(http://img71.imageshack.us/img71/4161/birdnu1.png); background-repeat: no-repeat; margin-top: 10px; padding-left: 35px;}


/* contains just tweet */
#header #twitter_update_list {font-family: Arial, Helvetica, sans-serif; font-size: 1.1em; letter-spacing: 0px; line-height: 110%; font-weight: normal; color: #000000; text-transform: none; margin: 0px; padding: 0px;}


/* timestamp link */
#twitter_update_list a {display: block;}

Lastly here is the code as I edited it, going from the closing marquee tag to the ending div for the header container. The only major change I made was removing the line breaks from the presenation as it was replaced with a margin declaration in the css.


</marquee>
<!-- Your Twitter code starts here -->
<div id="twitter_div">
<ul id="twitter_update_list"></ul></div>
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/9131132.json?callback=twitterCallback2&count=1"></script>
<!-- Your Twitter code ends here -->
</div>


<ul>
<li><a href="/mobile">Mobile</a></li>
<li><a href="/archive">Archive</a></li>
<li><a href="http://ilindsay.tumblr.com/rss">RSS</a></li>
<li><a href="/random">Random</a></li>
</ul>
</div>

I really hope this all went fine for you, if not you know where to find me.

Good Luck Lindsay.