Blogger Template Hacking

October 7, 2005 12:56 PM

So I'm template hacking my Blogger account and I've got a problem. The template tag that actually contains the body of my posts (< $blogitembody$>) forces a break both before and after it (Blogger template tags defined here). Thus, I can't format my posts so that I have both the contents of my post and the perm link on the same line (just like Kottke has done here). I have removed all the formatting html and CSS in my template and, no matter what I do, the forced break won't go away? Any hacks or work around ideas?
posted by JPowers to Technology (7 answers total)

Hard to say without being able to see the template or the HTML involved. How about a link?

Is that blogitembody tag inside a DIV or P or whatever? Those HTML tags always have linebreaks before and after, unless you over-ride that in the CSS with "display:inline"
posted by AmbroseChapel at 2:23 PM on October 7, 2005

Response by poster: Here's a link to my code. I bolded and put in red the Blogger template tags. And again, the actual body tag, which publishes the body of the post, is: < $blogitembody$>.
posted by JPowers at 2:33 PM on October 7, 2005

If the problem really is with the blogger tag (not, as AmbroseChapel wonders, with an interfering paragraph tag), then why not just add the permalink tag *to* the post? Put the html for the permalink as part of your "post template" so it shows up automatically with every new post you make. That should do it.
posted by electric_counterpoint at 2:53 PM on October 7, 2005

$blogitembody$ does not force a line break in my template (tuwa.blogspot.com). I had to include a <br> after the $blogitembody$ bit to have the "posted by Tuwa @ 06:18. | permalink | 1 comment" part show up on a separate line.

Have you tried removing the <br> that shows up after <$BlogItemBody$></span> and before
</Blogger>?
posted by Tuwa at 3:09 PM on October 7, 2005

Well, if the problem is the Blogger generated paragraph elements, then you're going to have problems. The best solution I can think of is a bit of javascript:

function insertLink( containerId, url ) {    var link = document.createElement( "a" );    var container = document.getElementById( containerId );    link.href = url;    link.className = "permalink";    link.appendChild( document.createTextNode( "#" ) );    for (var element = container.lastChild; element && (element.nodeName != "P"); element = element.previousSibling );    if (element == null) { return; }    element.appendChild( document.createTextNode( " " ) );    element.appendChild( link );}

You'd put this in your template like so:

<div id="post-<$BlogItemNumber$>"><$BlogItemBody$></div><script type="text/javascript">    insertLink( "post-<$BlogItemNumber$>", <$BlogItemPermalinkURL$> );</script>

posted by sbutler at 5:40 PM on October 7, 2005

Best answer: In your blog's settings, under "Settings", under "Formatting", change "Enable float alignment" from "yes" to "no" and see if that helps.
posted by mcwetboy at 6:52 PM on October 7, 2005

Response by poster: mcwetboy: that totally did the trick! Thanks a million!
posted by JPowers at 9:12 PM on October 7, 2005