2019/02/16SANGOユーザーのみなさん、こんにちは。ブログ楽しんでますか^^kou(@kou_souda)です。なんとなんと嬉しいことに。)👉色の統一感があって、記事の余白の使い方が参考になる。)👉カスタマイズ記事がもうプロのそれ。)👉ホームのカスタマイズが最高。重要は極めてなさそうですが(笑)トップページのデザインの一例として参考にして頂ければ幸いです。トップページはアニメーションを基調としたシンプルデザインそもそもSANGOというテーマ自体が、シンプル・軽量・爆速という三拍子が揃っているテーマなので、それを生かす為にあんまりゴリゴリのカスタマイズは止めようと思っていました。最高なテーマが故に...使ってる人多スギィィ!!笑1万円以上するのに....皆お金持ってるよね絶対...そう、SANGOユーザーが多すぎてブログの個性が出しづらいなとも思ったんです。そこで、トップページくらい少し拘ろうかと考えた結果、アニメーションを基調としたシンプルデザインにすることに決めました♪ページに少し動きがあるだけで印象的ですしね!SANGO導入から半年近く経つというのに、実はまだプロフィールやLINEスタンプの販促ウェジット等をつけれておらず(笑)100%完成!とは言えないのですが、現状こんな感じです。POSTS”とか)動くアニメーションのアイコンカテゴリ部分のメニュー表示ですかね。一見すると、「コードとか書き換えてカスタマイズダルそう〜」と思われるかもしれませんが、ご安心ください。ウェジットに以下で紹介するコードを貼り付け、配置を工夫するだけ!!ステップ1だけ頑張って完了すればすぐに仕上がると思います♪それでは順を追って説明していきます。Animationを使えるようにするFontasesomeを使いこなせている方はこのステップを読み飛ばしてもらって結構ですが、アニメーションアイコンが未だ使える状態になっていない方は、Fontasesomeのアニメーション機能を追加する為に以下の記事を参考にして行ってみてください。「トップページ記事一覧上」ウェジット編集STEP.1が完了したらあとはもう速攻です。ワードプレスの管理画面の【外観】➡︎【ウェジット】を開きます。「カスタムHTML」を「トップページ記事一覧上」に2つ追加します。当ブログのトップページと同様に、カテゴリ6つの場合でご説明します。「カスタムHTML」を2つ追加できたら、上の方には以下のコードをコピペしてください。タイトルは記入不要で大丈夫です。#DCC2FF"></i>カテゴリ6の名前</a></li></ul>このコードを貼り付けた後、赤線の部分はご自身の任意のものに変える必要があります。※メインカラー(僕でいうブルーの部分)をアクセントカラーに変更するには、上記のコード一番上のmain-bcの部分をaccent-bcに書き換えればOK。fa-〇〇といったFontawesomeのアイコンコードはこちら(ver.4.7)#から始まる色コードはこちらをそれぞれ参考にして、コピペで上記のコードを仕上げていきます。ウェジットを保存したら、1つ目のカスタムHTMLの編集は完了です!そして2つ目のカスタムHTML。僕はこんな感じのコードにしています。POSTS</div>1つ目のカスタムHTMLの時と同様にして、赤線部を好きなアイコン、アニメーション、タイトルに変更します。POSTS</div>アイコン、アニメーション、タイトルの3つを変えているだけです。(レクタングル大)プロフィールてな感じに並べていくとモバイルとPCの両方できれいに表示されるかと思います♪ここまでの作業をまとめます。Animationの設定だけ若干面倒ですが、後はコードのコピペですぐにできちゃうかと思います。【ワードプレス】ハミングバードのスライドショーをカテゴリー一覧ページにとばす方法ショートコードで記事中の任意の場所に簡単にアドセンス広告を挿入する方法iMovieの使い方の全てを超わかりやすくテンポよく解説する。【最強】DVD作成ソフト3選!自作動画をパソコンからDVDに焼こう!無料ブログと有料ブログの違い、ドメインやサーバーのことをわかりやすく解説する。「余暇時間を最高に楽しむためのコンテンツ」を更新頻度高めで配信中。大学の卒業旅行でアメリカ横断を達成。viewskou旅行/デートスポット/温泉・スパ施設をメインに執筆。趣味は漫画とアクアリウム。本気で書いてくれるライターさん募集中!お問い合わせ等はメールかTwitterにてお願いします!もっちーブログ内の可愛いシャチのイラストは全て、もっちーが担当。