tweak my template thru the HTML--such as to add the second sidebar on the right. But with the Blogger Template Designer you can easily change the look of your blog with custom colors and backgrounds and layout designs and widths.
To find the designer go to the design page either thru your dashboard or the navbar at the top of your blog. Then click on the Template Designer link directly below the "design" tab. You will see your blog below a window with other templates displayed. To see your blog more fully as you make changes you can click on the "expand preview" arrow in the bottom of the window. And then to see the window again, click on "show controls." Any changes you make will not be made permanently until you click "apply to blog." If at any time you are not sure what changes you have saved and you know there are some you do not want to save, just close the page and do not save changes and go back and start again.
10 Minutes: Choose A Template
There are several templates to choose from and each one gives a unique look to the page tabs, the posts and side bar widgets. Some will have small boxes around the sidebar widgets which seem to need wide margins and tend to take up more room than some of the others. Spend several minutes trying them all out and choose the design you like best.
Do not fret about the background picture or colors at this time, those can all be changed later. But if you find a background you really like check the side bar area and post area as well as how the page tabs appear at the top and see if you like those well enough to keep that template. And you can always change some of the color options, but the picture background you will be able to keep.
It is my understanding that sites load slower if there are a lot of pictures. A picture background would fall into this, but would not slow it down as much as a repeated picture in the background—say a small icon you uploaded and set to be seen repeated in the background.
Okay, I chose Picture Window with blue sky background, but I will not be keeping the background. I like the way the tabs show up. It was either that one or the second Picture Window one, as I like the header in that one, but I plan to make a header and insert it later so I will skip that one. Once I finish designing my blog I may go back and change it, though, as I am always finding myself tweaking my blogs’ looks.
Now that you have that chosen go ahead and click apply to blog so if you start changing things and change your mind you at least have that done. If you chose a different template than mine, some of the options to edit the look may vary from what I am given and thus noting in the instructions. But most will be the same and the few that are different should be easy to apply to your blog.
10 Minutes: Change the Background
Click on “Background” on the left hand side of the window. If you would like to remove the background image click on “remove image” below the little window that shows the background image.
There are dozens if not hundreds of background images you can choose from if you like the look of a picture as a back ground. Click on the little down arrow on the right hand side of the small “background image” window and look thru those offered thru Blogger. There is also the option of uploading your own image. Click on “upload image” at the top left (above the list of categories and follow instructions).
If you would rather not have an image background you can get an idea of what different color schemes look like by clicking around the suggested themes and look them over. Choose the one closest to what you would like—these can be personalized later.
Click apply to blog and check out your blog makeover.
5 Minutes: Choose Layout and Adjust Widths of Sidbars
Move down to the Layout link. There are several to choose from and a few things to consider when choosing. I read quite a while ago that for search engine optimization it was best to have the post on the left side. Now I cannot confirm that this is true, but is something to consider or research further if you are interested in sidebars on the left of your blog. Also, the more side bars you have the narrower your posts will be.
Think thru a moment what you intend to use them for: ads, navigational purposes, fun widgets, RSS feeds, photos. As with the post area being smaller with the more side bars included, so is the size of the sidebars themselves affected.
So choose a body layout and a footer layout and click apply to blog. This, too, can be edited later.
1 Minute: Adjust Widths of Blog & Side Bars
Now click on the "Adjust widths" link. You will see Blogger Template Designer defaults to a width of 930 px. Computer screens used to be narrower than they are today and a full width of 1000 px would cause many readers to have to scroll back and forth to see the complete blog. But almost all monitors now can handle the 1000 px and many sites are beginning to go with the full 1000 px. So choose what you would like, or what looks good on your personal computer.
Now adjust the sidebar widths. Most widgets made for advertising in side bars are between 125 and 160 px wide. There are some 180, but not as many; and then there are some 300 and 336 wide which would be able to fit in the top or bottom of a blog with two sidebars together on one side as long as you have the total width of those sidebars more than that. Say you wanted two side bars side by side to hold up to two 160 px ads side by side. You have to figure in some margin that automatically is inserted between the sidebars. With the Blogger Template Designer it does not indicate how much margin is included, but it seems to default to 360 px so I assume that allows for inserting 160 px widgets.
Click apply to blog.
4 Minutes: Change Background Colors
Click on the Advanced link then click on Backgrounds. If you changed from a picture to a solid background you can change the color of it in the Outer Background option. If you have a picture as a background you can change the Header and the Post background colors.
The Blogger Template Designer gives you several options to click on to try. If you want to tweak that color further you can click on the down arrow beside the color box that is found beside HTML color number and you will be able to customize it in several different ways. If customize a color you can copy the HTML number and duplicate it in other places in your blog. Remember the changes you make will not be saved until you choose the apply to blog option.
I have read often that it is suggested to have dark lettering on a light background for your posts as that is what is easiest for the average reader. If you choose to do dark with a light background, you will need to go ahead and jump up to the Page Text link and change your text color in this lesson instead of the next so that it will show up.
Also, if the header background color you choose affects the ability to see your blog title, you may also want to change the Blog Title option before leaving this session.
So test out your colors and when you have it the way you like it, click the apply to blog option. And once again, these are not set in stone, you can come back and change them in the future.
In the next lesson we will finish up the Advanced Template Designer details. If you want to spend the time now, go ahead and work your way thru them.
No comments:
Post a Comment