Unordered List In Sidebar

You have two options:

• Unordered List (with bullets)
  
• Unordered List (with bullets)

OR

1. Ordered list (numbered)
   
2. Ordered list (numbered)

Newbies using New Blogger template may be better off using the Link List in the Page Elements. It is easier for the lazy Blogger; however, it is more difficult to backup the Link List widget than to just backup the Page Element. You'll also have more control over it later (when you've become more informed) in a Page Element.

Before I forget, there is a third kind of list; when you just start your list items and don't specify either ordered or unordered, you will get plain bullets (or whatever your CSS specifies)

There is an even newer Blog List type of page element if you're trying to create a BlogRoll and you may find it preferable--it does a very different (and nifty) thing for you!

[More below...]

(Page Element and Gadget (or Widget) are different names for the same thing--one is more accessible to you (through the Layout page) and the other, in the template, you can go into more deeply as far as editing it IF you know how!) So I prefer the ul or ol list, whose html code I can keep backed up in a Notepad file or other plain-text program, in an html/javascript page element.

If you are using a Classic template, you will need a list of this sort for the sidebar. In a Layout template, you'd put the code in a Gadget.

Put this after or at least not inside the other ul lists in the sidebar in the template.

Below is the code for a list of links that you could use HTML to put it in your sidebar via the Classic template or into a Gadget (html/javascript Page Element)in a Layout template. First one below is an example of a link. <h2>New Category</h2> <ul> <li><a href="http://www.zandria.us/">Keep Up With Me </a> </li> <li>list another one! </li> <li>list another one! </li> </ul>

If your template uses a particular "class" for it's titles in the sidebar, just imitate (copy) them in order for your new list titles to match the old ones.

For a second list, if needed, do another title and pair of start and end tags and fill in the middle part.

For just one link in the sidebar, use code as below: <a href="http://rodentia.blogspot.com/The Rat Squeaks</a>

The difference between an unordered list as above and an ordered list which Numbers your list is merely using an ol tag instead of the ul tag!

Where To Place A Graphic For The Header

New Blogger method, easier for most

1. In Dashboard go to Layout. 2. Click Header in the Layout. 3. Have the url of the image you want to use handy. 4. Type or paste or Browse for the url into one of the two Image boxes, 5. Either an image on your computer or one already hosted on the Web. 6. You can choose to add the photo Behind the Title and Description or 7. You can Replace the Title and Description with the photo. 8. Be sure to Save Changes.

I can't emphasize how much easier the method above is!

Below is the old (Classic) method

This method still useable and ultimately more flexible (but you may be well satisfied with the first method above):

The code you'd look for to put a graphic into the header seems to come from a variety of locations in your template. It might go in the #header or #header-wrapper. The method I usually use is to locate a background url that already exists like these:

#header {
margin: 0 2%;
background-color: $headerBgColor; background:url("
http://2.bp.blogspot.com/_AVxLoZ0mR_0/Rb_W1nLeYQI/AAAAAAAAAIg/
qCR5JYhLf6o/s1600/dgblues.jpg") no-repeat bottom 10px;
color: $headerTextColor;
padding: 0;
font: $headerFont;
position: relative;
}

or

