ワードプレスのサイドバーに表示している「最近の投稿」に、サムネイルを付けたいと思い、プラグインの「Newpost Catch」をインストールしたんだけど、リストマークが出てしまって見栄えの整え方がわからないという方いませんか？
こんな状態です。CSSが苦手な人からしたらあきらめてしまいそうですね（汗）
プラグインの「Newpost Catch」のCSSをかまって修正するのですが、細かな設定がなくてよいのであれば、プラグインのCSSをかまわなくても、CSSが苦手でも、簡単に消せる方法があります。
こちらで紹介しているワードプレスのテーマとスキンは下記のとおり。
- ワードプレステーマは「cocoon」
- スキンは「てがきノート(グリーンオレンジ)」 [作者: ゆうそうと]
プラグインの「Newpost Catch」をインストール
プラグインの追加をしますが方法は「Newpost Catch」をコピーして「新規追加」ページのキーワードにペーストしてください。今すぐインストールというボタンをクリック。「有効化」をクリックで完了です。
それでは早速、Newpost Catchをサイドバーに追加していきましょう。
ウィジェットをサイドバーに追加
Newpost Catchの使い方は、ウィジェットから追加することで使えます。最近の投稿が入っていた場所と入れ替えてください。
左から「Newpost Catch」を追加して、「最近の投稿」削除します。
画面を確認してみると、不要なリストマークが…
消し方は簡単ですので、次の項目に沿って作業してください。
不要なリストマークを削除する方法
検索で調べると、プラグインのCSSをかまっていくと記載があり、絶望した方もいるかもしれません。ここでは、プラグインのCSSは構いません。
下記の画像の黄色の下線が弾いてあるところから、CSS編集ページが開けます。
追加CSSにコピペするCSS
#sidebar ul {
list-style-type: none;
font-size:0.9em;
margin:0;
padding:0;
}
開けたら上記をコピーしておいて「カスタマイズ中追加CSS」の下の入力欄にペーストし「公開」ボタンをクリックで完了です。
画像のサイズは、こちらの画像は200に設定してありますが、サイズは好みに調整してください。
サムネイルサイズ調整の方法
黄色のマーカーで印をしてある項目を確認してください。ここではサイズ幅は200、高さ200で設定してあります。※この編集画面では幅200、高さ170とかに設定しても比率はスクエアのママですので形の変更はできません。
下の黄色のマーカーがしてある項目の「プラグインフォルダ内のデフォルトCSS（チェックすると適用）」ですが、必ずチェックを入れてください。※チェックを外すと、画像とリストが上下に並んでしまいます。
もっと見た目を整えたい！という方はプラグインのCSSの編集からCSSを編集してください。※編集時は必ずバックアップを取り行いましょう。
ちなみにこの方法だと、スマートフォンの画面のリストマークは消えません。
解決できてないじゃないか！そんなかた、ご安心を、そもそもこのプラグインはテーマがcocoonなら不要です（笑）
cocoonテーマの場合はそもそも「Newpost Catch」不要！
cocoonには最初からウィジェットに新着記事という項目がありこれを追加してあげれば、普通にサムネイルが表示されます。
追加したらこちらを設定して完了！
基本的な、設定項目は、
- 表示モード
- 新着記事のタイトル
- 表示数
- 表示タイプ
の4つです。特にこだわりがなければ、設定はそのままでも問題ありません。
そのままだと↑こんな感じです。
ちなみに設定で区切り線をいれ、タイトルを「お知らせ」変えるとこんな感じです↓
ようするにテーマがcocoonであればプラグイン【Newpost Catch】は不要ということです。
簡単に設定ができるので、ご自分の好みで設定を変えてみてはいかがでしょうか？
最後にまとめ
「最近の投稿にサムネイル【Newpost Catch】・出る？！そもそもcocoonなら不要！」でした。
cocoonは無料で使えるワードプレステーマの中では私が知る限りは一番優秀だと思います。
CSSをかまうことなく、いろいろなスキンが選べるのも初心者向けにはありがたいですが、少しCSSをかまうだけで周りと差をつけられるのも素晴らしいです。
CSSが苦手やワードプレス初心者向けに、誰にでも簡単にできる方法というのを掲載しています。
もしわからない箇所がありましたら、さらに詳しく内容を追記いたしますので、お気軽にお問い合わせからお知らせください。
