Wednesday, April 11, 2007

Uploading and manipulating images Part 2

0 comments
I have published a previous post on Uploading and manipulating images in Blogger (click "BACK" button to get back to this page). This will describe using the <img> tag to display images.

First you will have to host your images on the web. This can be done by creating and uploading your images to a Google Groups, or getting New Blogger to host your images (click "BACK" button to get back to this page), or use a third party free photo host like Photobucket. Once you have uploaded your image to the web, you will have to get the URL of the image ready.

This post will describe getting the image in the midst of the text.

A town called Kuching (cat) in the Borneo Island.

A town called Kuching (cat) in the Borneo Island.

A town called Kuching (cat) in the Borneo Island.

The above images was displayed by typing the following HTML in the middle of the text as shown below:

A town called Kuching <img src="photo URL" align="bottom" width="48"> (cat) in the Borneo Island.

A town called Kuching <img src ="photo URL" align="middle" width="48"> (cat) in the Borneo Island.

A town called Kuching <img src ="photo URL" align="top" width="48"> (cat) in the Borneo Island.

Note that the attribute height="W" has been left out of the <img> tag. The width is automatically adjusted to keep the aspect ratio constant so that the image is not distorted. Also, the default is align="bottom" and if you want this alignment, you can actually leave out that attribute as done below, where I display images in the beginning, the middle and the end of text:

A town called Kuching (cat) in the Borneo Island.

A town called Kuching (cat) in the Borneo Island.

A town called Kuching (cat) in the Borneo Island

The above was produced by typing the following text and HTML tag as follows:

<img src="photo URL" width="48"> A town called Kuching (cat) in the Borneo Island.

A town called Kuching <img src="Photo URL" width="48"> (cat) in the Borneo Island.

A town called Kuching (cat) in the Borneo Island <img src="Photo URL" width="48">

Note that the attribute align="bottom" has been left out in the <img> tag.

Update 17 April 2007: When I checked the post, the images were blank box, although when I first made the post, the images appeared fine. This perhaps was because the photo was uploaded to a private Google group. I thus reupload the photo to a blog specially created for uploading photos - My Photostore - More Cats in town, clicked on the image, and in the page containing only the photo, click VIEW > PAGE SOURCE and copied the real photo URL from the page source and replaced all the photo URL in the post. The image shoudl appear fine now.

Leave a Reply

Related Posts Plugin for WordPress, Blogger...