Blogger Template Tricks

Immediately Go to your First Post

2006-01-26T20:33:00.000-08:00

Here is a simple blogger hack to immediately forward a user to the first post in your blog.

Put the following code between the <head> and </head> tags in your blogger template:

<blogger><Mainpage> <script language="JavaScript">  </script> </Mainpage></blogger>

3 Column Blogger Templates : The City

2005-12-23T09:58:00.000-08:00

Isnaini has a sweet 3 column template you can view or download. Very nice.

Template per Iobloggo.com

2005-12-07T20:59:00.000-08:00

"Template numero #56 per Iobloggo.comQuesto template lo trovo molto elegante oltre ad essere particolare e curato nei dettagli :�)

"

K2 for Blogger

2005-11-29T21:10:00.000-08:00

Click to see a fully functional blog
Original Design by Michael Heilemann and Chris Davis for WordPress

Beckett

2005-11-29T21:09:00.000-08:00

Click to see a fully functional blog
Original Design by Lilia Ahner for TypePad

Wedding

2005-11-29T21:08:00.000-08:00

Original Design by Lilia Ahner for TypePad

A Tiny, Subtle Shift

2005-11-29T06:41:00.000-08:00

As with anything that you do frequently, patterns emerge. Certain choices become comfortable, unrequired of a second thought. Such is the case for me when choosing colors for the web. There have been certain hex values that I'll gravitate toward: #eee, #ddd, #ccc, #999, in the grey family, for example. I know what each of these will accomplish for me and how they play with each other before a stylesheet is created. I'm sure you have your favorites and old standbys as well. I fall into using and reusing these values because they work like a trusty wrench.

But it's fun to cast those aside (at least temporarily), changing things by an extremely small measure. At times, it can mean all the difference in devising something fresh, new and different.

This happened while working on a recent project. Instead of combining my usual #eee, #ddd, and #ccc, I instead settled on combining #f5f5f5, #e5e5e5, and #d5d5d5. I know, this sounds completely trivial, doesn't it? I mean, the difference is so damn subtle, it's liable to go unnoticed by the average user, not to mention indistinguishable on varying screen types. And on top of that, they're all far from being web-safe hues. But all that aside, for me at that moment, the slightest change made all the difference in making this particular project stand on its own. A temporary step outside the familiar -- even if that step is purely the benefit of me, as the designer.

The main point here being: sometimes a tiny, subtle shift in the way you do things can be all it takes for things to seem new, exciting and right again (perhaps a micro-realignment?). This same philosophy can of course be applied to the non-web world. Just a few hours ago, Kerry and I were tossing around statements like, "we need a new house" or "we need to put on an addition". Later, we started hypothetically shifting furniture around in our minds, and suddenly there was this renewed excitement in making something old, new again. A tiny adjustment that (for the time being anyway) quenches an urge for broad, sweeping changes.

Next week? I'll be back to #eee. Maybe.

BlogSkins Skin of the Year

2005-11-29T05:42:00.000-08:00

One of my favorite BlogSkins features, like, ever is the Skins of the Day. So in continuation of that theme, and the fact that we're approaching the end of 2005, I'd like to announce an idea I've been thinking about lately: The BlogSkins Skin of the Year.

Here's how it will work:

Some time after the end of this year, I will open up voting for the best skin submitted during 2005.
I will also use the same algorithm used to pick the Skin of the Day to programmatically pick the best skin of 2005.
Both skins (the users' choice, and the computer's choice) will be given prominent awards on their skin info pages, and the contributing users will receive $50 Amazon gift certificates.
The awards displayed on the skin info pages will be designed by BlogSkins users. I will pick the best one, and the designer of it will also receive a $50 Amazon gift certificate, and a permanent acknowledgement on this site that he/she was the creator.
So, obviously there's some time left before voting begins, so why am I telling you now? The first reason is that I want to give skin contributors time to submit skins before the end of the year. The second reason is that I need designs for the awards. My only criteria for the awards design is that they be clear that they are awards (so, like, trophies or stars or something) and that they look good at large sizes and small sizes (you may design 2 different awards, one big and one small, if you like). Please send all your entries in the awards design contest to blogskinsawards@mylesgrant.com.

Any other questions, please leave them in the comments.

Template natalizio 1 Iobloggo

2005-11-29T05:40:00.000-08:00

Template Natalizio numero #1 per Iobloggo.com
Anteprima del template
Scarica il template

Blogger HOWTO: Syndication

2005-11-09T21:01:00.000-08:00

From Girl Interrupted:

So what exactly is syndication? What is this Really Simple Syndication (RSS) I keep hearing about? And how is this useful for my Blog? Whats in it for me?

Well, I'll tell you. Syndication is ... ...(as far as I understand it) a way of letting certain webpages (like Google, for example) and other incomprehensible internet machine thingies (such as information aggregation tools) know when your site (eg, your blog) has been updated. Aggregators (or newsreaders) scan these feeds, and let you know whenever the site has been updated. They're kind of like your own personalised newspaper, with everything you've chosen to read, and none of the crap (unless someone has added AdSense to their feeds, or something).

Read the rest here

Blogger Can Save Your Lost Posts!

2005-04-08T11:02:00.000-07:00

In a great move that is very appreciated, Blogger has upgraded their post-editing page with a nifty "recover post" link (see screenshot).

I used this feature last night to rescue a post I worked on for 5 minutes. I pushed POST, and it dissapeared! Clicking "Recover Post" magically brought it back. Phew!

