* Blogger:次・前の投稿ボタンのデザイン変更

2026年9月23日水曜日

Blogger

t f B! P L

Blogger:次・前の投稿ボタンのデザインを変更したい

◆ 対象:QooQデザイン (過去記事:デザイン変更)

[次の投稿] [前の投稿] ボタンが大きいのでデザインを変更したい。
・ 丸形から四角形へ変更 (画面上部のカテゴリボタンのデザインに準拠)
・ フォントサイズ縮小

対応

追加CSSの末尾(]]></b:skin> の直前)に、以下のコードを貼り付けて保存する。

/* --- [次の投稿] [前の投稿] ボタンのデザイン変更(QooQ専用) --- */

/* ボタン本体(丸形から四角形へ・サイズと文字縮小) */
#blog-pager-newer-link,
#blog-pager-older-link {
  border-radius: 2px !important;    /* 2em(丸形)から2px(角丸の四角形)に変更 */
  padding: 0.5em 1.2em !important;  /* パディング(余白)を小さく */
  font-size: 1.3rem !important;     /* フォントサイズを1.5remから1.3remに縮小 */
  font-weight: bold !important;
  display: inline-block !important;
}

/* 前後のボタンを左右に離してレイアウト整形 */
#blog-pager {
  margin-top: 30px !important;
  display: flex !important;
  justify-content: space-between !important;
}


公開:2026.09.23(水) 07:06 くもり

QooQ