Blogger 4 Newbies

This should be I think a part of answers for the most FAQ on GIMME BLOG!

How to use yourname.Com SubDomain on your Blogspot / Blogger Blog.

Take a look at this pictures below, click on thumnails to see the actual size

1. Go to your Dashboard -> Setting -> Publishing

Thick the Custom Domain.

2. Click The Switch To Advanced Setting

3. Now Type YourName.JackBook.Com Subdomain

This is an automatic system. So as long as your requested name is still available, (not taken yet by the other) then you will be able to use it. Don’t forget to read The TOS

After you clicked the Save Setting button, the option to redirect www to non www will be active.
example: www.yourname.jackbook.com will be redirected to yourname.jackbook.com.

4. Thick that option to activate it.

Save it again, and now you are done.

Read full post >>

Blogger Template Design: Tutorial 12

If you look at these templates - Lasik, JournallRed, and Minimalizt - you'd notice that the background is not of a plain color, but made from a repeating pattern of an image. This image is called a background image. It can be a single large image that fills up the screen or a small image (say 50 x 50 pixels) that repeats horizontally and/or vertically. The neat thing about using, or embedding, a background image is that you can create any image you like and use it in your blog to make it unique and different from other blogs.

A background image can be placed in any container - either inside the Body container (which fills up the entire screen), inside the Post, Sidebar, Comment, or even on a header container (say, a Comment Header). For example, if you look at the Minimalizt template, you'll see that the Comment Header below the post is a rounded green button - which is an image embedded inside the Comment Header.

You can also use an image to create a shadowy-looking side frame (now quite common in blogs). See the Hazy template to see how it looks. To do this, you create a short background image with a long span that fills the whole width of the template. At the right and left edge of the background image, you create the shadowy pattern (or any other pattern that you want to be the frame), and embed this inside the outer-wrapper container, repeating it vertically.

But, how to embed and how to repeat the image vertically, horizontally, or both in directions?


To Embed Background Image:

Say that you want to use a 100 x 100 pixels image as the background image inside the Sidebar1 container. What you need to do is find the sidebar1 {...} container in CSS Styling and add the following code in red (the other codes are just sample codes):

#sidebar1 {
margin: 0px 10px 15px 10px;
padding: 0 0 0 0;
width: 150px;
background: URL(http://the-url-of-your-image) repeat left top;
text-align: left;
}

The "background:..." code will embed whatever image at whatever URL you put and repeat the pattern both vertically and horizontally. The location of the starting image will be on the left-most side, and at the top-most position. The general command for embedding a background image is:

