Tag Archives: images

Automattic WordPress Post Thumbnails

There are plenty of posts floating around the internet about using Custom Fields to assign thumbnail images to individual posts in WordPress. Web Developer Plus has a different idea.

Do you often put images in your posts? You probably upload them through the media manager built right in to the WordPress post editor. Every time you upload an image, it’s associated with the post you first attach it to. And WordPress creates a thumbnail to go along with it, of the size specified in the media settings.

Web Developer Plus has a an article on how to automatically find the thumbnail URL of the first image attached to a post and store it in the variable $img, which you can then echo out into an <img /> tag wherever you want the thumbnail to appear.

Continue reading →

Skitch: Easy Screenshots and Annotations

Since getting a Mac, I’ve become a fan of the graphics editor Skitch. It’s a simple and useful application that I’ve been using more and more as of late.

Skitch is great for taking a quick screenshot and resizing it quickly. You can press a keyboard shortcut to take a shot of the entire screen or a selection. You can then crop and resize the image by dragging parts of the window border, then save it to your hard disk or a remote server (perhaps your blog’s uploads folder?). You can also annotate the image with text and arrows, add a drop shadow to the resulting image, etc.

Continue reading →

Three Downloadable Twitter Bird Images

Twitter, it’s everywhere. Many bloggers add “follow me” links or “latest tweets” boxes to their blogs. And if you’re going to do that, why not add a Twitter bird nearby? It visually shows “this is related to Twitter,” and it draws the eye to it a little.

Here are a few free Twitter bird images to download and use as you will.

Productive Dreams

Continue reading →

WordPress Post Thumbnails

Thumbnails can really liven up an otherwise plain list of posts, and add a bit of visual interest. By associating thumbnails with posts you gain a lot of flexibility that you would not have if you just relied on images in post excerpts. This allows you to have more compact listings in archives, yet be a little more visual. (The only disadvantage is you can’t show the thumbnails in WordPress RSS feeds.)

First, a few examples of good use of post thumbnails:

Continue reading →

Easy PHP Reflections

Looking to create that cool reflection effect on an image? There are plenty of JavaScript solutions, such as Reflection.js, to handle the effect on the client side, but what if you want to do it on the server end, to ensure maximum compatibility or to take the load off the client machine?

Enter Easy Reflections, a PHP script that makes does just that. Available in PNG and JPEG/GIF flavors, it makes it wicked easy to generate reflected images. Just use an image tag like so:

<img src="reflect_v3.php?img=picture.jpg" />

There are extra parameters you can optionally pass, allowing you to alter the height and width of the resulting image, and adjust the size and tint of the reflection.

Don’t worry about putting too much stress on the server, there’s optional caching support.

jQuery Plugin: Jcrop

A lot of web apps these days involve images. Twitter, Gravatar, Facebook, you name it. For avatars, sharing photos, or whatever, user-submitted images are a big part of the modern web.

Now, suppose you’re building a web app, and you want to allow a user to upload an image of a certain size or aspect ratio (for whatever your purpose is). Now you can’t guarantee that the user will upload an image of the correct dimensions, and you probably don’t want them breaking your layout by submitting a 1200-pixel-wide image. What do you do?

Provide means for the image to be cropped in-browser. There’s a cool little jQuery plugin called Jcrop that allows users to crop images in browser. It seems customizable enough, letting you re-style the selection box, contstain it to a specific aspect ratio, etc. It works fairly similar to Gravatar’s cropping tool.

Poll: Image Host or wp-content/uploads?

When you add images to your blog posts, where do you upload them? Do you store them on an image host like TinyPic.com, or do you prefer to keep them on your own server somewhere?

There are advantages to both methods, and of course, disadvantages.

As of this writing, I put most of my images on TinyPic, though I’ve lately been a little worried about that. What if TinyPic decides to delete them? What if something happens and they lose a bunch of data? I happens. It would be lot of work to re-upload images and edit all of my posts, but it would be “safer.” Though on the other hand, I’d be storing more files on my server, and transferring more bytes as well…

I’m still undecided, but what’s your preferred method?

Poll Results

How Many Images is Too Many?

It depends. Theoretically, the less images on a page the better, as your pages will load faster (and put less strain on your server).

There are two types of images. There are template-level images and post-level images. Template-level images exist in your blog’s header/footer/sidebar template, and therefore appear on every page on your site. Post-level images are part of your content, and they belong to an individual posts.

In your template, you should have as little images as possible. When you create a design, you want to keep the essential images to a minimum. Use tiles, well-optimized image blocks, etc. As of this writing, this blog’s design consists of two images (the logo and the tiled edge image). Once you have your mock-up of the design, figure out the best way to break it up. You want as little images as possible, and you want to keep them as small (as in kilobytes) as you can.

Continue reading →

5 Places to Find Free Photos For Your Blog

Need some images to make your posts more interesting? You need stock photos.

A stock photo is a royalty-free image sold or given away for free that can be used in things like flyers, brochures, and of course websites. Have you ever seen the same photo used in more than one place (for example, I’ve seen the same image of people watching TV in more than one satellite company’s ad)? Chances are, it’s a stock photo. Paid stock photos are frequently being used as book covers even (generally with some adjustments in Photoshop).

Obviously you don’t want to buy stock photos for use on your blog, as that could quickly get expensive (iStockPhoto may be cheap, but those $1 images stack-up pretty fast…). There are plenty of places to get totally free images for use on your blog. Here are a five sources that you may find useful: