【コピペOK！】Cocoonのエントリーカードをオシャレにカスタマイズ！│まるめも

こんにちは。まこまる(@makomarublog)です。

今回は、無料WordPressテーマ「Cocoon」のエントリーカードをオシャレにカスタマイズする方法を紹介します。

※カスタマイズの際は必ずバックアップをとり、不具合等は自己責任でお願いします。

1 1. Cocoon設定→インデックスで設定を変更
2 2. CSSをコピペ
- 2.1 タイトルの文字サイズを変える
- 2.2 タイトルの色を変える
3 3. エントリーカードをふわっと浮き上がらせる＆メインカラムの背景を透明にするカスタマイズ

1. Cocoon設定→インデックスで設定を変更

・カードタイプを縦型カード2列にする
・「スマホ端末で縦型＆タイル型のエントリーカードを1カラムにする」にチェック
・「カードの枠線を表示する」のチェックを外す
・「スニペット（抜粋）の表示」のチェックを外す

変更後は「変更をまとめて保存」を押すのを忘れないように。
以上で設定は完了です！

2. CSSをコピペ

下記のコードをstyle.cssか追加CSSにコピペしてください。

外観 → テーマの編集 → スタイルシート(style.css)

外観 → カスタマイズ → 追加CSS

a.entry-card-wrap.a-wrap.border-element.cf{
padding:0 0 .5em;
}
h2.entry-card-title.card-title.e-card-title{
font-size:18px;
color:#7b7b7b;
font-weight:bold;
text-align:center;
line-height:1.8em;
margin-top:0.5em;
margin-bottom:0em;
padding: 0 1em 0;
}
.entry-card-wrap {
box-shadow: 0px 1px 5px 0 rgba(0,0,0,.2);
}

Copy

コピペできたら保存を忘れずに！