Add a series of photos in blog footer

A

reader asked how to put the profile photos of each author in a blog footer. That require a long answer, so I will answer in a post. Actually, the method described can be applied to the Header as well as the footer. You just click the right Add a Page Element in the right section in the LAYOUT.

I will proceed to explain how I put a series of 4 photos in the footer of My photo store. The first thing I did was to find out what is the width of the footer, and to do that, I click the TEMPLATE tab, then the EDIT HTML sub-tab to open the template editor window. I search and found this:

#footer {
width:660px;

That tells me the width of the footer is 660 pixels wide. I plan to put a series of 4 photos in the footer. 660 divided by 4 gives me 165. There are 2 ways to proceed, I will use the method that conserve storage space for my Blogger account and describe a slightly different method later. I will first resize the photos to width 160 using Irfanview (click BACK button to get back to this page). I then uploaded the photos to Photos for footer. I clicked on the photo one by one to get to the webpage that shows only the photo, and for each photo, I click VIEW in the menu bar and chose "View source". I copied the URL of the photo from the source and paste it into a

Notepad file for later use. After getting the URLs of all the 4 photos, I then proceeded to the next step.

I clicked the TEMPLATE tab to get to the LAYOUT, click "Add a Page Element" in the footer section (if you want it in the Header, you will click "Add a Page Element" in the Header section), chose HTML/Javascript, then type this HTML for a table:

td>

The actual HTML I used to display the series of 4 photos in the footer in My photo store I give in the scroll box below:

You will have to adjust the method described according to the number of photos you plan to put in the footer.

As promised, I will now described briefly an alternative method with will take up more Blogger storage space. You can upload the photos in its actual size, them for the tag, write the tag as follows:

. Of course, if your footer width and/or the number of photos you want to put is different from mine, you will have to adjust the width="W" according.

Display images in larger sizes

"why is it that my images are big but when i upload them they become so small?"

When you use Blogger's photo upload icon to display images, you can chose 3 different default sizes - large, medium and small. If your image is very large, Blogger will shrink it to a smaller size for display. However, if you are in the COMPOSE mode, you can use your mouse to grab the edge or the side and drag-drop it to create a displayed image that can be larger or smaller than the default.

Alternatively, you can use the HTML image tag to display it in the original size or use that tag with a width attribute to display it in whatever size you choose.