August 11, 2005

Essential change to Blogger Templates

I love blogs, love reading 'em. However Blogger blogs have a major flaw in their templates when it comes to the links to the single page posts. Some of the templates have addressed it but in the older blogs the problem still remains.

Take a look at Spam Bank and you'll see that the heading for every post is a link and the footer information includes the heading. Take a look at most other blogger sites and it won't be. That causes problems when the posts are long, you want to make a comment, or return to read comments and it's really hard to find the end of that post.

Well, read on for the solution...

Minor change to snippets. In the snippets you will find < $ this needs to be changed to remove the space.

The heading sections start life as plain text, big and bold for sure but the template code looks like this:

CODE:
  1. <blogitemtitle>
  2. <h3 class="post-title">
  3. <$BlogItemTitle$>
  4. </h3>
  5. </blogitemtitle>

when they should be clickable links into the post. The template needs to be changed to look like this

CODE:
  1. <blogitemtitle>
  2. <h3 class="post-title">
  3. <a href="<$BlogItemPermalinkUrl$>" title="<$BlogItemTitle$>">
  4. <$BlogItemTitle$>
  5. </a>
  6. </h3>
  7. </blogitemtitle>

If you work further down the template you'll find that the post time is normally the only link to the full page. This code will look like

CODE:
  1. <p class="post-footer">
  2. <em>posted by <$BlogItemAuthorNickname$> @ <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemDateTime$></a></em>
  3. <mainorarchivepage><blogitemcommentsenabled>
  4. <a class="comment-link" href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>><$BlogItemCommentCount$> comments</a>
  5. </blogitemcommentsenabled></mainorarchivepage> <$BlogItemControl$>
  6. </p>

but it's much more useful if it looks like

CODE:
  1. <p class="post-footer">
  2. <em>posted by <$BlogItemAuthorNickname$> @ <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemTitle$>: <$BlogItemDateTime$></a></em>
  3. <mainorarchivepage><blogitemcommentsenabled>
  4. <a class="comment-link" href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>><$BlogItemCommentCount$> comments</a>
  5. </blogitemcommentsenabled></mainorarchivepage> <$BlogItemControl$>
  6. </p>

Also on this site

23 Comments »

  1. Nice code you had!!

    Comment by Qiu — August 21, 2005 @ 4:02 am

  2. The code for this post has been reproduced on “Ask Dave Taylor” at Can I tweak my blogger templates to add true permalinks?.

    Dave is hugely respected and it’s a buzz to have your ideas recognised!

    Comment by sarahk — September 9, 2005 @ 6:32 am

  3. Sarah, I cut and pasted the template changes tsuggested but the permalink on the heading section didn’t work. Am I missing something?

    Comment by David Daniels — September 9, 2005 @ 1:51 pm

  4. Hi David

    I’ve revised the template a bit and sent you an email with the changes…

    Sarah

    Comment by sarahk — September 10, 2005 @ 8:47 am

  5. Thank you - it works now!!!

    Comment by David Daniels — September 10, 2005 @ 1:25 pm

  6. Sarah , I also tried it and it didnt work do your above instructions contain the “revised changes “

    Comment by Ron Johnson — September 18, 2005 @ 5:30 pm

  7. Yes they do!

    Comment by sarahk — September 19, 2005 @ 8:35 am

  8. hey sarah, i also tried this, and the first set of new code works, but the second part for the footer in doesn’t, its showing like this

    posted by @ : > comments

    -andrea

    Comment by Andrea — September 22, 2005 @ 11:44 am

  9. here’s my site for you to see what its doing

    http://cupcakerecipes.blogspot.com/

    Comment by Andrea — September 22, 2005 @ 11:48 am

  10. Red Alert

    I’ve just realised that the codes are being saved with a space between the < and the $.

    Please remove these when adding to your templates.

    Comment by sarahk — September 22, 2005 @ 12:25 pm

  11. Thanks for this really simple code change! :)

    One of those jobs I’ve been meaning to get around to but never quite finished (em, started).

    Works a treat so long as you watch out for the gaps from cutting ‘n’ pasting (”

    Comment by mcfox — October 7, 2005 @ 8:25 am

  12. Hi I am fasanated by you coding! I no beans about it but would love to learn! Got to keep this old brain sharp! LOL! Have a good week!

    Comment by Joe — November 4, 2005 @ 2:58 pm

  13. [...] A kind lady called Sarah encountered my blog, was horrified by what she saw, and and proffered this suggestion for tweaking the standard blogger template to add the readability of long articles by adding the heading to the footer section. [...]

    Pingback by Andy C » Blog Archive » tweaking the blogger template — November 12, 2005 @ 5:59 am

  14. Thanks for the tip, Sarah. I am currently putting together a new blog, which I am building using Blogger, and this is just the kind of “tweaks” I am incorporating.

    Comment by Gary — November 16, 2005 @ 8:30 am

  15. Thanks so much for this… I hardly recognise my template now with all the tweaks - yours is just the latest in my efforts to create a “good” blog (at least, code wise, the writing… dunno)

    Comment by dreamweaver — November 17, 2005 @ 8:51 am

  16. Sarah.

    Thanks for the breakdown on how to do this. My issue is that I cannot seem to find that exact code in my template. Maybe it is the template itself or perhaps an addition I’ve made, but I cannot seem to find those snippets of code that I need to edit.

    Any ideas on what I can do other than hire a coder??

    Thanks for your time.

    Comment by IncognitoJoe — December 30, 2005 @ 2:04 pm

  17. [...] An oldie but a goodie . [...]

    Pingback by SEO for Blogspot Sites -- Macalua.com — January 15, 2006 @ 7:59 am

  18. [...] Blogspot-hosted blogs can duke it out with the best of them, but to get the most out of your site, you need to tweak it a bit. Here are some onpage template optimization tips you can use if you want to optimize your Blogspot site. [...]

    Pingback by SEO for Blogspot Sites -- Macalua.com — January 16, 2006 @ 6:48 pm

  19. Nice tweak. That’s one thing I always hated about blogspot was not being able to click on the title. Thanks.

    Comment by jclick — February 4, 2006 @ 12:55 am

  20. [...] Simple SEO ? Essential change to Blogger Templates I did a search on Google for ways to optimize my two blogspot sites (jasonclick.blogspot.com and sam-squirrel.blogspot.com). I found the above site which shows several things but the one I’ve done so far is make the post titles “clickable”. That’s one thing I noticed about Blogger or Blogspot is that each post title is not clickable. We’ll I’ve made the changed suggested in the first part of the tutorial and now my post titles are clickable. Try them out! [...]

    Pingback by Jason’s Random Thoughts and Happenings » Blog Archive » Simple SEO ? Essential change to Blogger Templates — February 12, 2006 @ 11:40 pm

  21. Just wanted to say thanks for the great code.

    Comment by QT — February 17, 2006 @ 8:21 am

  22. Great tip. I was looking for this information.

    Comment by Edwin — July 20, 2006 @ 8:36 am

  23. Thanks for the tweak i will try this on my blog Wades Pc Help Blog

    Comment by Wade — March 25, 2008 @ 1:38 pm

Leave a comment

RSS feed for comments on this post. TrackBack URI

Pages

Categories:

Other Resources

Subscribe in NewsGator Online
GeoURL