background: URL(http://...) repeat-command x-position y-position;


All Repeat Command:

• no-repeat (the image won't be repeated at all)
• repeat (repeat horizontally and vertically)
• repeat-x (only repeats horizontally)
• repeat-y (only repeats vertically)

All Horizontal (x) Position Command:

• left (puts the starting image on the left-most side)
• center (puts the starting image at the center)
• right (puts the starting image on the right-most side)

All Vertical (y) Position Command:

• top (puts the starting image on the top-most position)
• center (puts the starting image at the center)
• bottom (puts the starting image on the bottom-most position)

Read full post >>

Before you start changing your template, make sure you save your old template file just in case you need to start again. And make sure you have a programming-based text editor installed on your computer (to make the codes easier to see. If you don't have one, there are many free programming text editors that you can download. I use Notepad++).

These are some instructions on how to put the template in your blog. There are some ways to do it; I'll explain some of them, starting from the simplest methods.

For tips to improve template usage and common problems faced when installing these templates, read this post, or here if you fail to upload template.


METHODS TO INSTALL BLOGGER TEMPLATES:

Method I. Simplest method - Uploading the xml file:

1. Download the template that you want and save it in your computer (make sure it is saved as xml file).
   
2. Go to your Layout > Template > Edit HTML page.
3. Choose the file from the Browse... button, and then press the Upload button.
4. It may ask you to delete some widgets - so just delete them. (Widgets are the extra page element added to the sidebars).
   
5. You're done! View your new blog.
   
6. If your contents doesn't look aligned, that's probably because you don't have any widget on one of the sidebars - so add your widgets.

Method II. Copy-paste the template codes into the Blogger text editor:

If you don't want to download the file first, or prefer to paste the code into your Blogger editor, this is how to do it.

1. Open the template file that you want and copy all the codes.
2. Got to your Layout > Template > Edit HTML page.
3. Click the Expand Widget Templates (EWT) button. (If the EWT button is on or clicked, all template codes will be visible; if it's off or unclicked, then some codes related to Blogger Data are hidden so that the HTML codes look less messy - most of the time, you don't want to change or add codes inside the Blogger Data area).
   
4. Select all the codes in your Blogger editor and delete them all. Then paste the codes for your new template.
5. It may ask you to delete some widgets - so just delete them. (Widgets are the extra page element added to the sidebars).
6. You're done! View your new blog.
   
7. If your contents doesn't look aligned, that's probably because you don't have any widget on one of the sidebars - so add your widgets.

Method III. Copy-paste the CSS styling only into the template code:

The annoying part about using the two methods above is that you have to delete some widgets that you've made (maybe some Adsense codes, Text contents, HTML codes - usually the widgets About Me, Labels, and Blog Archives are not deleted). If you don't want this to happen, you must copy and paste the CSS styling part only. By changing the CSS part only, you don't change anything related to the Blogger Data including the data about the widgets that you've made.

CSS styling is the code that controls everything about the template style or appearance - the font size, colors, background images, header size, post layout, sidebar size and locations, etc.

But to do this is a bit tricky. You have to make sure the basic layout of your old template with the new one is the same. For example, if the old template has 3 columns (2 sidebars and 1 main), your new template has to be 3 columns too. The arrangement of columns will follow the old template; for example SMS or MSS or SSM. If the old and new templates don't have the same content layout, it won't work! If you're not sure about this, just use the first 2 methods above.

If you still want to change the CSS styling part only, read on below.

In the template, look for the code section in between the b:skin tags. In my templates, I've labeled the start and end of the CSS styling part. (In the code, the 'Page structure tweaks' code are actually part of the CSS styling too, but just leave it there.)

So, these are what you need to do to change the CSS part only:

1. Open the template file that you want and copy the CSS styling code only.
2. Got to your Layout > Template > Edit HTML page.
3. Don't click the Expand Widget Templates (EWT) button because you don't have to change the Blogger Data code.
   
4. Select the existing CSS styling codes in your Blogger editor and delete them. Then paste the codes for your new template.
5. It may ask you to delete some widgets - so just delete them. (Widgets are the extra page element added to the sidebars).
6. You're done! View your new blog.
7. If it doesn't work, you can always use the first 2 methods above and add the widgets later.

Read full post >>

Here are some tips you can use to improve reliability on using these templates and some problems you might encounter when installing and how to solve them.

Tips on using background images:
The background images (images of the header, main background, content background, title bar, list background, etc) are stored in my flickr account. I can't guarantee the reliability on fetching these images all the time. So I suggest that you upload the images for a particular template that you're using and store them somewhere else. Simply get the image URLs from the xml code and change the URLs in the code (in red) to point to the new address of the images.

Example of code:
background: #000000 URL(http://...........) repeat left top;

Check all URLs in the CSS styling section and not just the first one you see in the code.

Caution with Header section alignment:
If your Header section look misaligned the first time you upload any template into your blog, that's probably because your Header Title and Description is too long and wrapped into a second line. If this is the case, shorten them or make them smaller. If not, it might be that your Linkbar is empty or your own uploaded header image size is wrong.

Caution with uploading your own Header image:
When you upload your own header image from the Header Layout page, the whole section or some part of it can be misaligned or cut off if your image is not compatible (having the right size) with the template. Read here for more details.

Caution with Linkbar: If you use any template with linkbar, the Header section might look weird and cutoff the first time you upload it into your blog. It's because your linkbar is empty (without any links yet). So fill up you links and the Header section will turn to normal again.

When Blogger can't save your new template:
If Blogger can't save the template because there are more than one IDs (for example ID for LinkList, HTML, Adsense, etc), simply go back to your old template and delete all widgets (also called page elements) except the basic ones (like About Me, Labels, and Blog Archives) and reinstall the template. You can later add the widgets back on.

Read also some other common template problems if you fail to upload template.

Report your problems here:
If you face some new problems when installing my templates or if you want to share some tips, put your questions or tips in the Comment section. I'll try to answer them as soon as I can.

Read full post >>

This happened to me just now when I tried to upload my own template using Firefox browser. I got an error message from Blogger.

But it worked fine when I uploaded the template using Internet Explorer browser. So if you have the same problem on Firefox when uploading these templates, try using the Internet Explorer. I don't really know why, but as long as it worked, that's all that matters.

To download internet explorer or firefox try soft-generation.blogspot.com

Read full post >>

How to make header image which " not like a box" and looked to be one with entire of your blog ?

Easy! Use your ordinary program image editing. I’m using macromedia fireworks for image editing. Determine canvas size measure according to asked header image. Make rectangle with rounder model at its corner. Set its high larger ones from size measure canvas. and set its width = wide of canvas

Place tabletop of rectangle at co-ordinate (0.0), so that its obtuse angle presented at part of canvas. Thereby the bottom-part of rectangle is not displayed at canvas

Set of canvas color = color of background page of your blog, so that the part cut by corner of image will look one

Export your result job!

Read full post >>