Get The Image WordPress Plugin
One of the problems with magazine-type WordPress themes has always been that they require more work than an average theme because of the extra image uploading.
I’ve always held the belief that you get back what you put in. The time and energy you put in your site, the better it will look.
Of course, that’s just a lot of work sometimes, especially if you’re a more casual blogger and simply want your site to look good with extra images that make your posts stand out. My goal is to cut back on some of the work. So, I created a new PHP image script that should help out with that.
I’ve seen some other image scripts that do similar things, or even allow you to add one custom field and it resizes and crops the image for you.
This plugin will allow you to have full control over images displayed, or it takes the power of WordPress and uses its image cropping methods. This makes for a much smaller file size. Right now, the file is under 6kb.
Download
- Description: This is a highly intuitive script that gets an image either by custom field input or post attachment.
- Version: 0.2
- Requires: WordPress 2.5+
- Support: Support forums
Note to Options and Structure theme users: If you’re using version 1.2+ of either of those themes, don’t install this plugin. This functionality is built into your theme.
What the code does
I like using custom fields to define images for my posts, so that’s what this script was built upon. So, the script looks for the custom fields Keys that you define. If that Key has a Value (should be an image URL), the image is displayed with your post.
If there is no custom field used, the script looks for the first image attached to your post. If there is one, then it grabs that image and uses it.
If there are no custom fields used or images attached to your post, the script has the capability of displaying a default image that you’ve set.
If that’s all Greek to you, don’t worry; I’ll try to go into more detail throughout this post.
How to use the code
There are three basic sections: the custom fields array, default size, and default image. Take a look at what it looks like:
echo get_the_image(array('Thumbnail','My Thumbnail'),'thumbnail','/wp-content/my-image.jpg');The first part, or the custom fields array, checks for Values assigned to whatever Keys you put there. For our example, we’re using “Thumbnail” and “My Thumbnail.” The script first checks to see if Thumbnail is set. If not, it checks for My Thumbnail.
The second part, tells the script what the default image size should be, which we’ve used “thumbnail” for this. This is important because it tells the script to look for the WordPress-generated thumbnail if there are no custom field images found. You can use the values “thumbnail,” “medium,” or “full” for this (those are three image sizes WordPress generates).
The third part, tells the script that if there are no images found at that point, to display the image found at “/wp-content/my-image.jpg.”
For the rest of this post, I’ll leave the third part off as I assume it won’t be used as much and will default false if not added.
There are two different ways to use this:
echo get_the_image(array('Thumbnail','My Thumbnail'),'thumbnail');
echo get_the_image_link(array('Thumbnail','My Thumbnail'),'thumbnail');The first line simply displays an image. The second displays an image and adds a link to the post around the image.
Sounds cool, but you need a practical application for this
Let’s suppose you’re adding this to your category pages. So, take a look in your category.php or archive.php file. Each theme will be a little different, but here’s a general example of the section that displays your post content:
<div class="entry">
<?php the_excerpt(); ?>
</div>Now, we need to stick our code in there somewhere. Let’s say we want our image to appear just before our content. Add the image script in there.
<div class="entry">
<?php echo get_the_image_link(array('Thumbnail','My Thumbnail'),'thumbnail'); ?>
<?php the_excerpt(); ?>
</div>Now, refresh any category page. If there are any images attached to those posts, they’ll now have thumbnails displayed before your content.
Styling this thing
CSS classes are generated for you automatically. Let’s say you use this code for your category pages:
<?php echo get_the_image_link(array('Super Mario','Donkey Kong'),'thumbnail'); ?>If you add an image to the custom field Key of “Super Mario,” you’ll have these classes to work with in your CSS:
.super-mario { }
.thumbnail { }If you add an image to the custom fiekd Key of “Donkey Kong,” you’ll have these classes to work with:
.donkey-kong { }
.thumbnail { }If you just upload an image through the media uploader but don’t add it to a custom field, your CSS class would be:
.super-mario { }
.thumbnail { }So, what this does is add a class for whatever custom field is used and the default image size. If no custom field is used, then the default image size and the name of the first custom field will be your classes.
Test this thing out
You can use this for almost anything and in nearly any template file. Want a feature image? Done. Want thumbnails in your sidebars? Done. I’ll be happy to help out in implementing this on your blog if you ask in the forums.
I’ve been refining this plugin for weeks, so everything should be working pretty good. It’s the culmination of about a year of working with custom fields and a few weeks of working with my Cleaner Gallery plugin. Essentially, I’ve been building this plugin for about a year.
There are a lot of different things you can do with it: much more than I’ve had the room to explain here in this basic intro. I think it will work well with magazine-type layouts, or possibly, for those of you that want to spruce up your blog a bit. I’m even running it on my blog just to test it out for y’all — which reminds me — I need to spruce some of my own images around here.
Test it out; break it; let me know how it’s working. Ask support questions in the forums.
Great Justin. Do you sleep? I’m gonna test this thing out tonight. What you describe this plugin does accomplishes about 95% of what I’m looking for:
If a custom field value thumbnail exists, fetch it.
If a custom field value thumbnail doesn’t exist, fetch the first image embedded in the post body (use the size specified by Wordpress’ thumbnail setting).
If neither a custom field value thumbnail exists nor an image in the post body, fetch the first photo attached to the post.
This would sort of act like a post thumbnail manager. The second part might be the toughest. What do you think?
Sleep? Is there such a thing?
Let me break that process down a little bit simpler.
1) It looks for the custom field image(s) you specify.
2) If none exist, it looks for the first image attached to the post (which would be the first you upload with the media uploader).
3) If set, it’ll check for a default image.
I suppose it’s a bit like a post thumbnail manager, at least to a degree.
Hmmmmm…. I now realize this accomplishes 100% of what I’m after. Thanks Justin! Dinner is on me.
[...] Get the Image WordPress Plugin - Justin Tadlock has released his newest plugin, which was designed to help people with images that use Magazine WordPress themes. Want automatic updates? Subscribe to our RSS feed or Get E-mail Updates Automatically! Digg This! | Stumble it! | Add to Del.icio.us | | Print This! | SHARETHIS.addEntry({ title: “WordPress Talk - May 29, 2008″, url: “http://hackwordpress.com/wordpress-talk-may-29-2008/” }); [...]
I can’t tell you how useful this plug-in will be. Works an absolute charm.
Thanks
[...] Get The Image WordPress Plugin (tags: wordpress plugin) [...]
Thad
That’s great. And, thanks for the dinner.
Ross
Thanks. Let me know if you run into any problems as this is just the 0.1 Beta release.
So far, it’s been working well for me, but I haven’t put it through every single test possible just yet. I usually try to break these things in some way.
[...] Get The Image [...]
super plugin Justin, this is going to be VERY usefull
by default in wordpress the thumbnails are named : nameand the size of the photo, like 2lw006_1-128×96.jpg for example. do you know if there is a way to have the size removed and replaced by thumbnail, to have the name like 2lw006_1-thumbnail.jpg.
thank you very much
Steffy
Thanks. Great plugin!
[...] 5. Get the image WP Plugin [...]
[...] my delight when I found the following two fantastic solutions: Justin Tadlock’s brilliant Get the Image WordPress plugin and Darren Hoyt’s TimThumb PHP Script. Both the plugin and the script take most of the [...]
I’ve been using the Post Thumbs plugin, but will try this put on a new site I’m doing soon.
Steffy
Thanks. I think I saw something about changing the name of the thumbnails on the WordPress support forums a few days ago. I don’t remember the particular link though.
Kolunchik
You’re welcome.
dave
I had never seen that plugin before. Thanks for sharing. I’ll have to check it out when I get the chance.
I use on my site http://www.le-hiboo.com the plugin http://www.alakhnor.com/post-thumb/
That do you have done.
Looks like a good way to make a sitemap for a photoblog.
it´d be nice if your plugin could also look for an imagen with a certain “alt”. That would enable you to select what picture you want for the thumbnailed view even if it´s not the first image on the post content and you aren´t wise enough to figure out the link for an uploaded file.
Alt can be controlled via the image´s description.
I use Flickr for image hosting, as I think many people do. Is it possible to add another condition that looks for a Flickr image link and returns the Flickr thumbnail code? That’s a regular thing, if the image is 04958509.jpg then the thumbnail is 04958509_t.jpg or 04958509_s.jpg
[...] Get the Image WordPress Plugin - Justin Tadlock has released his newest plugin, which was designed to help people with images that use Magazine WordPress themes. Posted in Talk WordPress | 0 Comment | Random Post » var AdBrite_Title_Color = ‘2255AA’; var AdBrite_Text_Color = ‘000000′; var AdBrite_Background_Color = ‘FFFFFF’; var AdBrite_Border_Color = ‘FFFFFF’; var AdBrite_URL_Color = ‘2255AA’; [...]
Awesome. Awesome. AWESOME.
Thank You!
I’ve been trying to do this for a while and this is great.
One question though Justing, How can I skip taking the first image from the post?
Cheers,
Gaj
[...] image cropping methods. This makes for a much smaller file size. Right now, the file is under 6kb. Get The Image WordPress Plugin Optimize Images For Search Engines, Social Media and [...]
I’ve been playing with the plug-in and have made it live on my site, it fantastic. My home page load nearly 10x as fast. however some images are not converted into thumbnails? any ideas?
http://www.gaj-it.com/index.php/page/7/
I’ll take this into the forum
I am looking for a way to include images in custom fields to show it to my RSS subscribers. Should I go for this or the other plugin custom-fields-for-feeds ? ? I used to use the visionary theme for my previous mag. and for this one I use the arthemia theme.
P.S you need to have the comments subscriber plugin….yea, i am kinda lazy
Get The Image WordPress Plugin…
This plugin will allow you to have full control over images displayed, or it takes the power of WordPress and uses its image cropping methods….
I have implemented this plugin on a beta magazine site however, what i have noticed is that when I have 6 new articles appearing on the front page, each with their own 50×50 crop image, it seems that if I attempt to reuse an image from one post to another using the media gallery, it will not display the inline image from the post using the plugin here. It will only output the “no image” comment in the resulting code. Thoughts? If I insert a new image into the same post and resave, it pulls the image out fine, just can’t seem to reuse images.
Tod
Thanks for using it. It does come in handy.
Jonathan
Very cool idea. I’ve never even thought of using it that way. Definitely worth trying out.
tricky
That’s what the custom field is for. Just set the image you want as the custom field instead of letting the script do all the work.
indi
Just use the custom field option if you want to use Flickr images.
Jeff Mackey
Well, you’re welcome!
Gaj
Use the custom field option if you don’t want the first image displayed.
TheAnand
If you’re only using custom fields, then the other plugin is what you’ll need for your feed. This works in a much different way.
Steve
If you don’t upload an image to that particular post, it’s technically not “attached” to that post. It’s attached to the previous post, which is why the plugin won’t show it.
If you just want to reuse the same image, you’d need to use the custom field option.
Does this plugin need to be used within the context of “The Loop” or can it be used elsewhere as well?
[...] there are several image resizing plugins and scripts out there (such as Viva Thumbs, TimThumb, or Get the Image), and Andrew of Fun with WordPress has created a plugin to facilitate the inclusion of EXIF [...]
[...] Get the image plugin [...]
Adam
Yes, it needs to be inside of the Loop. Well, technically, it grabs the global
$postvariable. So, if you set that, you could use it anywhere.I don’t see much point in using it outside of the Loop though. Its purpose is to grab a post’s image attachments or custom fields.
[...] Get the Image plugin - Download [...]
Hi Justin!
I was using this plugin at my site and working fine, but after downloaded the plugin version for WP 2.6 (because I upgraded to WP 2.6), it stop working…
Must I change something from previous version for the new to work?
Very thanks..
Awesome mate! We were making a video sharing website for japanese animes, I had wasted a lot of time to think a code for what your plugin does in 1 row!!! AWESOMEEEE!!!
Hi there!
Is it possible to extract only the relative path (entire URL will do also) and the image name eg.:
/wp-content/uploads/img_2531.jpg
Best Regards Krezz
Since i update to Wordpress 2.6 Post Thumb from Alakhnor doesen´t work anymore and the Website from Alakhnor a infected with a trojan Virus since a few weeks.
So i used the get image plugin…it works like a charm, thank you for this!
The only problem that i have is that only every second image would be displayed?
Have i done something wrong?
[...] Get the Image - This is a sweet, little plugin from the very brilliant Justin Tadlock. It will make it easier for you to include post thumbnails and featured photos for all your posts without using custom fields. More on that in another tutorial. Again, if you decide not to use it, the theme will function fine without it. [...]
My users hotlink to their image hosts (flickr, Picasa, zoomr etc) using those sites “embed URI” html in the posts…
How do I get the thumbnail to show up for those posts? I’ve tried specifying a custom field key of ‘thumbnail’ and a value of ‘http://URItoIMG’ but no joy, as it’s not an attachment to the post…
The embed img code displays fine in the single post view, as expected, it’s just parsing HTML, but I would also like to be able to display a thumb of this image (CSS “resize” of main hotlinked image).
Any ideas?
Thanks.
ooops!
Forgot to mention that this is a WPMU 2.6. site!
The thumbnails work fine (minor css size ignore going on) on the sub-blogs, but I guess the path doesn’t isn’t resolved if I display the post on another subblog. I’m not quite sure why as the the link (to the external site) is the same…
Is there a way to use this for pages and the wp_list_pages template tag?
[...] the plugin here. Installation is pretty simple [...]
I tried making changes to the image site in the plug-in editor for the file, but i still not seeing the Thumbnail size that I want. Looks like i’m stuck at the ‘medium’ setting? Any ideas to help me?
I tried making changes to the image size in the plug-in editor for the file, but i am still not seeing the Thumbnail size that I want. Looks like i’m stuck at the ‘medium’ setting? Any ideas to help me?
Thanks for making this available! It was exactly what I needed.
Not exist related post thumbnail?
Hi Justin,
Would you know how to write a conditional statement for this?
I would prefer that if there was no image in the post, for nothing to show, instead of an empty anchor tag.
Thanks for any help, and thanks for a great plugin!