Blogger Templates

I took sometimes and betafied another template!


This is the K2 template, as most people probably know, distributed by Geck & Fly; now it supports blogger widgets & labels as well! This template is quite beautiful, so hopefully as soon as I hear back from the Geckofly people, everyone will be able to get the code from Blogcrowds :D

In beta, blogger replaced the once elegant Scribe font used for labels with a more generic font. However, not to worry, find out more about the font used in original blogger here at Blogcrowds

Blogcrowds.com has been offering free blog templates, notably 3 column blogger beta templates, to many bloggers out there. Today, we have decide to implement a new way to distribute these template.

Before, bloggers had to post requests under Customize Template forum and recieve the templates via email. Now, most of the available templates are posted under Template Code where, if you are registered, you can simply view or copy and paste these templates. However if you need more customization, please still post requests under Customize Template forum.

Thanks

The new Blogger is built around their new widgets. Widgets makes managing long list of links, profile, layout of your template etc easier with no HTML knowledge required. Widgets also make the template code much cleaner by saving all the necessary code on Blogger servers. However, this does present a problem if you constantly change your template like I do as simply backing up your template won't work if the widgets are deleted on the Blogger server. Many people re-populate their entire link list manually, fortunately, there is a way of saving your Widgets.


What Not To Do
The trick of course to saving your Widgets of course is never delete them, which means do not use the upload button in your Beta Template section and if you ever see the scary warning that Widget are about to be deleted, cancel whatever you did immediately.




The Correct Way
So, if you can't upload your template straight into Beta what should you do?

1) Make sure you template is in Expanded Widget mode.

2) Find your widgets and copy them from the to the very next , put it in your text editor or something for use later. Make sure you get all your widgets, you don't need to copy your header or body widgets as they are suppose to be universal across all templates



3) Open the template you want to switch to and delete your old template (back it up first if needed) and paste your new template into the edit HTML section

4) Find where you want to put the widgets, most commonly sidebars, and paste the widget code you had earlier between the and , this is very important.

5) Preview your template to make sure everything look good, save it and you are done!


I know this is probably a lot more work than you would do otherwise, but it save a lot of time if you have to type all your links over again.

Thanks, hope its helpful, article also mirrored here

Sidebar sliding to the bottom of the page is probably the biggest problem bloggers have with layout coding. This problem usually occur when an image or link is taking up more room than its suppose to; without enough space, the sidebar slide down the page. So, to solve this problem, usually people would recommend finding out which image or link is causing the problem and
remove it. However, there are two CSS methods that could solve this problem and they may be easier than going through a huge amount of content to find an image or a link.


Method One: Word Break

word-wrap: break-word;

add the above to the container, usually main content and sidebar column

This method is used in all blogger beta templates, as it suggests and as commented in the templates it "fix for long text breaking sidebar float in IE". It will break long text and links, but it won't work on images.


Method Two: Overflow

overflow:auto;

or

overflow:hidden;

add the above using either option auto or hidden to the container, usually main content and sidebar column

This property controls how overflows are rendered in a web browser for all overflowing content, link, images, and anything else. With first option auto, if anything is larger than its container, the container itself won't expand, however a scroll will appear in the container so if want to see the
entire image or link, you can scroll across as you can see in the second post at Blogcrowds Forum. The second option hidden, will tell the browser not render anything overflowing its container so part of the image or link will be cut off.