xeoryのアイキャッチ画像をフルサイズで表示させる方法

xeoryのアイキャッチ画像をフルサイズで表示させる方法

今回はwordpressテーマのxeoryの投稿記事の冒頭に表示されるアイキャッチ画像をフルサイズで表示させる方法について紹介していきたいと思います。

目次

xeoryのアイキャッチ画像をフルサイズで表示させる方法

投稿記事の冒頭に表示されるアイキャッチ画像のサイズ変更をする場合は、ファイル「single.php」の中身を書き換えることでできます。

アイキャッチを呼び出すコードは44行目あたりから始まる下記の部分になります。

<section class="post-content" itemprop="text">
      
        <?php if( get_the_post_thumbnail() ) : ?>
        <div class="post-thumbnail">
          <?php the_post_thumbnail(); ?>
        </div>
        <?php endif; ?>
        <?php the_content(); ?>

</section>

上記がアイキャッチ画像を表示させるコードになるので、ここの<?php the_post_thumbnail(); ?>を<?php the_post_thumbnail( ‘full’ ); ?>に書き換えます。

<section class="post-content" itemprop="text">
      
        <?php if( get_the_post_thumbnail() ) : ?>
        <div class="post-thumbnail">
          <?php the_post_thumbnail( 'full' ); ?>
        </div>
        <?php endif; ?>
        <?php the_content(); ?>

 </section>

あとは書き換えたファイルをFTPを使ってアップロードすれば、アイキャッチ画像を小さいサイズからフルサイズにサイズ変更させることができます。

アイキャッチ画像をフルサイズで表示

サムネイルサイズからフルサイズへとサイズ変更されました。

phpファイルの修正になるので、エラー対策のためになるべく親テーマではなく子テーマでやるのがおすすめです。

xeoryのアイキャッチ画像を表示させない方法

xeoryの投稿記事の冒頭に表示されるアイキャッチ画像をフルサイズで表示させる別の方法としては、そもそもxeoryのアイキャッチ画像を表示させないようにしておいてから、個別に手動で記事の冒頭画像を挿入するという方法もあります。

アイキャッチ画像と記事の頭に持ってくる画像を別々にしたい場合は、このような方法を取ると良いでしょう。

投稿記事のアイキャッチ画像を表示させないようにする方法としては、これもsingle.phpのアイキャッチ画像を表示させるコードを削除して、画像を非表示にさせるように修正を加えていきます。

<?php if( get_the_post_thumbnail() ) : ?>
<div class=”post-thumbnail”>
<?php the_post_thumbnail(); ?>
</div>
<?php endif; ?>

この部分を削除すれば投稿記事のアイキャッチ画像を表示させないようにすることができます。

まとめ

以上アイキャッチ画像をフルサイズにサイズ変更したい場合は、基本的にsingle.phpの「<?php the_post_thumbnail(); ?>」を「<?php the_post_thumbnail( ‘full’ ); ?>」に修正すると良いでしょう。

ただしアイキャッチ画像と記事の最初に持ってくる画像を別々にしたい場合は、single.phpのアイキャッチ画像を表示させるコードを削除するのも手です。

コメント

タイトルとURLをコピーしました