Doing away with manual custom fields
I’m capturing the steps to upload and crop various formats of thumbnails for WordPress entries. It is one of the main features I’m building for use in my free WordPress theme. Previously, my solution for assigning thumbnails to WordPress entries was via “custom fields“. After a while of using custom fields, it began to feel tedious and I looked for a better way to handle thumbnails.
On top of that, one of my themes in development allows the use of up to 3 thumbnail formats (widescreen, square and rectangle) for every WordPress entries. Can you imagine every time you write a post, you have to fire up Photoshop to create three thumbnails. Each of them in different dimensions and aspect ratios. Uploading them to your blog. And finally copy-and-paste their URLs to custom keys. It certainly needs a more streamlined and convenient way of handling thumbnails. Manually doing it the custom field way just won’t cut it in the long run.
On-the-fly upload, resize and crop thumbnails
As you can see from the video clip, bloggers can upload a jpg image file, crop it and save it as a thumbnail. Once the blogger clicks ‘Save’ thumbnail, the URL is automatically assigned to a designated custom field behind the scene. Hence, the process of entering the thumbnail’s URL into a custom field has been automated.
On top of that, if you’re an experienced theme developer, you can configure more than one thumbnail to be used for each post. In the video clip, I’ve configured up to three thumbnails for each post.
I hope to wrap up this feature soon and implement it into my WordPress theme. Do drop by again. Instead of building this into my themes, I’m going to develop it as a WordPress plugin. I’ll be hosting the plugin at WordPress official plugin directory and the more information can be found in my next post: WP Post Thumbnail – WordPress Plugin
Note: Bear with the lacklustre video clip quality as this is my first time recording and producing an embedded flash video using Camtasia Studio 5. There’s still a slight learning curve despite it already being very user-friendly. I hope to be able to zoom-and-pan smoother, add narratives and find the best settings to produce Youtube High Definition clips soon.
Whoooh that’s nice
Any plans for releasing a plug-in which could offer the same functionality? I believe it would make you a god in the WP community
Wow this is definitely a cool features for wordpress since you can choose specific portion of the image to be croped. How about some beta tester?
mkjones
Yes I decided to make it into a WordPress plugin last week. Took me while to decide because if it is developed into a plugin, I would have to take into consideration how it can be used by two different kind of users: typical bloggers and WordPress theme developers too.
Eligio
As soon as it’s usable. Again, some considerations when making it into a plugin still need to be sorted out. For instance, I coded this into my theme to fulfill the task of handling 3 different thumbnails per post. I could afford to hard code the thumbnails configuration just for my own theme. Now that I’m making a plugin out of it, I need to make thumbnail(s) configuration flexible to suit the requirement of different themes, different WordPress theme developers.
mkjones & Eligio
Thanks and I’m glad you like the functionality. I’ll be blogging about the plugin’s progress and status. I hope you guys keep in touch.
Unbelievably cool! Can us fans get an early copy to work with? I would love to beta test this theme.
Very interested in this plug-in as well. I’d love to find an easy way to insert thumbnails for my front page posts. Reverse engineering the built-in proprietary-theme solutions (such as you were making for your theme) is about as tedious as the custom fields themselves.
Thanks for your efforts!! =)
Simply Amazing… what else can I say? Is that jCrop I see in there? I want this… yesterday
WOW man, i really like to have this plugin. I’m bored with the upload+copyandpaste+customfiled system.
Stunning, this plugin will win awards…
Just quickly, can photos be uploaded via URL? If not this would be a great feature.
Marty
Thanks to you I just realise I have an alternative jQuery image cropper in jCrop. I’m using Image Area Select plugin by Michał Wojciechowski (http://odyniec.net/projects/imgareaselect/).
payjisan
Get a photo via URL … sounds like a job for curl. I’ll put that feature on my to-do list.
Priorities will be given to sorting out plugin errors and bugs in the meantime before I fool around with new features or interface.
Stan, that’s a very cool plugin and I’m definitely looking forward to it. This way even the Wordpress designers won’t have to fiddle with Custom Fields and lets authors to focus more on the content.
Oh yeah, I’d like to make a pre-requisite if this is suppose to help replace custom fields for images. The ability to set the size of the images would be best – in addition to selecting wide, rectangle and square.
This is fantastic! It would be absolutely invaluable to me. If you set up a PayPal donate button I’ll def help you out with a donation.
Thanks for sharing, this is great…
I installed that plugin and also upload my images as you said but nothing is geeting displayed in the site when i click on the posts..DO i need to add any code or modify any thing..pl help
Funny that I should come across this. I actually made this into a plugin a while ago, one for Profile Images, and one for Post Image + thumbnails. It’s fully functional, although I’m stuck at one point, that is where the Wordpress JQuery comes along and you either override the upload-pop-ups and load the jquery-pack or not. You must have come across this problem, did you find a workaround for it yet?
Hello!
Very Interesting post! Thank you for such interesting resource!
PS: Sorry for my bad english, I’v just started to learn this language
See you!
Your, Raiul Baztepo
very good
Great plugin. I’m using it to generate a thumbnail (110×83) for each post and a page header (700×400) image for each post. Seems to make my original slightly narrower when I upload so that my original then becomes smaller than the actual header crop size that I want… strange. I’d like to be able to upload much larger images than 700×400 then crop them as desired. Any ideas?
Stanley: I think your problem will be solved in 0.2 release. The plugin will resize big original images to fit into the cropping container. The crop box will also scale down according to how much the original image has shrunk.
Read more about the jQuery cropping engine I’m using in the plugin: http://deepliquid.com/content/Jcrop_Sizing_Issues.html
What a sexy blog, love the theme, what are you using?
So cool plug-in!! Thank you for sharing.
Very good my friend!
I’m waiting for a plugin like that! It’s perfect!
I wish you success!
PS: One detail, i did not have success to use the function that you gave on this page: http://www.seoadsensethemes.com/wordpress-wp-post-thumbnail-plugin/ . To show the imagens i’m calling the custom fields directly.
(Sorry for the poor English)
Thank you very much!
great plugin.. thanks.
very interesting n creative…..liked it!!
Thanks, this is a great plugin, I’ve been searching for something like this! But I have a couple of questions and would appreciate any help
1. Is it possible to show a thumbnail on main page and replace it with a big size image in post page?
2. I have only widescreen thumbnail available, no other tabs, is it smth that I have to enable somewhere?
Thankyou for sharing mate, I
Like Julia, I too only see the widescreen option. Where is the other two options as seen in this demo?
Can you please let us know, it seems that there was no response to the question before.
thank you! I will add that the plugin looks very promising, but I do need square thumbs…
I was also wondering how I get the tumbnail to be viewed? My theme has a spot to utilize the thumbnail generated when I use WP’s post Thumbnail. How can I use your plugin to be seen as the post thumbnail?
Как остро вы пишите об обыденных вещах, надо у вас просто учиться!