#wrap2
{background:url("xxxhttp://4.bp.blogspot.com/_AVxLoZ0mR_0/
RcNxJHiGO3I/AAAAAAAAAKA/5GfVtiwhGRE/s1600/jg2.jpg")
no-repeat center top; }

If this doesn't make anything more clear, ask again. I won't mind. But I don't know everything!

------------------------------------

It also worked for me to place an extra html/javascript page element above the header, with code like below:


<a href="http://jgblues.blogspot.com/"><img top
src="http://4.bp.blogspot.com/_AVxLoZ0mR_0/RcNxJHiGO3I/AAAAAAAAAKA/
5GfVtiwhGRE/s1600/jg2.jpg" no-repeat center/></a>

but first you'll have to go into the header widget in the template and change it so that the extra header is allowed, like this:

1. Go to Template.
2. Click on Edit Html
3. Click on Expand widget templates.
4. Locate the header widget.
5. It might look like this:
<b:section class='header' id='header' maxwidgets='1'>
6. Change the maxwidgets number to 2 or more.
7. If there's a showaddelement='no', change it to say 'yes'.
8. I don't advise removing the old header entirely unless you can otherwise preserve the title for the search engines, but if you mean to try, I understand that you'll have to change locked='yes' to 'no'.
9. Save your new template.

Some have remarked that they have no header at all, and I don't know what that's about. In new blogger, you might find a section like this, which reflects the fact above that I have the mentioned html/javascript page element added to that header.

<b:section class='header' id='header' maxwidgets='4'><b:widget id='HTML6' locked='false' title='' type='HTML'/><b:widget id='Header1' locked='true' title='JUDY GARLAND BLUES (Header)' type='Header'/></b:section>

Various statements of fact and warnings on this subject may be missing or careless at present, so beware.

Where To Place A Graphic For The Header

New Blogger method, easier for most

1. In Dashboard go to Layout. 2. Click Header in the Layout. 3. Have the url of the image you want to use handy. 4. Type or paste or Browse for the url into one of the two Image boxes, 5. Either an image on your computer or one already hosted on the Web. 6. You can choose to add the photo Behind the Title and Description or 7. You can Replace the Title and Description with the photo. 8. Be sure to Save Changes.

I can't emphasize how much easier the method above is!

Below is the old (Classic) method

This method still useable and ultimately more flexible (but you may be well satisfied with the first method above):

The code you'd look for to put a graphic into the header seems to come from a variety of locations in your template. It might go in the #header or #header-wrapper. The method I usually use is to locate a background url that already exists like these:

#header {
margin: 0 2%;
background-color: $headerBgColor; background:url("
http://2.bp.blogspot.com/_AVxLoZ0mR_0/Rb_W1nLeYQI/AAAAAAAAAIg/
qCR5JYhLf6o/s1600/dgblues.jpg") no-repeat bottom 10px;
color: $headerTextColor;
padding: 0;
font: $headerFont;
position: relative;
}

or

#wrap2
{background:url("xxxhttp://4.bp.blogspot.com/_AVxLoZ0mR_0/
RcNxJHiGO3I/AAAAAAAAAKA/5GfVtiwhGRE/s1600/jg2.jpg")
no-repeat center top; }

If this doesn't make anything more clear, ask again. I won't mind. But I don't know everything!

------------------------------------

It also worked for me to place an extra html/javascript page element above the header, with code like below:


<a href="http://jgblues.blogspot.com/"><img top
src="http://4.bp.blogspot.com/_AVxLoZ0mR_0/RcNxJHiGO3I/AAAAAAAAAKA/
5GfVtiwhGRE/s1600/jg2.jpg" no-repeat center/></a>

but first you'll have to go into the header widget in the template and change it so that the extra header is allowed, like this:

1. Go to Template.
2. Click on Edit Html
3. Click on Expand widget templates.
4. Locate the header widget.
5. It might look like this:
<b:section class='header' id='header' maxwidgets='1'>
6. Change the maxwidgets number to 2 or more.
7. If there's a showaddelement='no', change it to say 'yes'.
8. I don't advise removing the old header entirely unless you can otherwise preserve the title for the search engines, but if you mean to try, I understand that you'll have to change locked='yes' to 'no'.
9. Save your new template.

Some have remarked that they have no header at all, and I don't know what that's about. In new blogger, you might find a section like this, which reflects the fact above that I have the mentioned html/javascript page element added to that header.

<b:section class='header' id='header' maxwidgets='4'><b:widget id='HTML6' locked='false' title='' type='HTML'/><b:widget id='Header1' locked='true' title='JUDY GARLAND BLUES (Header)' type='Header'/></b:section>

Various statements of fact and warnings on this subject may be missing or careless at present, so beware.