This post is here to assist a friend with some basic image formatting inside of bloggers interface but is also just basic HTML that can be used anywhere HTML serves a purpose. I have inserted the punk rock image below the "insert image" link in the toolbar and then uploaded it from my computer. Notice that when you hover your mouse over the top of the image nothing happens.If you click the "Edit HTML" tab
you will see all the crap that your browser reads to make your post look pretty for your readers. Once you are on that tab you will need to find the image that you want to add a description for.
An image tag opens with a "<img " and closes with a "/>" Everything else between the open and the close tells your browser how to treat the image.
Example:
in the image to the right you see where I have highlighted the entire image tag. There is a (border="0"), (height="320"), (src="location of file on the web"), (width="244").
What we are missing that would be very helpful in some blog posts is the (title="description of the image") tag, where everything between the "" is the description of the image. To add the title tag all you have to do is click in the line and add the tag just like you see in the picture below.
Once this is done you can see the description is now available when you hold you mouse of the image just like the image below.
Hopefully that wasn't too confusing and actually helped someone. One thing you will notice is that Blogger's WYSIWYG (What you see is what you get) editor likes to add tags and rearrange everything almost every time you click back and forth from the "Compose" to the "Edit HTML" tabs. Because of this you might want to go ahead and create your entire blog entry then add all your title="" tags and then verify the layout of your page before posting the blog.
you will see all the crap that your browser reads to make your post look pretty for your readers. Once you are on that tab you will need to find the image that you want to add a description for.An image tag opens with a "<img " and closes with a "/>" Everything else between the open and the close tells your browser how to treat the image.
Example:
in the image to the right you see where I have highlighted the entire image tag. There is a (border="0"), (height="320"), (src="location of file on the web"), (width="244").
What we are missing that would be very helpful in some blog posts is the (title="description of the image") tag, where everything between the "" is the description of the image. To add the title tag all you have to do is click in the line and add the tag just like you see in the picture below.Once this is done you can see the description is now available when you hold you mouse of the image just like the image below.
 |
Hopefully that wasn't too confusing and actually helped someone. One thing you will notice is that Blogger's WYSIWYG (What you see is what you get) editor likes to add tags and rearrange everything almost every time you click back and forth from the "Compose" to the "Edit HTML" tabs. Because of this you might want to go ahead and create your entire blog entry then add all your title="" tags and then verify the layout of your page before posting the blog.
~The Phubar, out... :D
2 comments:
I think I will just give you my sign in.
Hahah chicken! It's not that hard really. Once you are looking at the HTML view if you just push ctrl+f and type "img" into the search block it will highlight all the image tags for you.
Post a Comment