Translate

Translate to German Translate to Spanish Translate to French Translate to Italian Translate to Portuguese Translate to Japanese Translate to Korean Translate to Russian Translate to Chinese

I'm a KONTERA Partner! Sign up and start making money on your site too!

Categories

More FREE Stuff

- Atomic Blogging 2.0 Leak Copy
- Blogging Videos
- Explode your Adsense earnings get Adsense Secrets 4.0 for only $9.95



Adding an image to your Wordpress post

Filed Under (How To, Wordpress) by Tricia on 05-03-2007

If you read the last post you now know a little bit more about preparing photos and images prior to including them in a post on your blog or an article on your website. Now you are ready to include the image in your post.

For the purposes of this article I’m going to tell you how to put images in Wordpress blog posts, as that is the blogging platform that I use and to which I’m most familiar. I think that some of the methods might be slightly different on other blogging platforms but the theory should be the same.

As I said in the last post there are at least two ways to get an image into your post. You can upload them directly from your computer, or you can upload them to a free photo hosting service first.

Let’s discuss uploading an image into a Wordpress post first:

While you are in the post writing area of Wordpress you’ll see an upload section right below the writing area. When you want to add a photo that you’ve already prepared for your post simply scroll down to the upload area and:

Find the Browse button in the upload section. Browse through the files on your computer to find the image that you’d like to upload.

Once you find the image that you’d like to use in your post click on the Upload button in the bottom section of the Upload area.

Once the file has uploaded you’ll see a thumbnail of the image on the left. If you are using a version of Wordpress that is less than 2.1:

- you’ll have to click on the image to choose either thumbnail or full size

If you are using Wordpress 2.1+

- Beside the thumbnail of the image you’ll be able to select between full size, thumbnail, or title. I believe title will just be a link to the photo on the server. Below that you’ll see that you can link to the file, the page or none. I tend to use full size images in my post so I usually select full size and none.

Now, before you click on the Send to Editor button place your cursor in the area of the post that you’d like the image to be located. Ok … now click on send to editor.

If you are in rich text or visual mode you’ll see the image. If you are in code or plain text mode you’ll just see the code for the image in your post.

If you are in code mode you can use < center > or < p align="center" > to align the photo in the center of the post. You can also use the paragraph tag to align the photo to the left or right side of the post. The text will come up and wrap around the photo if you set the photo to the left or right.

In Visual or Rich text mode you can simply click on the alignment icons near the top of the post to move the photo from left, center or right.

Then TA DA you have a photo inserted into your post.

If the photo is still a little bit too large for your post you can click on the photo and you’ll see points in the corner that you can drag to make the photo larger or smaller. You’ll only be able to do this while in visual or rich text mode.

The other way to get photos into your posts is to get the photo links from the free photo services that you’ve already uploaded your photos to - ie Flickr or Photobucket. Simply visit either of those sites, upload your photos if you haven’t already, and then depending upon which service you choose to use, select the photo and get the link for the approximate correct size of photo that you need for your post.

Once you have the image link, you can use the link button at the top of your Wordpress post writing area to add the http link to your post.

Now you’re all set. You can create great posts with photos and images in them to illustrate whatever topic you happen to be discussing in your post.




Add this to : Digg! Digg it Bookmark! Save to Del.icio.us Subscribe to RSS Subscribe to My RSS feed

Preparing images for your Wordpress Posts

Filed Under (How To) by Tricia on 01-03-2007

So how do prepare an image for a blog post anyway?

I know that a lot of people have trouble figuring this out. I see a lot of sites out there with huge images in their posts that overlap the edges of the post section, or who’s photos must be so large that they slow the site down as they load.

There are a few ways to get an image in your post. You can upload your images to a free image hosting service like Flickr or Photobucket, or you can upload them directly to your post using the Wordpress interface.

If you are going to upload your photos directly I would strongly suggest that you get some easy to use photo editing software. You do not want to upload huge photo files to your server and then include them in your post. Large file sizes will slow down the loading time of your site and frustrate your visitors.

Now when I suggest that you reduce the size of the photo I don’t mean the dimensions. I mean it’s actual size in kilobytes.

Think of it in human terms. There are tall people, and short people, slim and heavy. That’s dimensions. In photo terms you want to make a photo small enough to fit within your post without over-lapping the edges.

Then there’s the weight or kilobyte size of the photo. In human terms if you are getting a little pudgy you need to lose some weight right? Well, so do photos if you want them to load quickly on your site.

Using photo editing software you can keep the size of the photo but still make the actual file size (Kilobytes (KB)) smaller by lowering the quality level of the photo or converting it to a different format. For example if you have a jpg file you might try converting it to a gif to see if the file compresses and gets smaller in “weight”.

Ideally, you probably shouldn’t upload photos that are anymore than 20 to 25 kilobytes (KB) in size.

Now as to the size or dimensions of the photo - well you can change that directly in wordpress or you can use your photo editing software to make a wide file a bit smaller. The posting area of most blogs ranges from 300 to 500 pixels (px).

You can go into your blogs template - usually the CSS stylesheet, and read through the coding to find out how wide the body of the content area is. Use that information to determine the maximum width of a photo in a post. If you discover that the content area is 400px wide then you should try to make sure that any images you insert into your posts are no more than 400 px.

Now that you know a little bit about editing a photos size and dimensions prior to inserting it into a post, it’s time to learn exactly how to get that image in your post. Please read the next post in this blog for those instructions.




Add this to : Digg! Digg it Bookmark! Save to Del.icio.us Subscribe to RSS Subscribe to My RSS feed