Function Reference/the post thumbnail

原文链接:http://codex.wordpress.org/Function_Reference/the_post_thumbnail

Description

Display Post Thumbnail as set in post's edit screen. This tag must be within The Loop.

Note: To enable post thumbnails, the current theme must include add_theme_support( 'post-thumbnails' ); in itsfunctions.php file. See also Post Thumbnails.

Usage

 <?php the_post_thumbnail$size$attr ); ?> 

Parameters

$size
( string/array) ( Optional) Image size. Either a string keyword (thumbnail, medium, large, full), or any custom size keyword defined by  add_image_size(), or a 2-item array representing width and height in pixels, e.g. array(32,32).
Default: 'post-thumbnail', which theme sets using  set_post_thumbnail_size.

PLEASE NOTE: The crop does not work in Wp 3.0+. All that is needed for WP 3.0+ is the call for the thumbnail to post. Then proceed to media in the dashboard and set your thumbnail to crop to the size you wish to use.

$attr
( array) ( Optional) Array of attribute/value pairs. For details, search source for the function that  the_post_thumbnail relies on:  wp_get_attachment_image
Default: None
$default_attr = array(
			'src'	=> $src,
			'class'	=> "attachment-$size",
			'alt'	=> trim(strip_tags( wp_postmeta->_wp_attachment_image_alt )),
			'title'	=> trim(strip_tags( $attachment->post_title )),
		);

Examples

Default Usage

<?php 
if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
  the_post_thumbnail();
} 
?>
<?php the_content(); ?>

Note: To return the Post Thumbnail for use in your PHP code instead of displaying it, use: get_the_post_thumbnail()

Thumbnail Sizes

The default image sizes of WordPress are "thumbnail", "medium", "large" and "full" (the size of the image you uploaded). These image sizes can be configured in the WordPress Administration Media panel under Settings > Media. This is how you can use these default sizes with the_post_thumbnail():

the_post_thumbnail();                  // without parameter -> Thumbnail

the_post_thumbnail('thumbnail');       // Thumbnail (default 150px x 150px max)
the_post_thumbnail('medium');          // Medium resolution (default 300px x 300px max)
the_post_thumbnail('large');           // Large resolution (default 640px x 640px max)
the_post_thumbnail('full');            // Full resolution (original size uploaded)

the_post_thumbnail( array(100,100) );  // Other resolutions

Register new image sizes for Post Thumbnails with: add_image_size().
To set the default size for Post Thumbnails see: set_post_thumbnail_size().

Post Thumbnail Linking to the Post Permalink

Note: Don't use these two examples together in the same Theme.

example 1. To link Post Thumbnails to the Post Permalink in a specific loop, use the following within your Theme's template files:

 <?php if ( has_post_thumbnail()) : ?>
   <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>" >
   <?php the_post_thumbnail(); ?>
   </a>
 <?php endif; ?>

example 2. To link all Post Thumbnails on your website to the Post Permalink, put this in the current Theme'sfunctions.php file:

add_filter( 'post_thumbnail_html', 'my_post_image_html', 10, 3 );

function my_post_image_html( $html, $post_id, $post_image_id ) {

  $html = '<a href="' . get_permalink( $post_id ) . '" title="' . esc_attr( get_post_field( 'post_title', $post_id ) ) . '">' . $html . '</a>';
  return $html;

}

Post Thumbnail Linking to Large Image Size

This example links to the "large" Post Thumbnail image size and must be used within The Loop.

 <?php 
 if ( has_post_thumbnail()) {
   $large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'large');
   echo '<a href="' . $large_image_url[0] . '" title="' . the_title_attribute('echo=0') . '" >';
   the_post_thumbnail('thumbnail');
   echo '</a>';
 }
 ?>

Styling Post Thumbnails

Post Tumbnails are given a class "wp-post-image". They also get a class depending on the size of the thumbnail being displayed You can style the output with these CSS selectors:

img.wp-post-image
img.attachment-thumbnail
img.attachment-medium
img.attachment-large
img.attachment-full

You can also give Post Thumbnails their own class.
Display the Post Thumbnail with a class "alignleft":

<?php the_post_thumbnail('thumbnail', array('class' => 'alignleft')); ?>
Style edit
<?php $default_attr = array('style' => "border:0;"); ?>
the_post_thumbnail('small-post-thumbnail',$default_attr);}?>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值