Unordered List
Newbies using New Blogger template may be better off using the Link List in the Page Elements. It is easier; however, it is more difficult to backup the Link List widget than to just backup the Page Element.
(Page Element and Widget are different names for the same thing--one is more accssible 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 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.
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 put in your sidebar via the template. The code could also be used in a html/javascript Page Element (in New Blogger). First one 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>list another one!
</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!
Wednesday, May 20, 2009
Unordered List In Sidebar
Tuesday, May 5, 2009
Find Width of Header For New Image
Header Width
This will tell you places to look for the width of your header. The image you want to place there should not exceed that. You should use a photo program to alter the width of your image BEFORE you upload it to your photo host (whether Blogger or otherwise).
To find the width of the header
1. Click Template
2. Click Edit Html
3. Scroll down to the header,header-wrapper, or wrap code and look for the WIDTH parameter.
4. If not found, look for outer-wrapper and see it's width. It will look something like this :
#outer-wrapper {
width: 1000px;
}
Or you could adjust the same WIDTH in the template CSS
If you are unwilling to fuss with making your photo width match the width of the header, you could try this. You might find some code like the one above or this one below showing the #wrap; change the width of 100px to 900, 850, or so until it begins to look acceptable to you. Don't Save until then. If your photo just wasn't nearly wide enough, it may still look odd (short) to some eyes. Actually adjusting the width of your image in a photo program would then be the better choice.
Another possible location of header width:
#wrap {
margin: 10px auto 0px;
padding: 0px 5px;
width: 900px;
text-align:left;
}
END.
To find the width of the header
1. Click Template
2. Click Edit Html
3. Scroll down to the header,header-wrapper, or wrap code and look for the WIDTH parameter.
4. If not found, look for outer-wrapper and see it's width. It will look something like this :
#outer-wrapper {
width: 1000px;
}
Or you could adjust the same WIDTH in the template CSS
If you are unwilling to fuss with making your photo width match the width of the header, you could try this. You might find some code like the one above or this one below showing the #wrap; change the width of 100px to 900, 850, or so until it begins to look acceptable to you. Don't Save until then. If your photo just wasn't nearly wide enough, it may still look odd (short) to some eyes. Actually adjusting the width of your image in a photo program would then be the better choice.
Another possible location of header width:
#wrap {
margin: 10px auto 0px;
padding: 0px 5px;
width: 900px;
text-align:left;
}
END.
Subscribe to:
Posts (Atom)
