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://bp1.blogger.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://bp3.blogger.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://bp3.blogger.com/_AVxLoZ0mR_0/RcNxJHiGO3I/AAAAAAAAAKA/%205GfVtiwhGRE/s1600/jg2.jpg" 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:

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" type="'Header'/"></b:widget>

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

Read More...

Summary only...

Page Elements--Html/Javascript & Text

The Html/Javascript Page Element Is Better!

At first I chose some Text Page Elements for my information at the top of the blog, but I have since changed it to an HTML/JAVASCRIPT Page Element. For some reason, both require line breaks in order to separate the text into paragraphs. Fair enough, I can do that. But the Text element loses those line breaks every time you return to do some editing, and that's crappy.

So if you had paragraphs or any kind of one-line-at-a-time "grocery list", you'd have to revamp the post to restore it to what you started with! Not hard, just time-consuming!

Text page elements are only good for a straightforward paragraph of information or for some other kind of information that you don't have to edit often.

In the HTML page element, nothing changes or is lost, and you can just edit what you meant to without a lot of special revamping. This is important to a ceaseless reviser like me--I often re-edit!

It is misleading to all users that we are able to put HTML into a Text page element when it's so problematic to do so! And there should have been a warning about this difficulty with making paragraphs. Anyway, fair warning from me!

Read More...

Summary only...