Warning: Constant POST_PLUGIN_LIBRARY already defined in /home/pasora/pasona-sp.com/public_html/wp-content/plugins/similar-posts/similar-posts.php on line 27
特定カテゴリーの画像入り一覧ページを作る | 思いだし にっき
サイトアイコン 思いだし にっき

特定カテゴリーの画像入り一覧ページを作る

<p><img class&equals;"aligncenter size-full wp-image-12131" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2016&sol;11&sol;3300663&lowbar;s&period;jpg" alt&equals;"" width&equals;"384" height&equals;"288" &sol;><&sol;p>&NewLine;<p>特定のカテゴリーを一覧表示して目次のようにしようと<br &sol;>&NewLine;固定ページに画像と簡単な説明つきのものを作ってみました<&sol;p>&NewLine;<p><&excl;--more--><&sol;p>&NewLine;<h2>手動で作った一覧ページ<&sol;h2>&NewLine;<p>WordPressのダッシュボードのメニューから<&sol;p>&NewLine;<p>「固定ページ」 &Implies; 「新規追加」で投稿画面を開きます。<&sol;p>&NewLine;<p>普通の記事投稿の時のように、一覧にする「タイトル」と「説明文」を入力します。<&sol;p>&NewLine;<p>アイキャッチ画像とは別の画像を付けたくて、プラグインは使わずに手動で挿入してリンクを貼りました。<&sol;p>&NewLine;<p>固定ページの投稿をビジュアルタブでみたところ、こんな感じに思ったようにできたのだけど<br &sol;>&NewLine; <&sol;p>&NewLine;<p><img class&equals;"alignnone size-full wp-image-1458" src&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2016&sol;11&sol;ichiran1&period;png" alt&equals;"手動でリンクの一覧" width&equals;"647" height&equals;"459" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>プレビューしてみたら文字のまわりこみがなくなって、画像の下になってしまう。<&sol;p>&NewLine;<p>どうも気に食わない・・・<&sol;p>&NewLine;<p> <br &sol;>&NewLine;<img class&equals;"alignnone size-full wp-image-1460" src&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2016&sol;11&sol;ichiran2&period;png" alt&equals;"文字がまわりこまない" width&equals;"639" height&equals;"509" &sol;><br &sol;>&NewLine; <br &sol;>&NewLine;文字の回り込みの設定をしているのになぜなんだ?<&sol;p>&NewLine;<p>検索してみると、CSSに書き加えるというのがほとんど。<&sol;p>&NewLine;<p> <br &sol;>&NewLine;CSSは今までも、なんとかみようみまねでいじったものもあったけど・・・<&sol;p>&NewLine;<p>でも、CSSがよくわかっていないのであまりいじりたくないというのが本音。<&sol;p>&NewLine;<p>そして、htmlに書き加えるだけの方法をみっけ!(^o^)<&sol;p>&NewLine;<p>参考にさせていただいたのはこちら&Implies;http&colon;&sol;&sol;private-gardman&period;com&sol;post-230&sol;<&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>画像の挿入のhtmlの最後に【align&equals;”left”】を書き加えてみました。<br &sol;>&NewLine; <&sol;p>&NewLine;<p><img class&equals;"alignnone size-full wp-image-1459" src&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2016&sol;11&sol;ichiran3&period;png" alt&equals;"手動で一覧ページ完成" width&equals;"643" height&equals;"435" &sol;><&sol;p>&NewLine;<p> <br &sol;>&NewLine;ふふふ。なんとかなりましたヽ&lpar;&Hat;。&Hat;&rpar;ノ<&sol;p>&NewLine;<p> <br &sol;>&NewLine;出来上がったものは、画像と文字がくっつきすぎなので<&sol;p>&NewLine;<p>今度は画像を加工するときに余白も入れるといいかなと思ったところで一応完了。<&sol;p>&NewLine;<p> <br &sol;>&NewLine;記事数が少ないのはこれでOKでしたが・・・<&sol;p>&NewLine;<p>記事が多いカテゴリーや、これから増えていく予定のものはこれでやっていると手間ばかりかかります。<&sol;p>&NewLine;<p>やっぱりプラグイン使うしかないかな~<&sol;p>&NewLine;<p>と、いうところでプラグインを使用したのは次に書きます。<&sol;p>&NewLine;<p>以前の記事<br &sol;>&NewLine;<a href&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;1353&period;html">WordPressのサイドバーと固定ページにプロフィールを設定するには<&sol;a> へ<&sol;p>&NewLine;<p>次の記事<br &sol;>&NewLine;<a href&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;1476&period;html">「Shortcodes Ultimate」プラグインで簡単画像つき一覧ページを作る<&sol;a> へ<&sol;p>&NewLine;<p style&equals;"text-align&colon; right&semi;"><a href&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;page-1472&period;html"><span style&equals;"color&colon; &num;0066cc&semi;">WordPress一覧へ<&sol;span><&sol;a><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p><a href&equals;"&sol;&sol;diary&period;blogmura&period;com&sol;ranking&period;html" target&equals;"&lowbar;blank" rel&equals;"noopener"><img src&equals;"&sol;&sol;diary&period;blogmura&period;com&sol;img&sol;diary88&lowbar;31&period;gif" alt&equals;"" width&equals;"88" height&equals;"31" border&equals;"0" &sol;><&sol;a><br &sol;>&NewLine;<a href&equals;"&sol;&sol;diary&period;blogmura&period;com&sol;ranking&period;html" target&equals;"&lowbar;blank" rel&equals;"noopener">にほんブログ村<&sol;a><&sol;p>&NewLine;<p><a title&equals;"日々の出来事 ブログランキングへ" href&equals;"http&colon;&sol;&sol;blog&period;with2&period;net&sol;link&period;php&quest;1839199&colon;9200"><img src&equals;"http&colon;&sol;&sol;blog&period;with2&period;net&sol;img&sol;banner&sol;c&sol;banner&lowbar;1&sol;br&lowbar;c&lowbar;9200&lowbar;1&period;gif" width&equals;"110" height&equals;"31" border&equals;"0" &sol;><&sol;a><br &sol;>&NewLine;<a style&equals;"font-size&colon; 12px&semi;" href&equals;"http&colon;&sol;&sol;blog&period;with2&period;net&sol;link&period;php&quest;1839199&colon;9200">日々の出来事 ブログランキングへ<&sol;a><&sol;p>&NewLine;&NewLine;

モバイルバージョンを終了