An email came in asking about how to include images within a WordPress post. Unless you are going to show an image that exists on another server, the first step is to upload an image to your server. Although there is an image uploader/resizer/thumbnail creator built into WordPress as discussed here, I just upload my images the way I always have, with an FTP program. I have an images folder off the root and put my images right in there.
Now when you include an image in your WordPress posts (or pages) you have to remember the path to the image that you uploaded. Use the full path to the image in your post (include the http:// and the domain-name.com part) so that the image will still show up when someone is looking at the post from an RSS feed.
After entering the path you can add other options if you wish. All I ever do is set the Border to 0. If the image path is correct, the dimensions will fill in automatically.
Styling Your Image
If you want to surround your image with text rather than it be on it's own line you should use a little CSS to do so. The best way is to create a class. Go to the theme editor and add a class to the stylesheet. Here's the class I use to float the image to the right side of the post and put a little buffer around it so the text doesn't get too close.
.rightimgpost
{
float: right;
padding-top: 0px;
padding-left: 8px;
padding-bottom: 6px;
padding-right: 8px;
border-style: none;
}
To use the class you would go into code view and add class="rightimgpost" within the img tag. For example:
That should be all there is to it.
Related posts:
- Adding A FavIcon To Your WordPress Blog Without A Plugin
- phpBay Pro: The Extended Manual – Making The Images Clickable
- Miscellaneous (Contest, Quick Money Making Tip)
- Promote Your Website With a Video – Guest Post From Michelle Stevens
- When Duplicating Content Is Appropriate – And How To Do It In Your WordPress Posts
Enter your first name and email address below to receive exclusive money making tips.
March 20th, 2008 at 12:56 pm
hmm…this method ALMOST worked for me, but only one line of text wrapped to the side of my picture.
Waiver Sharks’s last blog post..WELCOME
March 20th, 2008 at 1:43 pm
Send me the link to the post and I will look at the code. I looked at the Welcome post but I didn’t see it there.
March 20th, 2008 at 1:46 pm
OK, I seen a post with an image on http://waiversharks.com/screwter/
Is that the one? If so, I looked at the source code and didn’t see the class in the img tag.
March 24th, 2008 at 5:35 pm
Thanks, Keith, but I’m still lost. Have no clue what an FTP client is, or where to find one. Do I have to go into any of my files in Wordpress. Never been there yet, either.
I’ve hyperventilated my way through the Wordpress “tutorial”, but might have to call my daughter in Athens…..she speaks Greek.
Someday I’ll make you proud of me………I just don’t know how long that will take.
Another question: How do I get those Digg, Stumbleupon, etc. icons to show up at the bottom of my blog? I need so much stuff yet to make my Blog less blah!!!
Thanks. I know you’ll get it through to me, eventually.
March 28th, 2008 at 9:19 pm
Hi Joyce, this post was a response for someone else and assumed knowledge of FTP’ing. The response to your question is here;
http://www.keithjameslock.com/uploading-pictures-to-use-in-posts