3やわらかく見易いデザインに一目ぼれして導入したWordPressテーマ「SANGO」。デフォルトのままだとスッキリしすぎていて物足りないような気もしてくるSANGO。そんなSANGOユーザーさんたちに、僕が実際に行っているカスタマイズを公開します。SANGO以外でも使えるものもありますよ!注意テーマテンプレートの中身をさわることが多いので、必ず子テーマを利用してカスタマイズを行ってください。僕は美的センスが壊滅的なので、主に内部構造をさわるようなカスタマイズを行っています。機能のカスタマイズ開いている記事と同じカテゴリーの人気ランキングを出力する上記カスタマイズをテーマテンプレート側に実装してみたトップページの上部に人気記事を動的に出力する“読了目安時間”をプラグインを使わずに表示する今読んでいる章の見出しを画面上部にラベルとして追従させるさいごにデザインのカスタマイズブログ全体のイメージとしてとても大切なデザイン面で変更した部分の紹介です。サイドバーウィジェットのコンテンツ間の隙間を狭くするSANGOでは美しいマテリアルデザインをコンセプトにされていて、そのマテリアルデザインはコンテンツ同士の間隔は広い方がキレイに見えるといいます。それを根底から否定するようなカスタマイズですが、僕自身デフォルトのSANGOより少し間隔が狭い方が好みでしたので......。cssにチョイ足しで済むのでここで紹介します。なんやかんやで現在はこのカスタマイズはしていません!参考までに、コードだけは残しておきますね。Cacheを有効化していてもブログにシェア数が表示されないようにする何言ってるかよく分からないよ......と思うかもしれませんが、シェア数少なすぎて読者に見られたくないけど管理画面で統計だけは見たいっていう複雑なビギナー心があるんです。Cacheでシェア数を取得しつつブログ上に表示させない方法......需要あるのかなぁ?フロントページをキレイかつ機能的に!ブログトップのページがこんな感じになりますよ!SANGOのフロントページをシンプル&スタイリッシュにカスタマイズおすすめ情報!僕が開発しているSANGO専用WordPressプラグイン「SANGOサポーター」に、このカスタマイズを一発で完了できる機能があります!投稿ページ上部のアイキャッチをバイラル風にSANGOの記事ページ上部にあるアイキャッチとタイトルをまとめて、STORKなどにある”バイラルメディア風”に見せています。投稿の編集画面で通常とバイラル風を選べる仕様がうれしいですね。SANGOの記事デザインをバイラル風にするカスタマイズマサオカブログぶっちゃけ、この手のカスタマイズは大好きです!内部リンクカードに”続きを読む”を追加すっきりシンプルだったSANGOのリンクカードがこうなります。cssにコピペ一発でできるお手軽カスタマイズです。こちらの記事を参考にしました。嫁ちゃんにデフォルトのリンクカードを見せたらよめねここの画像なに?とか言われちゃってたので、効果はあると信じています!機能のカスタマイズこんな機能が欲しい、を実現するために行ったカスタマイズを紹介します。開いている記事と同じカテゴリーの人気ランキングを出力するマサオカブログさんで紹介されていたコードを少しアレンジして、ほんの少し便利にしてみました。Widget」プラグインをここでしか使っていないのがもったいなくて、プラグインを外すためにランキングをテーマテンプレートに埋め込んでみました。Posts」を利用して動的な人気記事表示をしてみました。”をプラグインを使わずに表示するよくある「この記事を読むのに○○分かかります」的なやつを表示するのにプラグインを入れるのが嫌だったので、phpで直に書いてみました。ブログ記事の読了目安を表示しよう!プラグイン不要のカスタマイズ今読んでいる章の見出しを画面上部にラベルとして追従させる記事をスクロールしていくと、今現在読んでいる章の見出しが書かれたラベルが画面最上部にずーっと付いてくるアレです。サルワカさんで目にした瞬間に欲しくなった機能で、SANGOで似たようなことができないかと思いカスタマイズしてみました。SANGOで現在の見出しを上部に追従させるサルワカ風カスタマイズおすすめ情報!僕が開発しているSANGO専用WordPressプラグイン「SANGOサポーター」に、このカスタマイズを一発で完了できる機能があります!さいごに「SANGO」はデフォルトでほぼ完成された美しいテーマです。カスタマイズし過ぎると、逆にSANGOの良さを損ねてしまう危険性がありますので、本当に必要な部分で納得のできる範囲でのカスタマイズをおすすめします。:WordPress関連記事たちこの記事を書いた人はるしか雑食系サラリーマンゲーム・漫画・アニメ・クルマ・ガジェットなど多趣味な雑食系で、わからないこと・気になることがあればすぐ調べないと気が済まないタイプ。集めた知識を独自の観点でお伝えしていきます。2018はじめまして。SANGO愛用者です。トップページがとても綺麗で見やすいです!かなりこだわっているように見えるのでとても興味があります。これも記事にして頂けたら嬉しいです。2018コメントありがとうございます。綺麗で見やすいだなんて、これ以上ないくらい嬉しいお言葉ですね!ちょうど記事を書いていたところでしたので、公開させて頂きました。2018はじめまして。困っていたところ、こちらの記事に出会いました。実際に、CSSに追加したのですが反映されず、、もともと、間隔が0だったので、間を空けたかったのですが間隔が0で困っています。こちら見ていただけますと幸いです。2018SHINGOさん、コメントありがとうございます!ブログ拝見させていただきました。サイドバーウィジェットの隙間のお話でよろしかったでしょうか?隙間が空いていないというより、「隙間にも背景色が設定されている」ように見えます。widget_custom_html">)の中に囲まれていますので、おそらくカスタムHTMLウィジェットの中に書き込んでいらっしゃるのではないでしょうか?背景色#fffが適用されたカスタムHTMLウィジェットの上に、各ウィジェット(のHTMLと同じ記述)が置かれている状態ですので、隙間が空いていないように見えてしまうものと思われます。回りくどい表現になってしまって申し訳ないです......。2018はるしかさん、ご返信ありがとうございます。先ほどウィジットにある、プロフィールのカスタムhtmlを消したところ余白が復活しました。元に戻すと繋がってしまいます。コメントをキャンセルメールアドレスが公開されることはありません。