目次
【Manablog Copy】記事の先頭のアイキャッチ画像を小さくする
Manablog Copyの投稿記事の先頭のアイキャッチ画像は消してはいけません。
先頭のアイキャッチ画像がないとmanablog らしくないです。
でも、ちょっと大きすぎません?
そんな人にスタマイズの仕方を紹介します。
※ カスタマイズをやめて元に戻しています。
アイキャッチ画像のサイズを指定する
追加CSSにコピペすることでアイキャッチ画像サイズを指定できます。
.thumbnail img{
height: 250px!important;
margin: 0px!important;
padding: 0px 0px 20px 0px;
object-fit:cover!important;
}
※横幅を指定してもOK
投稿ページのアイキャッチ画像を変更する
上記では全てのアイキャッチ画像が対象になっちゃいます。
下記のように
single.phpのthumbnailをthumbnail2に変更しました。
<!-- サムネイルの表示 -->
<?php if ( has_post_thumbnail() ) { ?>
<figure><div class="thumbnail2">
CSSも上記と同じthumbnail2に変更しています。
.thumbnail2 img{
height: 250px!important;
margin: 0px!important;
padding: 0px 0px 20px 0px;
object-fit:cover!important;
}
スマホ表示のCSS
スマホ表示は150pxにしています。
250pxを150pxに変更しているだけです。
投稿記事のアイキャッチ画像を標示しない
上記と組み合わせることでスマホ(pc)だけ非表示にできます。
.thumbnail2 img{
display: none;
}