Blogger Tips and Tricks

Thursday, October 29, 2009

Updated post editor: remove image border

First thing to note is that with the Blogger updated post editor, you can only upload pictures in the compose mode. To remove border from uploaded photo, you will need to edit the HTML used to display the photo and that you can only do in the Edit HTML mode where in place of the photo, you will see this script:

Now one would think that the attribute border="0" would ensure that the displayed picture would not have a border, but it does, as you can see in that photo of kimchi (Korean version of sauerkraut or fermented cabbage) above.

In order to make the border disappear you can add this attribute style="border:none;" to the <img> tag like this:

and the result of that edit is this photo minus the border:

Wednesday, October 21, 2009

Images and the Blogger updated post editor

Previously with the old Blogger post editor, when you upload images, Blogger adds an alt="" tag for you to complete as seen in an example below:

Now with the updated post editor, you will only have the image upload icon in the COMPOSE mode and Blogger also inserts codes different from the above example to display the image (visible only in the Edit HTML mode) illustrated by the example below:

The code which actually display the image is highlighted in green above. Although in this case, Blogger wasn't as considerate to add the alt tag for you, you can still add it in yourself together with the title tag if you wish like the example below:

Note: You can switch between the old post editor and the updated post editor by signing into Dashboard, SETTINGS > BASIC and near the bottom of the page, you will see this for your selection:

Monday, October 12, 2009

How to delete own comments in other blogger's posts

A previous post described How to delete comments and another post was about a delete comment utility. However, "But I was thinking more in lines of my comment in another person's blog"

That is not difficult. All that is needed is that you be logged into your Blogger account when you surf over to the post where you have left comment you want to delete. You will then see a trash can icon at the bottom corner of your comment like in the screen shot below:

All you need to do is to click the trashcan icon, confirm the deletion, and your comment will be (partially) deleted, leaving behind this:

Saturday, October 10, 2009

How to center date header and change font size

"Do you know how centre the date?????"

Open the template editor by going to Dashboard > Layout > Edit HTML and look for these codes:

/* Posts
-----------------------------------------------
*/
h2.date-header {
margin:1.5em 0 .5em;
}

and change it to

/* Posts
-----------------------------------------------
*/
h2.date-header {
margin:1.5em 0 .5em;
text-align:center;
}

and if you also want to change the font size, add this line - font-size:200% or font-size:12px; or whatever values you wish, so that the codes become

/* Posts
-----------------------------------------------
*/
h2.date-header {
margin:1.5em 0 .5em;
text-align:center;
font-size:200%;
}

Friday, October 09, 2009

"Horizontal scrolling recent posts" for your blog

Found this hack to make a horizontal scrolling recent post at IdeasBubble, tested it at Star Home Improvements. Before you implement this, read this caution note.

If you want this horizontal scrolling "recent posts" just below your blog Header, first you got to add extra "Add a gadget" to the blog Header section (more specific instructions at Adding "graphic" to blog Header)

When you have this extra "Add a gadget" (gadget were previously called page element), sign into Dashboard, click LAYOUT then the "Add a gadget" in the Head section. Chose the HTML/Javascript gadget:

then copy-paste this script into the HTML/Javascript gadget:

Replace http://YOURBLOG.blogspot.com/ with you actual blog URL, preview, and if satisfied, save.

Caution

I tried varying some of the parameters (attributes) like changing

nScrollDelay = 175;
to
nScrollDelay = some number;

and got eratic results, among which were getting error messages when trying to access the edited blog like this one: Recreation and sport (blog only displayed by clicking OK in the error message. Would do more testing later if I find the time) (Update: managed to get rid of that irritating error message by changing templates, and finally by going to LAYOUT > EDIT HTML > click Revert widget template to default at the bottom of the page, publishing a few posts. Don't know exactly what cleared the problem. Will do somemore experimenting later)

Thursday, October 08, 2009

Make blog into book including photos

Many bloggers want to make their blog into a book and one possibility is Blog Collector. Unfortunately, Blog Collector cannot print photos.

Here is another possibility - Blog2print which can also print photos. Just give them the blog URL, set the date range, choose your book cover and add an acknowledgement or dedication if so desired, and Blog2print will generate a preview of your book including a table of content plus quote their prices.

If you are not prepared to foot out $24.95 for a 20 page hard cover book or $14.95 for soft cover, you can opt for PDF file for $7.95

Wednesday, October 07, 2009

Create and Embed Youtube Playlist

From a comment at Google sites to host and hotlink music files

"ok I have loaded a list, how do I play more than one song?"

Haven't studied how to create playlist with Google Sites (check back later), so I tried using Youtube and tested it twice - Test embedding Youtube Teresa Teng playlist (my favorite singer who unfortunately died young) as well as Test embedding Youtube Bee Gees playlist (bring back memories of the good old times), and here are the steps I took to embed those 2 playlists:

Create a Youtube if you don't already have one and sign in. Either upload your own videos with music or search for those songs you want to include in your playlist. At the page showing the selected video, click + Playlist:

Give your new playlist a name, then click ADD. Search for more videos and repeat the ADD process till all the videos you want have been added.

When done, click the down arrow next to your Youtube username at the top right-hand corner of the page and select ACCOUNT:

At the next page, click Custom video players:

then click Create custom player. Give your player a name and enter some description, select the color theme, the layout, then under CONTENT, highlight the playlist, then click SELECT:

Next, at the section for Generate Code and Save Player, click GENERATE CODE and you will get a script similar to the one below to copy-paste into your post editor or into a HTML/Javascript gadget:

Note width and height (in red). If you want to edit the codes so that the width of the embedded video player is commensurate with the width of your main column or the sidebar, use the method to resize Youtube video with no distortion so that it fits nicely into your post or sidebar.

width of