カテゴリーの一覧表示に画像を表示したい
また調べてみたのですが、良く分からない部分が出てきたので、皆さんのお知恵を拝借できないでしょうか？
ブログの記事にカテゴリーってつけられると思うのですが、それをプラグインで表示している場合も多いと思います。
私のページでもそうなのですが、そのカテゴリーをクリックすると、カテゴリーに登録された記事一覧が出ると思います。
その時に、私のページでは記事タイトルのみが、ずらっと表示される感じなのですが、そこに分かり易いように画像を表示する事っ て出来るのでしょうか？
メタタグ編集で登録したアイキャッチ画像とか表示できればいいのですが、できるものなのでしょうか？
まだまだ記事が少ないページなのですが、今のうちに過去記事の探しやすさ、見やすさを向上させたいと思っています。
もし解決策分かる方おられましたら、是非教えて頂ければと思います。
よろしくお願いします。
一応自分のページを貼っておきますね。（R-18なので、飛ばれる場合はご注意を）
https://doujinmain.blog.fc2.com/
上手くいったようで良かったです。^^;
後はdivで括っている部分のmarginやpaddingで、見栄えをお好みに調整して下さい。
頑張って下さい。m(__)m
2021年01月05日 00:37 by aki
素早いお返事ありがとうございます。
教えて頂いた通り、<!--topentry-->と< !--/topentry-->を削除してみました。
<!--category_area-->
<div class="section entryfield" id="entry -<%topentry_no>" style="overflow:hidden;&quo t;>
<div class="entry-title"><h3 class=" ;entry-header"><a href="<%topentry_link&g t;"><%topentry_title></a></h3>< /div>
<div style="width:300px;height:200px;float:left;mar gin-right:15px;">
<a href="<%topentry_link>"><%topen try_image_w300></a>
</div>
<div class="entry-body">
<%topentry_description>
<p style="text-align:right;"><%topentry_ year>-<%topentry_month>-<%topentry_day></p >
</div>
</div>
<!--/category_area-->
この記述で張り付けてみたところ、どうやらうまく行ったようです。
通知のポップアップなども出ずにすんなりいきました。
微調整などはまた自分で試行錯誤して試してみます。勉強のために。
分かり易く教えて頂き、とても助かりました。
本当にありがとうございます。
スミマセン。
ソースを入れる場所はそこで構いません。
<!--topentry-->と<!--/topentry-->を外してみて頂けますか？
…それだとエラーは出ないと思うのですが…。
2021年01月04日 20:15 by aki
大変お返事遅れて申し訳ありません。
教えて頂いた通りに差し替えてみたのですが、どこかがうまく行ってないようで、いろいろと自分で調べたりして見たのですが、知 識及ばす頓挫している状態です。
自分なりに調べてみた事やエラーログなどを画像にまとめておきましたので、もし上手く行かない部分がどこかお分かりのようでし たら、教えて頂けると助かるのですが、ダメでしょうか？
akiさんのご回答をきっかけにまた少しHTMLについて理解が進んだ気がします。
本当に助かっております。
お返事遅れてホントすみませんでした。
ファイルサイズで画像が弾かれたので、ブログの方に一時的にアップロードしておきます。
URLはこちら
https://doujinmain.blog.fc2.com/blog-entry-24.html
こんにちは。
ブログのソース見て大雑把ですが作ってみました。
<!--category_area-->
<!--topentry-->
<div class="section entryfield" id="entry -<%topentry_no>" style="overflow:hidden;&quo t;>
<div class="entry-title"><h3 class=" ;entry-header"><a href="<%topentry_link&g t;"><%topentry_title></a></h3>< /div>
<div style="width:300px;height:200px;float:left;mar gin-right:15px;">
<a href="<%topentry_link>"><%topen try_image_w300></a>
</div>
<div class="entry-body">
<%topentry_description>
<p style="text-align:right;"><%topentry_ year>-<%topentry_month>-<%topentry_day></p >
</div>
</div>
<!--/topentry-->
<!--/category_area-->
-----
<!--category_area-->という部分を探して書き換えてみて下さい。
（不具合が有った時のために複製を作っておくことをお勧めします。）
画像が1つも無い記事は何かしらのアイキャッチ画像を記事投稿画面で設定して下さい。
でないと、画像部分が空欄になってしまいます。
画像のサイズは300px×200pxで表示する<%topentry_image_w300>というサムネイル の変数を使っています。
（縦横比に満たない部分は黒背景で補填されます。）
もっと良い書き方が有る方は是非追コメお願い致します。m(__)m
2020年11月11日 16:02 by aki
