【Lightningテーマ】カテゴリーページや検索結果ページで「続きを読む」ボタンが文字に重なる時のCSS修正

Lightningテーマで、カテゴリーページや検索結果ページの「続きを読む」ボタンが本文と重なってしまうことがあります。
この原因は、position: absolute; の指定や z-index の競合によるものです。
この記事では、重なりを防ぐための安全なCSS修正方法を紹介します。

1 実装のポイント

• Lightningテーマ特有の .vk_post 構造に対応。
• カテゴリーページ（body.category）と検索結果ページ（body.search）を限定修正。
• position を relative／static に変更し、自然なフローで配置。
• 他テーマやトップページには影響を与えない安全なスコープ指定。

/* ---------------------------------------------
 * Lightningテーマ用：カテゴリー・検索結果ページ専用
 * 続きを読むボタンの重なり防止
 * --------------------------------------------- */

body.category .vk_post_btnOuter,
body.search .vk_post_btnOuter {
  position: relative !important; /* 固定解除 */
  display: block !important;
  margin-top: 10px !important; /* テキストとの余白 */
  margin-bottom: 20px !important; /* 下に余白を確保 */
  z-index: 10 !important; /* 画像などの上に配置 */
}

body.category .vk_post_btn,
body.search .vk_post_btn {
  position: static !important; /* ボタン自体も固定解除 */
  display: inline-block !important;
  margin-top: 10px !important;
}

2 補足

3 修正後イメージ

4 まとめ

Lightningテーマでは、ボタン位置の崩れはCSSの指定優先度の問題であることが多いです。
本記事のコードを追加することで、カテゴリーページや検索結果ページでも
「続きを読む」ボタンが自然な位置に表示されるようになります。