超人気の『Simplicity2』の後継『Cocoon』のデモサイトを兼ねています。

Cocoonでブログカードを使用しない

8年ぶりの更新です💦

ずっとWordpressから遠ざかっていた訳ではありませんが、別テーマで別のサイトをボチボチいじってました。
今回、PHPバージョンを上げなさいというダッシュボード様からのお告げで、一斉にバージョンアップしたところ、二番手テーマのサイトだけが全滅しました。それはブログカードを使用しなくてもOKなテーマだったのですごく気に入っていたのです。
しばらくは呆然としましたが、気を取り直して該当のサイトだけ一時的にPHPバージョンを7.4に戻してテーマを変更して救出に成功しました。
大事なサイトだけはCocoonにしたのですが、カスタマイズの方法は忘れるわテーマのバージョンアップで仕様変更になってるわで、エライことになってました。
と、そんなこたぁどうでもいい。この際だから「Cocoonでブログカードを使用しない」という暴挙に挑戦してみた次第です。
「Google検索のAIモード様」が救世主になってくださいました。
以下がアイモ姫(AIモード様のことですがなにか?)が授けて下さったありがたーいお経、いや、CSSです。

style.css

/* ==========================================================
 * 1. 【最優先】内部ブログカード(標準)の文字サイズ変更と抜粋消去
 * ========================================================== */
.internal-blogcard .blogcard-title,
.blogcard-wrap .blogcard-title,
.wrap-inside .blogcard-title,
.blogcard-title {
  font-size: 22px !important;    /* 文字の大きさ(お好みで 20px〜24px に調整してください) */
  font-weight: bold !important;  /* 確実に太字にする */
  display: block !important;
}

/* 抜粋テキスト(説明文)を丸ごと非表示 */
.internal-blogcard .blogcard-content,
.blogcard-wrap .blogcard-content,
.blogcard-content {
  font-size: 0 !important;       
  color: transparent !important; 
  line-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* 抜粋を消した影響を回避してタイトル文字サイズを固定 */
.internal-blogcard .blogcard-title *,
.blogcard-wrap .blogcard-title *,
.blogcard-title * {
  font-size: 22px !important;
}


/* ==========================================================
 * 2. 【最優先】アイキャッチ画像・サムネイルの完全非表示
 * ========================================================== */
.blog-card-thumb,
.blog-card-thumbnail,
.entry-card-thumb,
.entry-card-thumbnail,
.eye-catch,
.blogcard-thumbnail,
.blogcard-thumb {
  display: none !important;
}

/* 画像が消えた分の横幅を100%に広げて文字だけにする */
.blog-card-content,
.entry-card-content,
.blogcard-content {
  margin-left: 0 !important;
  width: 100% !important;
}


/* ==========================================================
 * 3. 【最優先】カテゴリーをリンク文字だけにする
 * ========================================================== */
.entry-categories,
.cat-label,
.cat-name,
.entry-category {
    background: none !important; /* 背景色を消す */
    border: none !important;     /* 枠線を消す */
    padding: 0 !important;       /* 余白を消す */
    margin: 0 !important;        /* マージンを消す */
    display: inline !important;  /* インライン表示にする */
    font-weight: normal !important; /* 太字を解除 */
}

/* カテゴリーのリンク色を通常のテキスト色にする */
.entry-categories a,
.cat-label a,
.cat-name a,
.entry-category a {
    color: inherit !important;   /* 親要素の文字色(黒など)を継承 */
    text-decoration: none !important; /* 下線を消す */
}

/* マウスを乗せたときだけ下線を出す */
.entry-categories a:hover,
.cat-label a:hover,
.cat-name a:hover,
.entry-category a:hover {
    text-decoration: underline !important;
}

 
タイトルの文字サイズや装飾なども頑張って下さったのですが、現状わたしのサイトではカテゴリー別アーカイブ等のブログカードと本文抜粋が消せただけに終わっています。もしかしたらキチンと機能しているかもしれませんが、わたしのこだわりの改造がCSSと喧嘩してしまっているのかも。ご興味ある方はカスタマイズ>追加CSSにポチっとコピペしてみてください。

タイトルとURLをコピーしました