Displaying a Div Only on Tumblr Blog Homepage

displaying a div only on tumblr blog homepage?

I ended up killing off the {Block:IndexPage} tag altogether and changing the original div callout to this:

<div id="splashbox" class="mid2" style="display:none">

Followed by this script:

<script type="text/javascript">
window.onload=showsplashbox();
function showsplashbox() {
   //alert('location identified as ' + location.href);
   if (location.href == 'http://site.tumblr.com/' || location.href == 'http://site.tumblr.com') {
           //alert('location match, show the block');
           document.getElementById('splashbox').style.display='block';
   }
}
</script>

Sidebar Showing outside of a div on tumblr theme

The browser does not take into account the absolutely-positioned sidebar when calculating what the height of the container should be. So the container is too short when there is no main content or when the height of the main content is not tall enough as the sidebar.

To overcome this, you can set a minimum height for your container element equal to the height of your sidebar with jQuery, for instance:

$(document).ready(function(){
$(".wrap").css("min-height", function(){
return $(".sidebar").innerHeight()+30;
});});

If your sidebar contains images I would recommend using imagesLoaded in conjunction with that so that the script accounts for heights of images instead of having them as 0 when they are loading.
We add 30 to the calculated height of the sidebar to account for the top margin.

How to hide a div on non-permalink pages on Tumblr

Do get code to only appear on post permalinks you need to include a combination of blocks.

{block:PermalinkPage}{block:Date}
    <!-- code placed in here will *only* render on post permalinks -->
{/block:Date}{/block:PermalinkPage}

The PermalinkPage block is pretty self explanatory. The trick here is using the Date block. Pages, you see, don't have dates assigned to them, they are just static content. Only post permalinks have a date assigned to them so you can use it to help filter your conditionals.

Update

If this content is being entered individually on each post you'll need to go a slightly different route. In the <head> of your theme file you should be able to do this:

<style type="text/css">
    {block:PermalinkPage}{block:Date}
    .contents { display: block; }
    {/block:Date}{/block:PermalinkPage}
</style>

Then in your original styles for the .contents block, just make sure to make it be display: none;.

Now it will only be display block on post permalinks.

element on main Tumblr page ONLY - works but breaks control buttons

Your HTML is invalid. You can't have more than one body element on a page, and they can't be wrapped in divs. Remove the opening and closing body elements from your CustomHTML block. It's important that the tumblr_controls iframe loads (the join / follow buttons in the top right corner), otherwise the like buttons won't work -- when your HTML is invalid the iframe might not load correctly. Fix that and all should be good.

Show only title (with linked) on tumblr index

Simply use {block:IndexPage} to show the post titles and {block:PermalinkPage} to show all of the content.

Unfortunately, only three Tumblr post types support titles: Text, Chat and Link.

Hide a paragraph on the main page, but show it in the post on Tumblr

I'm not sure if I fully understand your question. If you want to create a text post with a paragraph hidden on the index page of your theme, then this should help:

Add this inside of the CSS of your theme code:

{block:IndexPage}
.hiddentext {display:none;}
{/block:IndexPage}

Create or edit the text post in HTML mode, and style the text you want to hide liked this:

<p>This is text that you will see!</p>

<p class="hiddentext">This text will only be visible on the permalink page!</p>

The text will display normally on the dashboard and on the permalink page of your blog, but will be invisible on the index page of your blog.

If you don't know where to add the css, go into your them HTML and search for </style> and place the code directly above that.

Displaying a Div Only on Tumblr Blog Homepage