Hyperlink image to open new window

How do I make the picture link to an external site, but have it open into a new window?
 
Some think this is not a good idea. This post is not addressing that. This is simply a post on how to open an image that is linked to another site in a new window.

This is the code that does that:

<a href="URL" title="TITLE"><img src="IMAGE URL" border="0" width="xx" height="xx" alt="Description"></a>

And here is the code with the information plugged in:

<a href="http://seaside-sharon.blogspot.com/" title="Seaside Sharon"><img src="http://farm4.static.flickr.com/3117/2489901121_35e9239f99.jpg" border="0" width="254" height="45" alt="Seaside Sharon header"></a>

Here is the result of using that code.

Where to put the blockquote code

where to put the code?


I had a question regarding where to place the blockquote code from this post, Pretty Blockquotes.

You insert this code within your post where you want the blockquote to appear. (using the Edit HTML window).

<blockquote>PLACE QUOTE TEXT HERE</blockquote>.

How to remove a border from around a photo

How to completely REMOVE the border that appears around a posted photo within a post on Blogger??



This is easy to change! You will look for the code that you wish to change, which is .post img code in the CSS style sheet.

This is the code in my template (a modified Blogger Minima template):

.post img {
padding:4px;

border:0px solid $bordercolor;

}

Or it could look something like this:

.post img {
margin: 5px;
padding: 5px;
background: $imagebgColor;

border: 1px solid $imageBorderColor;

}

Change this line to read:

.post img {
padding:4px;

border:none;

}

If you have difficulities in finding the correct code in your CSS template, keep in mind you are looking for .post img.

No more borders around your images!!

Make a custom favicon for your blog!

Do you have a favicon? Do you even know what a favicon is? Read on. At the end, you will know it all!

A favicon (short for favorites icon) is a 16×16 pixel square icon associated with a particular website or webpage.
From Wikpedia

I'm going to show you the easy way to make one. There is one program that I highly suggest downloading. It is free, and you can use it for all your quick photo needs. It is IrfanView. I use this program as my default photoviewer on my computer simply because it is so quick and great to use.

When I do a custom favicon, I generally use part of my blog header. Take a look at SeaSide Sharon and Buttermilk Clouds. Do you see my favicon in the address bar? And in Firefox, the favicon is also displayed on the tab. Each of those favicons were taken from my header image.

Here is how to do it:

1. Open your blog so you can see your header (or the part of you blog you wish to make a favicon with)
2. On your keyboard, click the PrtSc Sys Rq button (top row, third from the right)
3. Open IrfanView
4. Click Edit | Paste

What you see now is a picture of your screen and a picture of your header.

1. Placed your cursor in the header and select a 16x16 pixel area
2. Click Edit | Crop Selection
3. Click File | Save As | ICO - Windows Icon 

Upload that image to an online hosting site. You will use the favicon's URL from the hosting site to put it on your blog. I use to use Ripway...but I'm getting away from it because my bandwidth issues. I now use Flickr.

Now you have a little custom favicon! To install your favicon, follow the instructions on this post Adding a Favicon. Since there was some sort of problem with favicons on blogger, I had to find a fix. So be sure to follow the link at the end of that post for a  easy fix.

EDIT: please post a link to your blog with your new favicon so everyone can see!!!!

Blank title widgets

For some strange reason, Blogger, in it's infinite wisdom, once again has decided to do something bizarre with the templates. It is now making us put a title in each widget/gadget title field.

Why? Good question. I wish I knew. But, until the person in charge of Template Management on the blogger team wakes up and realizes the error in this way, I have a work-around. And, thankfully, it is a simple one.

Every time you edit a gadget that had no title, or when you create a new gadget that you don't want a title on, put this code in the title field:

<h2></h2>

For the time being we have fooled the gadgets to believe there is a title in the field.

I hope they realize that this behaviour is just plain silly and put it back the way it was.

"Read More" and controlling posts per page

Hi Annie,

I stumbled upon your university and i'm learning a lot!

I don't have much knowledge in creating htm pages so i want to learn more...

I have some questions that i want to ask you:

First: How do you display only 1 blog post in the home page?

Second: How do i get to cut my post if it's too long? I mean you could display 100-200 characters then it will be cut, then there will be a displayed message below it that say's "read more" which is linked to the full post?

I wish you could help me.. Thanks in advance!


Blogger has really made this easy for us now. You must post in Blogger in Draft to access the "Read More" feature. They call it insert jump break. It allows a portion of your post to be shown on your blog's index page. It then inserts a "Read more" link to the full post page where your readers can keep reading.

Here is how to do it:

1. Open your post editor window and click on the Compose tab.
   
2. Write your post till you get to the point you would like a Read More break.
   
3. Then click on the 'torn page' icon on the right.
4. Finish writing your post.
   

You can also customize the "Read more" text to something more clever. Edit it by clicking Layout | Blog Posts Widget | Edit.



Now, to make your blog display only one post, go to your Dashboard | Settings | Formatting | Show. That is where you change the number to 1. Also make sure posts is selected in the box and not days.

A couple of simple little fixes!