Here is a pale blue version of the recent Web 2.0 style templates I have created. This version is called "Cool Blue" and features muted blue tones for an eye-pleasing theme suitable for many types of blog. This template also includes many advanced features, such as the three footer columns and calendar widget. You can see the screenshot to the right (click for full-sized preview), or read on for further details and download information.
As the title suggests, this template has a pale blue theme. It features a clean and simple layout, and very few images. Combined with a small javascript, this ensures the blog loads very quickly, and is able to deliver powerful new features which are not available in other templates I have created.
These features include:
- Fast page loading time
- Themed favicon already in place (see top left of the address bar)
- Integrated blog search form
- Web 2.0 style logo
- Navigation bar (which can be customized to suit your needs)
- Calendar widget
- Unique wide sidebar layout, featuring a combination of wide and dual narrow columns
- Three widgets available in the footer section
- Unique post footer sections, which include a "What next" section for email post links, social bookmarking and "add a comment"
- Related posts section also in post footer, to link to posts of the same label
- Author comment highlighting on post pages
- Rounded corners achieved by CSS instead of images
You can see the template in action on the Cool Blue Web 2.0 Template demonstration blog. Please do take a look at the post pages to see how the post footer sections work too.
Download this template
You can either download the full zip file for this template, which includes the XML template, plus all images and a help file, or copy and paste the code further down this page into the "edit HTML" section of your Blogger dashboard.
Download Cool Blue Web 2.0 Template (Zip folder)
This download contains the XML file for you to upload to your blog, plus a help file and all images that are used in the template.
Template code to copy and paste into the Edit HTML section of your Blogger dashboard:
All images for this template are hosted by Blogger Buster, though if you prefer to have control over these images you can upload these to your own image host and edit the template accordingly.
How to set up this template
This template will work without much modification, though there are two things you may want to change:
- The calendar widget
This widget parses your date header to display the calendar icon. To ensure this works properly, you will need to change the settings for your date-header format in the Settings>Formatting section of your Blogger dashboard. The date header needs to be in yyyy-mm-dd format, like the example below:
It is only necessary to change this one setting, then everything else in this template should work just fine! - The navigation bar
This is set up to feature links to your blog's home page (Home), an "about" page (About) and a contact page or link (Contact). In the default installation, I have been able to set up the "Home" link which points to your blog's front page. However, you will need to set up links to your About and Contact pages manually. You can also choose to change these links or add more links as required.
The navigation bar is highlighted with comments in the template, and looks like this:<!-- This is the navbar section which you can edit to include your own links -->
Simply change the "#" for the links to point to your own posts/web pages, or copy the link style to create new links instead.
<div style='height: 40px; padding: 10px 0 0 0; margin: 3px 0 0 0;'>
<!-- Home Page Link -->
<a class='nav-section' expr:href='data:blog.url' style='color: #fff; text-decoration: none;'>Home</a>
<!-- About link add your link here -->
<a class='nav-section' href='#' style='color: #fff; text-decoration: none;'>About</a>
<!-- Contact link add your link here -->
<a class='nav-section' href='#' style='color: #fff; text-decoration: none;'>Contact</a></div>
<!-- End navbar section -->
Using this template
This template is free to use, and you may customize the template in any way you wish. However, I do ask that the author details remain in the template itself, and that you do not redistribute this template without a link back to Blogger Buster. A link back to Blogger Buster is always appreciated!
I love the template and uploaded it to my blog, but I cannot not only get the calendar widget to work, but I cannot get dates to show up for any posts. I did change the date format as you suggest, but it did not fix the problem. Any suggestions to get post dates appearing?
ReplyDeleteNever mind - figured out the problem. But for anyone else having this problem, you have to have the date checked under the "Configure Blog Posts" options, which you access through "Page Elements" under "Template"
ReplyDeleteThanks for pointing this out, Jon! I'd overlooked this option when explaining how to use these recent templates (which I will of course edit shortly). I'm glad this works okay for you now.
ReplyDeleteBest wishes,
Amanda
Amanda,
ReplyDeleteI am using this blue template.Now i want to publish the post in the way you do i.e. half post only on the main page and we have to click on the article to view the full post.So what editings i have to do in my blog or what i have to do to publish the article like that.
Hello Tia,
ReplyDeleteI use the "Selective expandable posts" hack which was developed by Ramani of Hackosphere, which you can read about in this post.
Hope this helps! Feel free to email me if you need any help installing this in your blog.
Best wishes,
Amanda
Okay, I have another question about the calendar widget on this template. Now, the widgetized date is only showing up on the top post on the main page of my blog. The rest of the posts on the main page show up with a date as "yyyy-mm-dd". On other pages -- post pages, archived pages, etc. -- it shows up as it's supposed to on some but not others. Very strange. Any idea what could be causing this?
ReplyDeleteThanks. Great site. Very useful.
Hello Jon,
ReplyDeleteI noticed that you have quite a lot of posts on your front and archive pages and suspect that this may be the problem. On your labels pages (especially where there are fewer posts) the calendar always shows up fine.
As far as I can tell, there is nothing in the javascripts used for the widget which would prevent the calendar from loading many times in the same page. If you can make a smaller limit to the number of posts displayed on the main page (in Settings>Archining), you should be able to ensure the calendar shows up wherever it is called.
Just to confirm though, only the most recent post made on a given day will feature the calendar widget, while other posts from the same day will only feature the time the post was made. This is also true when using a regular date-header, and cannot be changed in the template at all.
Hope this helps clear things up for you!
Best wishes,
Amanda
I keep gettin this message:
ReplyDeleteYour template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The document type declaration for root element type "html" must end with '>'.
What am I doing wrong???
Hi, I really want to download this and try it out. The template code says "Service Temporarily Unavailable". This isn't something wrong on my end? Can you let me know if this will be up soon.
ReplyDeleteThanks:)
I really like the way the footer and split sidebar are configured...I sure would like to do it with my blog...
Hi, I've just started a new blogger blog. I already made one post with blogger template. I want to change it with your cool blue web. But everytime I upload the code or paste it on my edit html, then save the template,there's always this message of "Please confirm that the following widgets should be deleted. All the widgets' configuration data will be lost.
ReplyDelete* BlogArchive2
* AdSense1
then when I click the confirm button. It always shows this message of unable to complete the request and have this code bX-bliced. Can you tell me my error?
Comments Posting option is not working on my blog. Can u please tell me whats wrong.
ReplyDeleteHow come when I upload a downloaded web design template, the website has no style when published?
ReplyDeleteI am thoroughly convinced in this said post. I am currently searching for ways in which I could enhance my knowledge in this said topic you have posted here. It does help me a lot knowing that you have shared this information here freely. I love the way the people here interact and shared their opinions too. I would love to track your future posts pertaining to the said topic we are able to read.
ReplyDeleteThanks for taking the time to discuss this, I feel strongly about information and love learning more on this. If possible, as you gain expertise, It is extremely helpful for me. would you mind updating your blog with more information
ReplyDeleteThanks to share with us the information. I wish you good luck!
ReplyDelete