2007-10-13

Girly Web 2.0 style template

I have just finished work on a new girly template which has a simple "Web 2.0" style, but also includes many advanced features you won't find on other Blogger templates. The screenshot of this template is on the right, and you can read on for full details and download information.






As the title suggests, this template has a feminine pink theme (don't worry guys, both a blue and dark version are in the pipeline and will be available soon). 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

Plus a few other features too!

You can see the template in action on the Girly 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 Girly 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 -->



    <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 -->

    Simply change the "#" for the links to point to your own posts/web pages, or copy the link style to create new links instead.

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!

Technorati Tags: | | | | | |



View blog reactions

Post a Comment 12 comments:

14 October 2007 at 12:01 Alex said...

Hey Amanda,

I just sent you another email asking which is better godaddy or just use blogger.com for a domain. Thanks!
-Alex-

2 November 2007 at 08:48 Tia Jindal said...

Amanda,

Can u plz tell me how to introduce adsense search in this template search option which is given at the header of the template.

Btw Thanks 4 that Iframe help , it was indeed very useful.

13 November 2007 at 23:26 Kitty Cat ♥ said...

heyy.. can i have more dark templates?

30 December 2007 at 23:07 T.G said...

hi there.I love this themes.I am using it currently in this blog
Entertainment source411.Take a look. I've adjusted it nicely.
http://entertainmentsource411.blogspot.com/

17 January 2008 at 12:36 Christine said...

I used this template...LOVE It. I've switched out some things and am working on a new header (the one I put on there needs an overhaul). It was so easy and had everything I was looking for and more! Thank you!!!

24 January 2008 at 23:04 GSL SEO Analyst said...

Thats simply awesome...

31 July 2008 at 10:42 Anonymous said...

I love the layout, but I can't get the calander to display right.

The number pops up, but there's no calander icon around it! Can you help??

24 June 2009 at 07:43 Admin said...

Hi there.I love this themes.I am using it currently my blog
sms .Take a look. I've adjusted it nicely. Nice colors.
http://vejsms.blogspot.com/

15 May 2010 at 01:40 Reverse Phone Lookup said...

Nice information! Your content unique and meaningful about it. You doing very well job!

Reverse Phone Lookup

28 September 2010 at 08:40 Apply Today For Online personal Loans very Fast said...

great things happens only is this world and here it the real example of that reverse phone directory

1 October 2010 at 03:27 Unknown said...

well, google it great ,how easily I can find my relevant info
watch tv on computer

1 October 2010 at 03:29 Unknown said...

you are superb ...really ...thanks for this great blog

get six pack abs