SANGOのカスタマイズまとめページへお越しいただき、ありがとうございます( ˶ˆ꒳ˆ˵ )
SANGOのカスタマイズを趣味としている、くま(@Bearface18)と申します。このページでは、ぼくが今までにやってみたSANGOのカスタマイズをまとめています。
紹介しているカスタマイズは50を超えているので、他にはない圧倒的カスタマイズまとめになっています。
カスタマイズの前に・・・
ぼくのカスタマイズは基本的にCSSのみを変更するだけです。
CSSって?何?おいしいの?って人はひとまずこちらの記事に目を通してくださいね。


ぼくは、CSSだけでできるカスタマイズを目指しています
また、カスタマイズは自己責任でやってください。
は?自己責任?意味分かんないんだけどって人はこちらの記事を読んでください。


これは本当に重要だから、はじめてカスタマイズする人は読んでな
こちらのまとめサイトもおすすめ
SANGOはカスタマイズ好きの変態がたくさんいるテーマです。
そのため、カスタマイズをまとめているブログがたくさんあるので紹介しますね。
参考 SANGOのカスタマイズまとめ!一番最初にやる設定集 | マサオカブログマサオカブログ
PORIPUの製作者まっさーさんがまとめたカスタマイズです。たまりませんね!
また、ぼくとは違ってテーマのもっと深い部分をカスタマイズしている方もいます。
CSSは表面部分をカスタマイズしているイメージです。
参考 【SANGOカスタマイズ全集】美しいWPテーマをさらに魅力的に! | こじかログこじかログ
SANGO専用のプラグインを作成しているはるしかさんのサイトやで!
見たい場所へジャンプ
- 1 SANGOのカスタマイズ二文字背景丸のちょうどいいやつ
- 2 SANGOのカスタマイズメリット・デメリットボックス
- 3 SANGOのカスタマイズパンくずリストをシュッとさせる
- 4 SANGOのカスタマイズ目次へGO ②
- 5 SANGOのカスタマイズ目次へGO ①
- 6 SANGOのカスタマイズナビドロワー ボタン
- 7 SANGOのカスタマイズヘッダーお知らせ欄 雪
- 8 SANGOのカスタマイズタグ シンプル
- 9 SANGOのカスタマイズシェアボタン カラー
- 10 SANGOのカスタマイズ表 カラー
- 11 SANGOのカスタマイズ吹き出しの名前の位置
- 12 SANGOのカスタマイズ目次 + 画像
- 13 SANGOのカスタマイズヘッダーお知らせ欄 + 動く
- 14 SANGOのカスタマイズヘッダーお知らせ欄 + ボタン
- 15 SANGOのカスタマイズメモボックス
- 16 SANGOのカスタマイズBOX29
- 17 SANGOのカスタマイズお問い合わせページ
- 18 SANGOのカスタマイズ目次+アイコン
- 19 SANGOのカスタマイズボタン×変形
- 20 SANGOのカスタマイズ外部リンク×シンプル
- 21 SANGOのカスタマイズナビドロワーのSNSボタン
- 22 SANGOのカスタマイズ画像+大きい背景
- 23 SANGOのカスタマイズ画像+タイトル
- 24 SANGOのカスタマイズ画像×変形
- 25 SANGOのカスタマイズ画像+アイコン
- 26 SANGOのカスタマイズボックス+吹き出し
- 27 SANGOのカスタマイズ箇条書き×シンプル
- 28 SANGOのカスタマイズ記事一覧×リスト
- 29 SANGOのカスタマイズモバイル用フッター固定メニュー
- 30 SANGOのカスタマイズRinkerのカスタマイズ2
- 31 SANGOのカスタマイズ上部の固定見出し
- 32 SANGOのカスタマイズオリジナルボタン
- 33 SANGOのカスタマイズおすすめ記事+更新マーク
- 34 SANGOのカスタマイズ関連記事の横長
- 35 SANGOのカスタマイズ関連記事のカード型
- 36 SANGOのカスタマイズマイクロコピー+ボタン
- 37 SANGOのカスタマイズサイト内検索欄
- 38 SANGOのカスタマイズ目次×シンプル
- 39 SANGOのカスタマイズSNSボタンを2列にする
- 40 SANGOのカスタマイズ記事カード+余白
- 41 SANGOのカスタマイズボタンの上+文字
- 42 SANGOのカスタマイズRinker×シンプル
- 43 SANGOのカスタマイズ関連記事タイトル+画像
- 44 SANGOのカスタマイズ表×スタイリッシュ
- 45 SANGOのカスタマイズナビドロワー+背景画像
- 46 SANGOのカスタマイズサイドバー目次×追尾
- 47 SANGOのカスタマイズ更新マーク+丸い背景
- 48 SANGOのカスタマイズボックスデザイン×付箋
- 49 SANGOのカスタマイズ画像のキャプション
- 50 SANGOのカスタマイズフォローボックス×カラー
- 51 SANGOのカスタマイズ画像×ふわっと
- 52 SANGOのカスタマイズ右側に吹き出しをつける
- 53 SANGOのカスタマイズサイドバーのアイコン
SANGOのカスタマイズ
二文字背景丸のちょうどいいやつ
二文字に丸い背景をつけるだけでもかなり印象が違います。アイコンや半角カタカナをいれても面白いカスタマイズです。

お手軽にできるカスタマイズです。しかもかなり応用範囲が広いのでおすすめ!

このカスタマイズは玄人の人に好評やったな
SANGOのカスタマイズ
メリット・デメリットボックス
タイトル部分にもアイコンを追加することで、ボックスがひと目でわかりやすくなっています。肯定は緑、否定は赤で表現してみました。この色はGoogleの色を参考に配色しました。

メリット、デメリットボックスはアフィサイトとかでよく使うイメージだね

メリット・デメリット以外にもアイコンを変更することでいろいろ使えそうやな
SANGOのカスタマイズ
パンくずリストをシュッとさせる

Before

After

パンくずリストは以外と見られる部分です。そこにブログ独自のアイコンがあると可愛いですよね。スマホのときは中央寄せにして、一番最後の▶は非表示にしています。

パンくずリストを変更するだけでも個性がでるよね

アイスクリームのアイコンを2色にするのはさすが変態やな
SANGOのカスタマイズ
目次へGO ②

シンプルver

色付きver

Twitterで目次が話題になっていたので、ひょいっと目次へ戻れるように固定表示するようにしました。メニューボタンと同じ大きさにして、統一感を出しています。文字も中央にくるようにカスタマイズしました。

このときはTwitterで目次論が繰り広げられてたね

そやな、まぁココらへんは自分の好きなようにすればいいやん
SANGOのカスタマイズ
目次へGO ①

こんなの

なし
なし
ファーストビューに表示するようにしたのが一番のポイントです。記事がパッと表示された時に、スッと目次に移動できたらいいなと思ってカスタマイズしました。

とりあえず目次へ移動ってのもよくあるよね

ノウハウ記事とかは導入文よりも目的の場所を素早く知りたい事がおおいしな
SANGOのカスタマイズ
ナビドロワー ボタン

Before

After

フラットなボタンを多く設置しました。特にホームへ戻るボタンは意外とよく使われるので、横長にしています。ボタンと見出しを区別するために、見出しの丸みを上だけにしています。

これね!このカスタマイズは意外と使ってくれてる人が多いんだ!

普段は隠れてる部分なのに、、やはりSANGOユーザーはカスタマイズ好きが多いな