Editing Your Blogger Design & Layout

NOTE: For information on editing and creating your blog using the Blogger in Draft, and the new Template Designer, please see this OTHER (newer) post!

Carrying on with the instructions for personalizing your blogger design, this post will explain the functions in the Layout tab.

Under the main layout tab you'll find a series of other pages: Page Elements, Fonts and Colours, Edit HTML and Pick New Template.

Page Elements

The page elements tab is where you'll find things like gadgets (other blogging platforms like wordpress call these add-ons "widgets", blogger calls them gadgets). Depending on the Blogger template you are using you will either have a "sidebar" on the left hand or right hand side, or in some cases you may have one both sides, with the post template in the middle. These instructions are for use with templates available directly through the "pick template" function in Blogger. If you've uploaded a custom template, these instructions may work the same.

In the following image you'll notice a couple of errors on the page - it doesn't say "error" but I know it is one. In the right hand column there is no "ad gadget" link at the top of the column, and there should be. If you follow the sidebar column to the bottom, you'll notice that it is cut off, with no access to any of the gadgets beneath the last HTML/Javascript gadget.


I have no idea why this occurs, but it has ocurred in my blogger account for a long time now. The way I get it to correct is to click the "view blog" link in the menu at the top of the page.


This loads the blog into the browser. In the navbar there is an option to customize your blog. If you click that, it takes you back to the layout page, but shows the correct editing functions now. This may not be necessary for everyone - many blogs seem to work properly, but if you find yours giving the same errors, try the fix I've posted.


To add different things to your sidebars, or above or below the main posting template you click the "add gadget" link for the area where you want to add that item. There are numerous gadgets available - a text box for just adding text, a link gadget for adding lists of links (in the sidebar of this blog you are reading, the menu was created using a links gadget), a picture gadget for adding pictures, an HTML/Javascript for adding things like codes (and javascripts, like adsense or others), there's even an adsense gadget.


When you click the add gadget link, a box opens with a bunch of gadgets in a list that you can scroll through and select the gadget you want to add. When you select a gadget to add, if it has parameters for you to set (like links to add, or a picture to add, colors, etc.) the gadget opens to allow you to make these entries, and when you click save, the new gadget appears in your sidebar.

Adding gadgets to your footer, below your header or at the end of the posts template works in the same way.

To make changes to your header, like replacing it with a picture or changing the title that displays, select the edit button on the header (right below the navbar). If your template allows images to display instead of (or behind) the text for your header the option will be here to upload an image, and to decide if you want it to be instead of the title, or behind the title. If you have a header image that you've already added text to, then you would want choose "instead of", but if you just have a picture and still want to see the title of your blog, then you would select "behind".

You can make changes to the colour of your navbar so that it more closely matches the colours selected for your blog, or so that it contrasts. Click the edit button on the navbar and select the choice you want for your navbar color.


Fonts and Colors

To go beyond just adding gadgets, you can set the fonts and colours in your blog by choosing the fonts and colours tab. The opens an editing box above your blog. On the left you'll see a list of the items you can change the colours for in your blog. Different template choices allow different options - some allow changing the background colours, while some don't. As you make the colour changes the results will display in your blog below. Once you are satisfied, click save.


Edit HTML

This one I'll leave til the next post.

Pick New Template

This option allows you to browse and select the standard blogger templates to preview how your blog would look before opting to change it. When you click the Pick New Template link, the templates page opens. To preview a different template, click the radio button in the one you want to see and then select the preview link below it. It will show you how your blog will look using that template.

Editing Your Blogger Settings

NOTE: For information on editing and creating your blog using the Blogger in Draft, and the new Template Designer, please see this OTHER (newer) post!

Well, as it turns out this is rather late, and most of you will already have figured out where to go and how to change your templates after you got set up.

For those that haven't - following is some simple changes to help you personalize your blog.


SETTINGS TAB

When you select the settings tab, you are first presented with the Basic changes page. Along the top of the menu bar, just below the settings tab you will see a series of other links, like Basic (the page you will be on first), Publishing, Formatting, Comments, Archiving, Site Feed, Email & Mobile, Open ID, and Permissions.


Basic

When you login to your dashboard, select the settings tab to make changes to your blog's title and description, and whether or not your blog is displayed in blog listings, or if your blog can be found by search engines, whether or not your blog is family rated or contains adult materials, and you can also select which blog editor you wish to use - the "old" one or the updated one.

You can also enable trasliterations for your blog as well - the languages covered are Hindi, Kannada, Malayalam, Tamil and Telugu.

And finally, if you decide you want to delete your blog, you can do it here on this page as well. Another helpful option here is the ability to import another blogger blog into the one you are working in. In order to do that, you would first need to export the other blog using the export function, and then selecting the exported file to import into this blog.

Publishing

The publishing page allows you to select some options for the publishing of your blog by giving you an option to point your own custom domain name (which you would need to purchase) at your blog, changing it's URL from a blogspot address to a .com, .net, .org address instead, depending on what type of domain address you purchase.

WARNING: for those of you using adsense on your blogs, this DOES NOT mean that you will need to change your ad set up to AdSense for Domains. AdSense for Domains is ONLY for domains with no website or blog - it is for an empty domain. If you change the domain settings following AdSense for Domains instructions, then your blog will disappear. Simply leave your current AdSense for Content ads on your blog.

Formatting

This page allows you to set the number of posts that will display at one time on a page. I believe the default setting is 7, which is usually too many. Most readers will not want to be confronted with that much at one time. I generally set my own to 1, but an average display runs between 3 and 5.

If you are using adsense between your posts, a good number is 2 or 3 - any more than that can affect whether or not ads will display in your sidebar since AdSense only allows 3 ad units on a page. If you set your blog to display 5 posts on a page, you may get 3 ad units between the posts, and none on the sidebar, unless some of your ads are set to link units.

On this plage you can also set the formatting for your date and time, your time zone, your blog's language, whether or not you want the title fields displayed.

Lastly, at the bottom of this page is a box that will allow you to post a line or paragraph of text or code that you want to have displayed in every single post you make. See the little "add this" bookmarking button at the top of the posts in this blog? Well the code for that is what I entered into the post template. Now, whenever I create a new post, that little bookmarking button is already at the top of each post. (by the way, you can get that great little social bookmarking button from AddThis.com, free)

Comments

This section allows you choose whether or not comments are allowed or displayed, whether you want to moderate comments or not, and whether or not you want the back links to show.

Archiving

This page allows you to set your archiving options - monthly, daily, weekly or no archive. It also allows you to set post pages. Setting post pages allows each post your make to have it's own unique webpage, so it's a good idea to do this. Whether or not you are allowed to set post pages will depend on the way you have chosen to set your comments, so you may have to move back and forth between the post page and the comments page until they are set correctly.

Site Feed

Here you can set your preferences for your site feed, and if you use another method for burning feeds, then you set the redirect url here as well. If you have a message you want to place for each post feed, there is a message box at the bottom of this page that allows you to place codes for advertising or other messages.



Email & Mobile

If you want to post to your blog via your email, or by mobile you can set up those functions on this page.

Permissions

Allows you to set permissions for your blog - who can see it, who can post it, etc. Here you can invite other authors to participate in making posts to your blog.