2012/12/21

WordPressでアイキャッチの設定

tags : / /

WordPressでは、投稿ごとにアイキャッチ画像(サムネイル)を入れることが出来ます。
まずは、function.phpに以下のコードを追加します。 

function.php

/** 投稿サムネイル画像(アイキャッチ画像)を表示 */
if ( function_exists( 'add_theme_support' ) )
add_theme_support( 'post-thumbnails' );

/**投稿一覧にサムネイルを表示 */
if ( !function_exists('fb_AddThumbColumn') && function_exists('add_theme_support') ) {

// for post and page
add_theme_support('post-thumbnails', array( 'post', 'page', 'カスタムポスト名' ) );

function fb_AddThumbColumn($cols) {

$cols['thumbnail'] = __('Thumbnail');

return $cols;
}

function fb_AddThumbValue($column_name, $post_id) {

$width = (int) 35;
$height = (int) 35;

if ( 'thumbnail' == $column_name ) {
// thumbnail of WP 2.9
$thumbnail_id = get_post_meta( $post_id, '_thumbnail_id', true );
// image from gallery
$attachments = get_children( array('post_parent' => $post_id, 'post_type' => 'attachment', 'post_mime_type' => 'image') );
if ($thumbnail_id)
$thumb = wp_get_attachment_image( $thumbnail_id, array($width, $height), true );
elseif ($attachments) {
foreach ( $attachments as $attachment_id => $attachment ) {
$thumb = wp_get_attachment_image( $attachment_id, array($width, $height), true );
}
}
if ( isset($thumb) && $thumb ) {
echo $thumb;
} else {
echo __('None');
}
}
}

// for posts
add_filter( 'manage_posts_columns', 'fb_AddThumbColumn' );
add_action( 'manage_posts_custom_column', 'fb_AddThumbValue', 10, 2 );

// for pages
add_filter( 'manage_pages_columns', 'fb_AddThumbColumn' );
add_action( 'manage_pages_custom_column', 'fb_AddThumbValue', 10, 2 );
}

 

アイキャッチ画像を読み込むのは、以下のコードをテンプレートファイルに追加します。

 

テンプレートファイル

<?php if ( has_post_thumbnail() ): // サムネイルを持っているときの処理 ?>

<a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>">
<?php $title= get_the_title(); the_post_thumbnail('画像サイズのID', array( 'alt' =>$title, 'title' => $title)); ?>
</a>

<?php else: // サムネイルを持っていないときの処理 ?>
<a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>">
<img src="<?php bloginfo('template_url'); ?>/img/noimg.jpg(サムネイルを持っていないときの画像)" alt=""/>
</a>
<?php endif; ?>

画像サイズのIDには以下が設定できます。

thumbnail : サムネイル
medium : 中サイズ
large : 大サイズ
full : フルサイズ

 

  • このエントリーをはてなブックマークに追加

Profoile

coralqualia
HaraYohei http://coralqualia.com/

当サイトの運営者。 ビジネスを成功へ導くため、「思いをカタチに変える」お手伝いをします。 印刷物、WEBサイトの制作はもちろん、その他なんでもご相談ください。 少しでもお客様のお役に立てればと思っております。 【Service】 ロゴ/販促ツール制作/パッケージ/誌面/各種広告制作/看板サイン/各種印刷 WEBサイト企画立案/Webデザイン/Webサイト制作/CMS(WordPress)構築/ECサイト構築/サーバー運用管理/サイト運営サポート イラスト/キャラクターデザイン Wechatを活用したサービスの提供 /中国でのWEBサイト構築・運営・販促活動