Monday, June 23, 2003

Blogger Tips

Note: I have completely changed my Blogger template since I wrote this article. I think the tips listed here still work, but my site looks different now.

Many Blogger users have emailed me to ask how I achieve various effects on my blogs. I am not an expert on blogging, but I will share what I've learned. I am fairly experienced with HTML, and I still found it frustrating at first to edit my Blogger template. Here are some of the "tricks."

How to list your archives

The technique for doing this has recently changed in the newest version of Blogger. To list your archives, edit your Blogger Template and put this code in where you want the archives list to appear.


<BloggerArchives>
<a href='<$BlogArchiveLink$>'><$BlogArchiveName$></a>
</BloggerArchives>


Titles for your articles

In Blogger, go to Settings / Formatting and set Show Title Field to "Yes." Now add this section before the body of your post:

<div class="articletitle">
<BlogItemTitle>
<$BlogItemTitle$>
</BlogItemTitle>
</div>

I surround the title in a named div element so I can use CSS to control the look of the title. CSS is much too complicated to explain here, so go to the online tutorial.

Creating a Byline

The byline names the author and the time of the post. Some people use the time of the post as their Permalink (see below), but I prefer to separate them. You can create a byline by putting this after the post area of your Blogger Template:
   <span class="byline">posted by <$BlogItemAuthorNickname$> at <$BlogItemDateTime$></span>

I surround the byline with a named span element so I can control the look of the byline with CSS.

How to create Permalinks

Permalinks allow other bloggers to link directly to a specific article on your blog. They are an essential feature of a blog! A lot of the blogs I've been to have non-functional permalinks. Often I want to link to a post because it is great material, but I don't because the permalink doesn't work. (Of course, some people's writing is so good that I link to the site anyway.)

There are two parts to a permalink, the Link Anchor, which is the spot in your site that the permalink takes you to and the Hyperlink, which is the section the user clicks on to go to the Permalink. Edit your Blogger Template and place the Link Anchor section right before the Title of your blog post. The Anchor should be before the title of the post so that the title will show up when the user navigates to the article using the permalink. The Link Anchor section looks like this:
   <a name="<$BlogItemNumber$>"></a>

Next you need to create the Hyperlink part of the permalink. Most bloggers put this at the very end of the post. At the end of the post part of your template, put in the Hyperlink like this:
   <a href="<$BlogItemArchiveFileName$>#<$BlogItemNumber$>">(permalink)</a>


Adding a horizontal line as a separator

If you want a horizontal line separating your posts, like I have on my Matrix Essays site, then add this after your permalink hyperlink:
   <hr />

<br />


Putting it all together

The complete <Blogger /> section of my site (except for the reader comments part) looks like this, in case you just want to copy and paste the whole thing:
<Blogger>

<!---- DAY TITLE -->
<div class="date">
<BlogDateHeader>
<$BlogDateHeaderDate$>
</BlogDateHeader>
</div>

<!---- PERMALINK ANCHOR --->
<a name="<$BlogItemNumber$>"></a>

<!---- ARTICLE TITLE --->
<div class="articletitle">
<BlogItemTitle>
<$BlogItemTitle$>
</BlogItemTitle>
</div>

<!---- POSTS ---->
<div class="posts">
<$BlogItemBody$>
</div>

<!---- BYLINE --->
<span class="byline">posted by <$BlogItemAuthorNickname$> at <$BlogItemDateTime$>
<!---- PERMALINK HYPERLINK --->
<a href="<$BlogItemArchiveFileName$>#<$BlogItemNumber$>">(permalink)</a>
</span>
<br />
<br />
</Blogger>


Adding comments for reader feedback

If you want your readers to be able to leave comments, you'll have to add a comments service like backblog or squawkbox. Sign up with one of these services and follow their instructions. They both work with Blogger.

Note: Since I wrote this article, Blogger has added their own commenting system. I now use the Blogger comment feature, and it works great.

Getting more hits

This one is easy. Write about sex, and you will get more hits.

But maybe you don't want to do that. Maybe you want more people to read your insights about non-sexual topics. There are various tricks for getting hits, but they all ultimately involve tricking people into going to your site when it doesn't really contain what they are looking for. Do you really want a lot of hits from people who will be disappointed about having wasted their time? Or do you want a smaller number of "quality" hits from interesting people? To get quality hits, write original material that offers your own unique perspective, and become the Blorg.


Don't put "weird stuff" inside tables

If you use an HTML table to lay out your site with multiple columns, and you also have a control like a hit counter or any other unusual thing, do not put the unusual thing inside the table! There was (and may still be) a bug in Blogger that would randomly ruin your template if you did this. It took me many hours of frustration to figure out what was happening. Put "weird stuff" either before the table or after it. I always put my hit counters at the very bottom of the page, below the table.

Adding a hit counter

I recommend GoStats. Put it outside the tables :-)

The Mozilla Curse

If you use Mozilla as your browser (and it's a great browser, you should use it just for the popup-blocking), then never, never accidentally type a single quote where you meant to type a double quote inside a hyperlink tag. If you do this, your post will become un-editable with Mozilla, even in "safe mode," and you'll have to use IE to fix it.