いまやブログにおいてアイキャッチ画像は無くてはならない存在になりつつあります。
特にWordPressにおいては、基本的にアイキャッチ画像を設定することが出来るようになっているテーマがほとんどです。
しかし、その幾度となくどれにしようか選びに選んだアイキャッチ画像ですが多くの場合は記事内には表示されません。(テーマにもよります。)
そこで…。
Loading…
車メンテナンス・カスタマイズ・点検・修理、WordPressカスタマイズ、PC設定、車、時事ネタ、情勢、日々の出来事など津々浦々に綴っていきます。
Stinger6 Stinger7 WordPress カスタマイズ カスタマイズ 伝えたいこと 備忘録
所要時間目安:約2分
この記事は2017年2月7日のものです。現在は状況が異なる可能性がありますのでご注意ください。
Stinger6 Stinger7 WordPress カスタマイズ カスタマイズ 伝えたいこと 備忘録
+本日の人気記事TOP10+
いまやブログにおいてアイキャッチ画像は無くてはならない存在になりつつあります。
特にWordPressにおいては、基本的にアイキャッチ画像を設定することが出来るようになっているテーマがほとんどです。
しかし、その幾度となくどれにしようか選びに選んだアイキャッチ画像ですが多くの場合は記事内には表示されません。(テーマにもよります。)
そこで…。
アドセンス336pxPC閲覧記事下表示1つ目コード
+これまでによく読まれている記事一覧クリックでOPEN+
2つの方法があるのですが、
基本的なテーマなどの場合には以下のコードを自分が記事内で出力させたい場所にコピー・アンド・ペーストでOKです。
以下のコードになります。
<!? ここからアイキャッチ画像 ?>
<div class=“post-thumbnail”>
<?php the_post_thumbnail(‘full’);?>
</div>
<!? ここまでアイキャッチ画像 ?>
このコードを例えば…。
ただアイキャッチ画像はそのまま100%(full)の状態で出力されて表示されるので、
ちゃんと、
アイキャッチ画像の大きさを考えてのアイキャッチ画像設定をしていないとやたらと大きな画像になってしまいます。orz
こちらも基本的には、
上記と同じなのですが、class指定でCSSによって大きさを任意に調整することが可能になります。
まずはsingle.php内に任意の場所に追記するコードです。
<!? ここからアイキャッチ画像 ?>
<div align="center">
<div class="st-eyecatch"><?php the_post_thumbnail('full'); ?>
</div>
</div>
<!? ここまでアイキャッチ画像 ?>
ここで、class指定をst-eyecatchと設定しました。
なので、
今回の場合は以下のコードのようになります。
.st-eyecatch
{
margin: -20px -15px 15px;
}
.st-eyecatch img
{
width:100%;
background-color: #000;
}
参考)
今回はStinger6のテーマを使わせていただいているのでst-eyecatchとしました。class指定のネーミングは他とかぶらなければ任意のclass名で大丈夫です。
pickup)
アンダーライン赤色の部分の数字を100%から自分のブログやデザインに合わせてパーセンテージを上げたり下げたりして調整してみてください。
これまで、
アイキャッチ画像をせっかく悩んで選びに選んで設定してきたのに、記事を読んでくれる人にはそのアイキャッチ画像を見てもらえない…。
だから、2度手間をかけて投稿記事のはじめに自分でアイキャッチ画像と同じ画像を設定していた方々などはもう2度手間をかける必要はありません。
せっかくのアイキャッチ画像です。
是非、是非、試してみてください!(^-^)!
2024-04-18
KINTOのサブスクリプションサービスは、自動車保険(任意保険)や自動車税、メンテナンスなど、カーライフにかかる諸費用を含めた月々定額の利用料を支払うこと ...
2024-04-18
○まとめ:月刊自家用車編集部. 手軽にランクルオーナーに. KINTOのサブスクリプションサービスは、自動車保険(任意保険)や自動車税、メンテナンスなど ...
2024-04-18
米澤吉二(よねざわよしじ) / リペア・メンテナンス. トータルリペア工房吉楽. リフォーム・内装工事 · リペア・メンテナンス · 車修理・自動車整備. お電話で ...
2024-04-18
... 車サイズでかかるおおよその金額です。実際は車両によって異なります. □10年/10万kmをともに歩むには定期メンテナンスが必須!
2024-04-18
しかし“クルマの中にいれば大丈夫”と思っているドライバーもいるだろうが、車内は密閉空間ではないため想像以上に外気が入り込んでくる。そこには花粉や黄砂も ...
昨今…。 といっても、 ここ数年ページ表示速度もSEO対策のひとつにもなります。 また、 検索してくれた方がそのサイトが表示されるのになかなか表示されないと離脱率どころではなく、 サイトにすら訪れてく…
インフィード広告アドセンス
意外と知られていないのが、キッチンシンクからいつもと違う臭いや異臭や下水臭い強烈な匂いが出てくることがあります。いくらシンク内をカビキラーやキッチンハイターなどの塩素系漂白剤などできれいにしても・・・…
インフィード広告アドセンス
PC Windows10 不具合 伝えたいこと 備忘録 設定
Windows10がリリースされて早いもので約1年4ヶ月が経とうとしています。 そんな中Windows10がリリースされた直後は日本語入力のIMEがマイクロフト社製の生粋のMicrosoftIMEしか…
インフィード広告アドセンス
約1ヶ月半くらい前に、とあるお店から何月何日をもって閉店しますので、30%から最大80%オフの閉店セールを行ないます。そんなこと書かれていたら行っちゃうでしょぉ。とりあえずは…。だって、最大80%オフ…
インフィード広告アドセンス
先日公開させていただいた記事(:AMP化する方法プラグインなしで対応してみる)でWordPressにおいてプラグインを使用しないでなんとかAMP対応できないかなぁ。と思い試行錯誤中です。 先日の状態で…
インフィード広告アドセンス
まぁ、誰もが思う。 自動販売機みたいにお金がちゃりんちゃりんって置いてあるだけで、収入得られないのかなぁ。 なんてことってあると思います。 家賃収入もそうなのではないでしょうか。 でも、…
世界中でNo.1のシャアを誇るAmazonでのお得なお買い物でお得をしよう!!ネット通販なので、もちろん24時間年中無休です。健康商品から食品、車カスタマイズ商品、大手家電メーカー商品やパソコンの自作サプライ商品、その他アマゾン・プライムでは映画やドラマなど多くの作品や番組を見ることができます。マスクなど衛生商品も今では必須アイテム。一番信用できて一番商品数の多いAmazonでの買い物が絶対にオススメ!!
Multiplex 広告
アドセンス336pxPC閲覧記事下表示1つ目コード
よろしかったらシェアよろしくお願いします。
-Stinger6, Stinger7, WordPress, カスタマイズ, カスタマイズ, 伝えたいこと, 備忘録
このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください。
This site is protected by reCAPTCHA and the GooglePrivacy PolicyandTerms of Serviceapply.
このサイトはreCAPTCHAによって保護されており、Googleのプライバシーポリシーと利用規約が適用されます。
comment