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ページ font functions.php google NEWマーク RSS single.php webツール WEBデザインツール Wordpress アーカイブ カスタム カスタムフィールド カスタムフィールドテンプレート カスタム投稿 カテゴリー カレンダー サイドバー ターム テキスト テンプレートタグ プラグイン ヘッダ ページ ポップアップ メニュー 並び替え 並べ替え 人気 便利 分岐 印刷 年別アーカイブ 投稿 投稿記事 改行 文字数 文法チェック 最新記事 月別アーカイブ 特定カテゴリー 画像