With the latest release of WordPress 9.2 + from, we have introduced a new feature very useful to manage thumbnails, or thumbnails. This feature, however, must be activated in the theme, namely, acting on the file functions.php . This new feature is useful in many contexts and provides a simple and convenient tool for both the developer of a website using WordPress is the final customer who will then manage the content.
In versions of WordPress prior to 2.9, in fact, many developers used the custom fields (custom fields) to provide customers the ability to add an image - external - to the post. Solution from the point of view that if the developer was not particularly burdensome, rendeve still editing the post quite inconvenient, especially if we consider that often it is the end customer to treat the content. Other solutions could be to use those plugins already made, or write an ad-hoc. With release 9.2 +, however, you can enable management "miniatures" with a few lines of code, finding himself in the backend everything already done, making the process of insertion of the post really more comfortable and clear.
Activate the new function, post-thumbnails
To enable the management of the backend "Thumbnail article" is simply edit the file functions.php and add the following line of code:
1 | ) ; add_theme_support ('post-thumbnails'); |
Or, better yet, in view of compatibilià and stability:
1 2 3 | function_exists ( 'add_theme_support' ) ) { if ( function_exists ('add_theme_support')) { ) ; add_theme_support ('post-thumbnails'); } |
Without this, coming and going to change in the administration of a post, we will find a new panel on the right sidebar:
Clicking on "Set Thumbnail" will open the classic panel already used to attach images and media. When we chose our image, insert it when we have the new "Use it as a miniature":
Activation can also be controlled using best:
1 2 3 4 |
You can also choose the size of this "miniature", driven, besides working in the new editor of images made available from WordPress:
1 2 | / / 50 pixels wide by 50 pixels tall, box resize mode , 50 ) ; set_post_thumbnail_size (50, 50); |
Use the thumbnail
At this point all that remains is to use the thumbnail in our template:
1 | the_post_thumbnail (); |
Following the standard WordPress is also available without echo :
1 | get_the_post_thumbnail (); |
It is also possible to pass a series of parameters to this function, making it very versatile, as:
1 2 3 4 5 6 | / / Display the thumbnail ) ; the_post_thumbnail ('thumbnail'); / / The version Medium ) ; the_post_thumbnail ('medium'); / / The Large Version ) ; the_post_thumbnail ('large'); |
, cosa comodissima all'interno di “loop” personalizzati: You can also set other parameters as attributes of the tag img alt and title , which is convenient in "loop" custom:
1 |
Also for "retrocompatibilià" a good implementation of this new feature might be:
1 2 3 4 5 6 7 8 9 10 11 12 | function_exists ( 'has_post_thumbnail' ) ) && ( has_post_thumbnail ( ) ) ) { if (( function_exists ('has_post_thumbnail')) && (has_post_thumbnail ())) { / / Wordpress 9.2 + using the embedded thumbnail the_post_thumbnail (); { Else {} / / Wordpress 2.8 and above - use the technique of the custom field / / Use a custom field called "field-thumbnail" or the way you want it / / Contains the URL of an image get_post_meta ( $post -> ID , 'campo-thumbnail' , true ) ; Postimage get_post_meta = $ ($ post -> ID, 'field-thumbnail', true); $postimage ) { if ($ postimage) { . $postimage . '" alt="" />' ; echo '<img src="'. $postimage.'" alt="" />'; } } |
Additional notes and examples
This feature is very useful and has been introduced in a comprehensive manner. I suggest you still see the official put the WordPress documentation detailing the entirety of all the functions and their parameters. As a further example we show how to set up a thumbnail of 64 × 64 pixels with a hard-crop and use the same image in each post by changing the settings of the width (eg 512) and height (infinite inserting 9999):
1 2 3 4 | / / In file functions.php ) ; add_theme_support ('post-thumbnails'); , 64 , true ) ; set_post_thumbnail_size (64, 64, true); , 512 , 9999 ) ; add_image_size ('single-post-thumbnail', 512, 9999); |
On the home page, for example, we will use:
1 | the_post_thumbnail (); |
In the file single.php using:
1 | ) ; the_post_thumbnail ('single-post-thumbnail'); |
Loading ... 
[...] WordPress 2.9 +: new feature thumbnails post I explained how to use the new management features thumbnails, thumbnails, [...]
but what is the difference between these 2 lines? that generates results??
On the home page, for example, we will use:
In single.php file using:
@ Joseph: the first shows a thumbnail at the default size, those set by:
the second is used to set a thumbnail our personnel with different dimensions, for example:
2
thumbnail ' ); the_post_thumbnail (I - thumbnail ');
In this way we can have different thumbnail depending on our needs, and pages of different contexts. All at once realized by setting the "miniature".
[...] New features miniatures of WordPress, introduced with version 2.9 and discussed in WordPress 2.9 +: new feature post thumbnails, can be automated using a simple PHP script. This can be handy when [...]
Greetings to all,
how can I change the name (label) in the administration of the thumbnail. Instead of "image evidence" of course in Italian.
Currently I have started using wordpress 3.0 with the plugin "multiple post thumbnails."
@ Emmanuel: I do not understand what you mean, did you mean to "Set Thumbnail"? You can try using the filter:
2
3
4
5
6
/ / $ Content is in the output shown in the backend
/ / "Set Thumbnail"
}
, 'custom_admin_post_thumbnail_html' ) ; add_filter ('admin_post_thumbnail_html', 'custom_admin_post_thumbnail_html');
If I misunderstood the question riptoponi. Greetings
@ Giovambattista Fazioli:
I mean the label of the field where it says thumbnail "image evidence"
I would be interested in facts also change the internal link "Set image evidence", in practice, as you know is the link that allows you to upload the image library
Meanwhile, thanks a lot
@ Emmanuel:
Ooops sorry I am using wordpress 3.0 as the Italian translation of the label has just "image evidence" while the first was (as in your tutorial) "Article Thumbnail".
@ Emmanuel: Ok, now clear to me. Simply enter this code in the file
functions.phpof the theme active you are using:2
3
4
5
, 'post' , 'side' ) ; remove_meta_box ('postimagediv', 'post', 'side');
, 'Quello che vuoi' , 'post_thumbnail_meta_box' , 'post' , 'side' , 'low' ) ; add_meta_box ('postimagediv', 'What you want', 'post_thumbnail_meta_box', 'post', 'side', 'low');
}
, 'customposttype_image_box' ) ; add_action ('do_meta_boxes', 'customposttype_image_box');
Replaces, possibly using the locale, the string
excuse the game of "texts". I hope you will help.
Quello che vuoiwant with That cheeThanks for this post!
Thanks for the clarification on the use of the new function, which hitherto had remained obscure to me!
A question: is there a way - or plugin - automatically create a grid of "thumbs", hinting Article of belonging?
(Any help is appreciated)
@ Doz: of course! All you can do it without a plugin. Just create a function in the
functions.phplike this:2
3
4
5
6
7
8
9
10
; global $ post;
new WP_Query ( 'category_name=blog&showposts=10' ) ; $ ThumbnailsPosts WP_Query = new ('category_name = blog & showposts = 10');
'' ; $ O ='';
$thumbnailsPosts -> have_posts ( ) ) { while ($ thumbnailsPosts -> have_posts ()) {
the_post ( ) ; $ ThumbnailsPosts -> the_post ();
'<a href="' . get_permalink ( ) . '" $ O. = '<A href = "'. Get_permalink (). '"
}
; echo $ o;
}
Without this, the theme file
index.phpfor example, you can call this function, adding the point that you see fit:. In the function
creaGriglia()above I extracted the first 10 posts from categoryblog. By changing the parameters of the query and the HTML, you can easily create one you requested. Above, you see, I put the "thumbnail" images next to each other. By inserting the "tagging" the appropriate output format you as you see fit. Hope that helps.@ Giovambattista Fazioli:
Heila, that speed, which disponbiiità!
Just a moment I try your code, thanks a lot!
HELLO
I'm testing the code since the release of 2.9 and the hard-cropping does not work mica.Su this point of view timthumb works much better if it were not that the output image is of a much lower quality than the input.
I set a thumbnail cropping 60x60px with hard, I loaded a 600x300px image cropping is not hard but the function not want to work ... any ideas?
hello .. and little I use wordpress code and understand it less than zero .. My probema and .. I posted on the home page images of size 320 x 320 obtaining the code from imageshak .... and comparing it with the entire post that image out of tune by being too broad and so the order of 10 posts per page This is long ... now I have searched the web but have not found the solution I was looking for ... or will ask that images can be reduce size of example 100 x 100? bearing in mind that once used the read more page that highlights the natural image 320 x 320 .... now having had experience with this blogger template in your code was the editing of the images on the home page .. wordpress may have the same function or should opt for other solution? .. thanks to those who will know how to give useful advice on how to proceed ... sandro
[...] Followed this tutorial and it works http://www.undolog.com/2010/04/09/wordpress-2-9-la-nuova-funzione-post-thumbnails/ but the images (of the same articles ) I'm going to enter as thumbnail images are [...]
. Hello congratulations for the blog, I have a question, I have a gallery that loads the images from the custom fields of posts, in theory I created a variable named
$BG_imagewith the link to the picture typehttp://www.miosito7immagine/foto.jpg.How can I put in place the link in the photo evidence, if this transform
in
I'm not a php expert as you have already seen ...
@ Gianluca: could you explain the problem better, I do not understand what you got.
now I understand that I must not put the signs of opening and closing php, I apologize
No ... I go .. what is wrong?
I'm using a theme that has the timthumb.php but this does not work because I installed WPMU.
In
functions.php2
3
, 64 , true ) ; set_post_thumbnail_size (64, 64, true);
, 512 , 9999 ) ; add_image_size ('single-post-thumbnail', 512, 9999);
(subito dopo get_header) perchè index mi da
Templatepath. '/front.php'Inindex.phpandfront.php(after get_header) because it gives me indexTemplatepath. '/front.php'Templatepath. '/front.php'And in
single.php(after get_header)this is done, things do not change
Hello I can not change the size of the tumb. in the file
function.phpI write this:but does not change size.
What should I do??
thank you
paul
@ Paul: I do not work because the thumbnails you have already created. You must delete the file and reload it to cause it to be given the new setting. The thumbnail, in fact, are not generated runtime when the function is called, but when you create the first time in the backend, if you think WordPress would recreate "the fly" all the thumbnail for a site with 2000 articles ...
That setting, we say, is not retroactive!
A hello to all.
I tested the function
creaGriglia()described above, but I do not work.I wish that every click on a category I come out of the thumb relative to the same category, or perhaps through
add_image_sizecreate a new dimension and put it into a beautiful gallery jquery.I could make a direct query to the database, I see where they are inserted, but there will be an easier way ...!
Thanks in advance!
@ Federico: I could not work for various reasons, eg you have not set the thumbnail, or does not have a category blog ... exactly what happens to you? Get some error message?
I ask forgiveness ... I do not have a category blog ...!
Now it works perfectly, the personalizzerò integrating a gallery, I should be able to see how well it is possible to intervene in the function.
Thank you and I renew my apology.
Hello,
thanks for your guide really useful. I wanted to ask is there a way to automatically fit the new option to the previous post where the thumbnails were gestitie via custom fields or do I manually add the thumbnails for all the old posts? I hope you can help me, thanks in advance all
Tiziana
@ Tiziana: You can do both. As mentioned in the article above, if you use a code like this:
2
3
4
5
6
7
8
9
10
11
12
/ / Wordpress 9.2 + using the embedded thumbnail
the_post_thumbnail ();
{ Else {}
/ / Wordpress 2.8 and above - use the technique of the custom field
/ / Use a custom field called "field-thumbnail" or as
/ / You want that contains the URL of an image
get_post_meta ( $post -> ID , 'campo-thumbnail' , true ) ; Postimage get_post_meta = $ ($ post -> ID, 'field-thumbnail', true);
$postimage ) { if ($ postimage) {
. $postimage . '" alt="" />' ; echo '<img src="'. $postimage.'" alt="" />';
}
}
You can see the thumbnail of the new products and, if so, remove the address from the post-meta image of old articles, the ones that we used a meta tag.
Also you can reapply to all the new features articles, read How to set automatic thumbnails of all posts
Hello,
But this code I've indicated automatically puts in the thumbnail of the homepage for the old post with custom fields that have? Thanks
Hello I solved doing as written in the link you provided. Thanks
Hello as said
. I inserted the code that I've mentioned on other blogs but it does not recognize the old miniatures (managed by custom fields). How can I fix this? I hope you can help me, thanks
Tiziana
Hello and congratulations for the great post
While we're on the subject I wanted to ask you something, I'm using the plugin "Category Posts" which allows you to add a widget with the posts that we want for each category, showing also the thumb of course related to the article for each class.
The default plugin inserts a thumbnail after the name of the post, but I would like at the beginning and then the name of the post. How could I do?
Hello,
congratulations for the blog.
I was able to trigger the display of thumbnails according to your instructions even though I view them in the post in spite
function.phphas inserted the line:How do I avoid getting the thumb inside the post?
Thanks
Alfredo
@ Alfredo: a possible cause could be that something has triggered the thumbnails on the post, as the line of code you provided is correct. To test you could place before
add_theme_support:Let me know if it works? I am in the meantime I investigate.
Ok, everything works. Thanks to the availability 'entering into practice:
2
3
4
5
6
7
8
9
10
11
12
/ / Wordpress 9.2 + using the embedded thumbnail
the_post_thumbnail ();
{ Else {}
/ / Wordpress 2.8 and above - use the technique of the custom field
/ / Use a custom field called "field-thumbnail" or the way you want it
/ / Contains the URL of an image
get_post_meta ( $post -> ID , 'campo-thumbnail' , true ) ; Postimage get_post_meta = $ ($ post -> ID, 'field-thumbnail', true);
$postimage ) { if ($ postimage) {
; echo'';
}
}
I upgraded it more 'page themes. Now I ask you something.
I need to put the image loaded
the_post_thumbnail();on a div, to put the text above.So I need to get only "src" and then pass it to the css.
Thanks
@ Jgor: you can do in various ways. To get the code (and not the output) you can use
get_the_post_thumbnail(). This function, however, gives you back all the HTML markup.In this function, however, for information, the filter is linked
post_thumbnail_html.che vuole come parametro l'ID del thumbanail. If you want to get just the image url, so to be included in the attribute
src, you can usewp_get_attachment_thumb_url()that takes as a parameter the ID of thumbanail. The latter get throughget_post_thumbnail_id(), as a parameter that takes the ID of the post.@ Giovambattista Fazioli:
Thank you! ^ _ ^
congratulations for the work done. Have you counted a place in my rss-reader ^ _ ^
Hello, I use WP 3.2.1 installed with the theme Costelo. my problem 'that I can not delete thumbnail images, the thumbnails anyway ... when I go to click on the link "remove image out" ... I read the link and clicking action = edit # nothing happens ... same problem in trying to change the status of visibility 'and other little things but' I can change by editing faster ... I remain short, the problem of removing the thumbnails ... wich 'command should I use to remove the thumbnail (the link that I see Move your mouse over to "remove image"? I have to go in that file to restore the right code?
Gazie
Hello, I kindly need to know if these strings are used to trigger the display of thumbnails in the post, I do not understand anything of this language but I saw that the
add_theme_support('post-thumbnails');is present in my essay, in If your serve to place them exactly where I'm supposed previews? can you give me a hand?thanks
@ Simon: the function adds specified by you (or skill if you prefer) the ability to set the thumbnail for each post, but by itself does not display anything. If I understand correctly:
to do this there are usually three ways:
1) Use a theme that already permits
2) Install a Plugin
3) manually Act
Excluding the first, you can solve by itself, if I wanted to automatically display the thumbnails (if present) in a post just add these lines of code to your file
functions.phpin the folder of your active theme:2
3
4
5
6
7
8
9
10
11
12
; global $ post;
$content ; Original_content $ = $ content;
current_theme_supports ( 'post-thumbnails' ) ) { if (current_theme_supports ('post-thumbnails')) {
the_post_thumbnail ( ) ; $ Content = the_post_thumbnail ();
$original_content ; $ Content. = $ Original_content;
}
; return $ content;
}
, 'showThumbnail' ) ; add_filter ('the_content', 'showThumbnail');
Code like the above will find many online, according to your needs. I see you I created a simple as possible to keep them straight. I understand that if you're not a "technical" experience can be frustrating and tiring, better then a theme prefatto or use of a plugin. Hope that help ...
@ Vito :: the link is correct, since the removal of the thumbnail is via JavaScript, here is an example:
Probably, from what I understand, your problem is a malfunction of the issue, something hard to settle here ...
@ Giovambattista Fazioli ::
Thanks!!
)))
very very nice ... I'll try ... I do not work more than anything
Have a good day.
[...] Allows you to associate a thumbnail to a post, personalized page or post. If the entire image is easy to extract from the code, thanks [...]
Congratulations!
Guide very interesting.
Council if you want to restore all the thumbs plugin Regenerate Thumbnails
Hi I wanted to ask you how you can help:
in post I have uploaded a gallery of 50 images, for example, then the queue will be displayed in Article 50 thumbnails 100 × 100. I would like to figure out how to display only 5 in the article and click on one of these pictures I found on page 5, the existing (attachment.php), with the full gallery of all 50 images.
Thanks
But how can you create the thumb and attach it to the post as imamgine out?
Hi, sorry to resurrect an old post but I hope you can give me a hand. How do I, with this method, using images loaded via an external link http://www.sito.it/image.jpg ?
For now I can only upload images from my hosting but I would not weigh too much space. How can I do?
Thanks in advance
@ GM: If you upload images to a different server (that WordPress can not do his) can set up a miniature sheet by selecting the source URL as shown in this post (start of article). In this way, WordPress will use an absolute address to deal with this miniature.
Also, 'you lose' any downsizing of the same, you have to do on the remote server and / or acting through the CSS.