Blogger is quick to say "This feature is not guaranteed to work every time you lose a post, but it's always worth a shot."

Beyond that, you can read more about Blogger's Recover Post feature.

Filed Under: blogger updates cool web public blog

Hack: Google from your site

2005-04-04T21:23:00.000-07:00

Point-N-Click has a page where you can copy some code to allow you to Google Search from your own website (or allow your visitors to search on their own).

Click here to get the code for this hack.

Notes:

If you adjust the number in the size="25" attribute of the <input type="text"... tag, then it will make the text box smaller (less width). The maxlength attribute should stay where it is. Having these two set differently allows you to type a lot of text into a small textbox.
See the Point-N-Click homepage to see how this has also been reworked into the small right-hand column of the site.

Next Post Hack

2005-04-04T21:04:00.000-07:00

Movable Type & other templates allow you to have a link bar across the top and bottom of link posts with links to the previous item and the next item in your blog, by title.

You can do this in Blogger now, too. While hacking the Kubrick template for Point-N-Click, Michael Heilemann included this very cool hack.

Code:

 <itempage><div align="center">« <a href="<$BlogURL$>">Home</a> <BloggerPreviousItems> | <a href="<$BlogItemPermalinkURL$>">Next: <$BlogPreviousItemTitle$></a> »</div><div style="display:none"></BloggerPreviousItems></div></itempage>

Notes:

This line of code must be outside the Blogger tags. If you have to, close the Blogger tag (</Blogger&rt;), paste the code in, then reopen the Blogger tag.
Right now, this will only show up on Post Pages, the pages of your individual items. To show on all pages, remove the <itempage> and </itempage> tags.
It seems the best place for this is at the top of the posts on the page. In most Blogger templates, just before the Blogger tag is opened the first time is usually great!

Stats Hack: Show your page stats

2005-04-04T20:51:00.000-07:00

Use this hack, combined with StatCounter's free website stats application to graphically show your page stats on a website of your choice. See an example on this page.

Using this hack?
Please leave a comment to this post with your website URL

To use:
Copy the following code to your website, editing the first two variables (see comments in the code for details.
Note: Please keep the web friendly--if you use this hack, link back to this post!

Click the "Read More" link, below, to see the code:


<script language="JavaScript">
<!--
//++++++++++++++++++++++++++++++++++++ STATS HACK +++++++++++++++++++++++++++++++++++++
//
//     written by Robert Merrill
// http://point-n-click.blogspot.com/2005/01/statshack-show-your-page-stats.html
//
// This code is provided free of charge and without support, warranty, and liability
// Please keep reference intact, pointing users to http://point-n-click.blogspot.com/2005/01/statshack-show-your-page-stats.html
//
// To scroll users to the graph on your page, use the code: <a href="#seeStats">See page statistics</a>
//
//++++++++++++++++++++++++++++++++++++ STATS HACK +++++++++++++++++++++++++++++++++++++
//Step One: What is your STATCOUNTER Project ID Number?  Default is '513981', the ProjectID for http://point-n-click.blogspot.com
scProjectId = 513981

//Step Two: How many DAYS of stats do you want to show? Default is 15
scNumDays = 15

//Step Three: Sit back and watch your stats graph appear on the page
ed = new Date();
bd = new Date(ed.getFullYear(),ed.getMonth(),ed.getDate()-scNumDays)
bdStr = bd.getFullYear() + '-' + (bd.getMonth()+ 1) + '-' + bd.getDate();
edStr = ed.getFullYear() + '-' + (ed.getMonth()+ 1) + '-' + ed.getDate();
document.write('<a name="seeStats"></a><span class="siteStatisticsGraph">Our statistics for the last ' + scNumDays + ' days:<br>')
document.write('<a href="http://my.statcounter.com/project/standard/stats.php?project_id=' + scProjectId + '&guest=1">')
document.write('<img border="0" src="http://my.statcounter.com/project/standard/graph_daily_summary.php?hide_page_loads=0&project_id=' + scProjectId + '&startDate=' + bdStr + '&endDate=' + edStr + '&guest=1">')
document.write('</a><br> StatsHack provided by <a href="http://point-n-click.blogspot.com/2005/01/statshack-show-your-page-stats.html">Point-N-Click</a></span>')
//++++++++++++++++++++++++++++++++++ END STATS HACK +++++++++++++++++++++++++++++++++++++
//-->
</script>

Code conversion powered by SimpleCode

Got Hacks?

2005-04-03T20:35:00.000-07:00

If you'd like to join us here and post hacks along with us, I can add you as a writer to our blog. Just show me whatcha got. Post a comment here...

Template Tricks

2005-04-03T20:06:00.000-07:00

This blog is for all the sweet Blogger template tricks, hacks and hints I've found over time since I began using Blogger. I'll share some smart linking ideas, javascript, html, and more.

Please post a comment to the Wishlist if you are looking for something specific.

And, please remember that this is linkware... it won't cost you anything but a few kilobytes. Just link back to this site, templatetricks.blogspot.com if you use any of these ideas. It's only fair. Besides, if you link to me, I will link to you! And, if your site is interesting to me, I will add you to my newsgator and then the whole world will know about you.

Wishlist

2005-04-03T20:01:00.000-07:00

Wanna know something? Post a comment here and we'll ~~all laugh at you~~ see what we can do about it.