この実装、面倒なら代行します
グローバルメニューの下に来る、ページのコンセプトを表す大きなビジュアルのことをメインビジュアルとかキービジュアル、あるいはヒーローイメージと呼んだりしますが、これをアイキャッチで管理する方法のご紹介です。
$mv_img_id = get_post_thumbnail_id($post->ID); $mv_img_url_array = wp_get_attachment_image_src($mv_img_id, 'full'); $mv_img_url = $mv_img_url_array[0];
まず、これでアイキャッチの画像URLを取得できます。
メインビジュアルの手前にキャッチコピーを出したいという場合には、いろいろ方法はあると思いますが、弊社ではアドバンストカスタムフィールドというプラグインを使って追加したカスタムフィールドで管理しています。
そうすると、以下のような記述でカスタムフィールドを呼び出すことができます。
$mv_copy =''; if( get_field('hero_copy',$post->ID) ){ $mv_copy = get_field('hero_copy',$post->ID); }
あとは、表示側のテンプレートPHP(page.php等)でこれらを呼び出せばOK。
<?php if ($mv_img_url){?> <div style="background-image: url(<?php echo $mv_img_url; ?>);"> <h1><?php echo $mv_copy; ?></h1> </div> <?php } ?>
こうすれば、htmlを知らないユーザーでも自由にメインビジュアルやキャッチコピーを変更することができます。
現在あなたが利用されているWordPressテーマを活かしたまま、このページの事例を解決できるWordPressテーマを、子テーマとして購入できます。
この子テーマを有効化するだけで、現在お使いのデザインテーマにこの事例解決の機能が自動付与されます。
デザインが入っていないため、一般より格段に低い価格(事例の難易度により200円~1.3万円)です。
※ テーマは買い切りです
※ 自由に改変してお使いいただいて構いません
※ すでに子テーマでサイト運用されている方は、当該子テーマをマージしてください
WordPressカスタマイズ事例やウェブ制作ノウハウの新着情報、お役立ち情報を
リアルタイムにメルマガ配信!
100ウェブで手がけた制作・開発案件を一部、ご紹介。
クライアントからご相談いただいた内容とその実装におけるポイント、工期、予算について確認いただけます。
【テレワーク実施中 につきお電話転送中】
コール中1秒程度無音状態になりますがそのままお待ちください。
受付時間
平日 10:00~18:00
メールでのお問い合わせでも
1営業日以内にご連絡いたします。