How to add photo to post title

Want to know how to add your photo to post title? Contact me via my contact form

Testing hyperlink to open in new window without target="_blank"

Blogger Tips and Tricks

Let's see if clicking the above opens target in new tab/window

Testing SEO monitor

Test Google Docs Spreadsheet Chart Behavior

Let us see what happen to the chart as we resize the chart made with Google Docs chart:

(result of test, as chart is resized in Google Docs, the chart below similarly get resized:

Test Tweetizen Tweeter embed code

Test Cover It Live iFrame - Dr. Porntip at Teoh Beng Hock inquest

Below is an example of an event that had occurred in 18^th August 2010 meaning it already is in the past and it is no longer LIVE. Had you chanced upon the iFrame below prior to or in the midst of the inquest on August 18, you will not see the whole sequence of happenings but only as it unfolds in real time. This test post is specially created for :

Test centering post title for reader

I think I have already tested that but can't find the post, so testing again. This is in response to a commentator at Customization - how to center post title

Test make Amazon banner open in new window successful

Amazon uses iFrame for their affiliate banners this test is the same as testing how to make iFrame open in new window. Try clicking on the banner below to confirm for yourself that the banner does really open in new window:



and if you want to know to do do it, refer to this post: How to make iFrame open in new window and you will get very clear "HTML for Dummies" kind of easy to understand kind of instructions.

Test img tag and Blogger.com image hosting

and

Test adding caption for photo aligned left or right

Damansara Uptown 1 tower with Multi-national companies as tenants, now lets try to make this caption very very long and see what happens.

Damansara Uptown Multistorey Carpark

This photo first uploaded using Blogger updated post editor in COMPOSE mode, then clicked on photo in post editor to chose align-left then add caption.

Damansara Uptown Multi-storey Carpark parking rates, lets try making this caption very long and see what Blogger does. Now try uploading photo with cursor (insertion point) here: 

Now to try uploading second photo using direct insertion at actual location :


Result, Photo of Uptown 1 plaque listing Multi-national companies as tenants did not end up here but ended up at the top of the post instead.

Test image upload with old and new updated post editor

Original photo uploaded via old post editor photo upload icon:

====================================
Test uploading and manipulating image uploads

The codes for below picture uploaded with old Blogger post editor

Lewis feeding little brother Lincoln

is as follows:

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCbbScaRJ5IYtRxgNt9sOaovYVAZDBJmvennKcZDoro1IPedXbyrzn4vp3I7sMxMDNjNYD9fQat8GTL9I0ta8uQclqnOsgdOcAJLeMf0crewzggz1wqATU2xL3zNpPydExc_2hErKqBHU/s1600/IMG_9855.JPG"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCbbScaRJ5IYtRxgNt9sOaovYVAZDBJmvennKcZDoro1IPedXbyrzn4vp3I7sMxMDNjNYD9fQat8GTL9I0ta8uQclqnOsgdOcAJLeMf0crewzggz1wqATU2xL3zNpPydExc_2hErKqBHU/s400/IMG_9855.JPG" border="0" alt=""id="BLOGGER_PHOTO_ID_5523708324625216450" /></a>

Let's see if the codes get changed on changing the universal setting to the new updated Blogger post editor:

Result of test, on switching to the new updated post editor and switching between COMPOSE mode and EDIT HTML mode, the code for displaying the photo changed to

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCbbScaRJ5IYtRxgNt9sOaovYVAZDBJmvennKcZDoro1IPedXbyrzn4vp3I7sMxMDNjNYD9fQat8GTL9I0ta8uQclqnOsgdOcAJLeMf0crewzggz1wqATU2xL3zNpPydExc_2hErKqBHU/s1600/IMG_9855.JPG" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}"><img alt="" border="0" id="BLOGGER_PHOTO_ID_5523708324625216450" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCbbScaRJ5IYtRxgNt9sOaovYVAZDBJmvennKcZDoro1IPedXbyrzn4vp3I7sMxMDNjNYD9fQat8GTL9I0ta8uQclqnOsgdOcAJLeMf0crewzggz1wqATU2xL3zNpPydExc_2hErKqBHU/s400/IMG_9855.JPG" style="display: block; height: 300px; margin-bottom: 10px; margin-left: auto; margin-right: auto; margin-top: 0px; text-align: center; width: 400px;" /></a>

test background image for post title

Test substituting span for div in the post tile for background image

test background image for post title

Test substitute span for div

test background image for post title

Test substitute span for div

test background image for post title

The script:

<div style="background-image:url('http://goo.gl/Ob6X');">test background image for post title</div>

BTW original image url is very long
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4C2wh_60JmnFcuUAHHu5hqONxab9b0Ir-YIcb2y5rFYO9Qw3DRPj4nFfU1EVXlBZJ6sIa84rmuSAtap07D7PoxvBAND3HWFdH9qIo_gUcM75kgtcaHOPgNRl_-JfgwCZ7GCXAuEuzvptU/s1600/Blogger+Tips+and+Tricks+4.jpg

but shortened by Google Short URL service to
http://goo.gl/Ob6X

which then enabled me to keep the number of characters below 150 characters including space.

This post was inspired by a blogger's comment in How to change post title background color:

"thanx for sharing this..

but instead of color..how about to add image for background?"

Test if Blogger.com post editor title field accepts <img> tag

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4C2wh_60JmnFcuUAHHu5hqONxab9b0Ir-YIcb2y5rFYO9Qw3DRPj4nFfU1EVXlBZJ6sIa84rmuSAtap07D7PoxvBAND3HWFdH9qIo_gUcM75kgtcaHOPgNRl_-JfgwCZ7GCXAuEuzvptU/s1600/Blogger+Tips+and+Tricks+4.jpg

Test successful, now to get image resized to 430px width

Test individual post title background

If test works out only this post will have a purple background for its post title.

The script:

<div style="background-color:purple;">Test individual post title background</div>

Test post title aligned center

The script:

<div style="text-align:center;">Test post title aligned center</div>

After successful test to right align post title, very confident above post title will be centered despite the default for post title for this blog being left aligned.

Test post title align left

The script:

<div style="text-align:right;">Test post title align left</div>

Let's see if post title will be aligned right