サイトのテーマをWING(AFFINGER5)に切り替えました。ワードプレステーマ AFFINGER4 からの移行です。
とり急ぎ備忘録を兼ねまして
- カスタマイズした所
- こだわった所
- 今後変更する所
書き残します。
目次
通常状態からカスタマイズしたところ
- 文字サイズ(PC 16px へ)
- 文字間隔(letter-spacing : .2px)
- 文章幅 (max-width: 580px)
- 文 位置 (右寄り)
いま読んでいただいている文字部分の数字調節です。文字周りを一番こだわりました。とにかく自分が読みやすい感じへ
文字サイズを大きくしたため、文章幅も 550px ⇒ 580px へ
前に文字サイズを大きくした時は、55歳以上方々を除いて全体の数字が落ちてしまいました。なので今回リベンジです。
メニューの中央ぞろえ (for PC)
コンテンツが少ない為、類似メニューはまとめてさらに中央に寄せました。中央ぞろえの方法は公式サイトコピペで完成。
細かいCSSや、メニューにアイコンを付けたのは次の記事で書いた通りです。
コピペでOK!AFFINGER4のメニューにアイコンをつけるカスタマイズ
余白 感覚
AFFINGER シリーズで僕が残念に思うところが「余白」です。
例えば、デフォルトのfont周りは「詰まりすぎ」な気がして読みづらいです。
を使った空白改行を入れなければならなくなります。
空白の改行が気持ち悪くてダメなタイプなので、全体的な余白を意識して調節しました。
デフォルトからあえて変更したところは以上
文字うんぬんと余白については思う所あるので、別記事にしたい
意識してこだわった所
いかにAFFINGER5(WING)を触らないか
ココめっちゃ意識しました。
小手先の知識を使って自分が書いたCSSが後から邪魔して困ることが多かったので、いかに備わっている機能を邪魔しないか、AFFINGERだけで完結させるかを頑張りました。今後もっと減らします。
新着一覧と、カテゴリーごとの新着をやめた
各カテゴリーで新着順表示を行っていましたが、やめました。なぜなら新しい記事がなかなか増えないから(書かないから)
トップページをサイト設計風にした
流行りの「サイト設計風」をトップで意識してみましたが、どうでしょう。

WINGの機能 + CSS書いてます
これやると僕のサイトには必要なコンテンツが無さすぎてダメですね。記事を書かないで必要なコンテンツ補う方法考える。
今後やること、本当はやりたいこと
「やる予定・やりたい」けれど、自分の技術的に実現ができていヵ所もメモします。
- 完全1カラム化
- 画像に対しての文字間隔を狭める調節(ギズモード風)
- 文章下の余白を、リズム自動で作れるようにCSS細かくする
- アイキャッチ画像とタイトルなど重ねて表示
- カテゴリーページの調節
- TOC+からすごい目次への切り替え
一つずつ潰していきます。
すごい目次は「凄い」けど、尻込み中
今AFFINGER5(WING)を購入すると、特典で「凄い目次」というプラグインが付属しています
公式:【限定特典5/15まで】SUGOIMOKUJI(すごいもくじ)について
これから新規サイト作る方は必ず導入した方がいいです。
僕が導入を懸念しているのが、URLが変わる所。
具体的にはTOC+で見出しへ付与されている半角英数字を基本としたURLが、凄い目次だとst-のidに変更しなければならない。
これによる懸念ポイントが2つ
- 記事内にTOCタグ使ったスクロールヵ所がある為、すべて変更しなければならない
- Google検索結果で、現在関連リンクされてる小見出し群がどうなるか分からない
弱小サイトなので後者はまぁいいとして、修正はめんどくさいです。いい方法ないだろうか。
AFFINGER4からWINGに変わって、良かった所はまだよくわかっていません。
たぶんアフィリエイトサイトを複数持っている人ほどいいんじゃないかなぁと思います。
そんな感じで終わります。