wordpress ページ毎のヘッダ画像をアイキャッチで変更する方法 2011年3月3日
Tag: | | |


wordpress3.0から「アイキャッチ画像」という機能が追加されました。
アイキャッチ機能を使ってページ毎にヘッダ画像を変更する方法です。

1.アイキャッチ機能を有効にするには、functions.phpの一番上?phpの下に下記を追加します。

// サムネイル画像の表示設定
add_theme_support('post-thumbnails');
set_post_thumbnail_size(1040, 470, true); //1.ヘッダ画像
add_image_size('mainimg', 300, auto, true); //2.任意のサイズ
上記の( 780, 101, true )は画像の幅が780px、縦が101という意味です。

2.header.phpの画像を表示したい場所に下記を追加

 <?php the_post_thumbnail('thumbnail'); ?> //set_post_thumbnail_size(1040, 470, true); //1.ヘッダ画像の場合
<img src="<?php echo catch_that_image(); ?>"/> //2.任意のサイズ

3.後は、ページの編集ページの右端に「アイキャッチ画像を設定」ボタンが追加されているはずなのでそこで画像をupロードします。

4.アイキャッチが登録されていない場合は任意の画像を分岐で表示

<?php if(have_posts()): while(have_posts()): the_post(); ?>
    <?php if (has_post_thumbnail()) : ?>
        <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('thumbnail'); ?></a>
    <?php else : ?>
        <a href="<?php the_permalink(); ?>"><img src="<?php bloginfo('template_url'); ?>/img/noimage.gif" width="100" height="100" alt="デフォルト画像" /></a>
    <?php endif ; ?>
<?php endwhile; endif; ?>

5.カスタム投稿タイプでアイキャッチを表示。
functions.phpに下記を追加

register_post_type(
    'event', //カスタム投稿タイプ名
    // 'supports'に'thumbnail'を追記
    array('supports' => array('title','editor','thumbnail'))
);

関連記事

New

Aechive

Tag

css Facebook facebookカスタマイズ Facebookページ facebooRSS font functions.php google NEWマーク photoshop RSS SEO single.php webツール WEBデザインツール Wordpress アイコン アーカイブ エディタ カスタム カスタムタクソノミー カスタムフィールド カスタムフィールドテンプレート カスタム投稿 カテゴリー カレンダー クリップアート サイドバー ターム テキスト テンプレートタグ パターン ブラシ プラグイン ヘッダ ページ 人気 便利 分岐 文法チェック 月別アーカイブ 特定カテゴリー 画像 記事