SANGOは、デフォルトでもデザイン性があってとても素敵なテーマでなのですが、最低限変更したいものがあります。その度に検索をしていたので、それをナレッジ＆リスト化しておきたいと思います。
※随時更新中
サイトの色を変更したい
サイトブランディング（イメージを印象付けるため）には、サイトをどのようなカラーで配色するのかも重要です。そんな時に設定できるのが、以下の方法です。
設定できる項目
上記のページで、以下などが設定方法が確認できます。
- メインカラー
- アクセントカラー
- ベースカラー
- リンクのカラー
- ヘッダー関連のカラー
- ウィジェット関連のカラー
設定する方法
参考 色の設定をしようSANGOカスタマイズガイドブログのタイトル変更・表示位置の変更・ロゴを設置したい
ブログのタイトルや位置を変更できます。ロゴの設置なども可能です。
うまく反映できたときの見え方
本サイトでいうと、下記の1行目にある「Weeeeby｜WEB制作の現場で役立つWEBtips」の部分が、ブログのタイトル（サイト名）になります。
設定する方法
参考 ブログのタイトルとロゴ画像を設定しようSANGOカスタマイズガイドメニュー（グローバルメニュー）を表示させたい
サイトのメニューを表示させることができます。
サイトのインフォメーションを担う、重要な部分です。
うまく反映できたときの見え方
本サイトでいうと、下記の2行目にある「ディレクション」「現場で使う用語集」「現場で使う基礎知識」「現場で使う文章一覧」の部分が、グローバルメニューになります。
設定する方法
参考 メニューの設定をしようSANGOカスタマイズガイドタブ切り替えのメニューを設置したい
TOPページにタブ切り替えのメニューを表示でき、最大で4個のタブを表示できます。
うまく反映できたときの見え方
設置するときに注意すること
- タブが1個・3個のレイアウトは、スマホの表示がおかしなレイアウトになるので、タブの数は偶数（2個・4個）にすることをオススメします。
- 左端は、最新情報が表示されるよう始めから設定されています。
- カテゴリーのIDを調べる方法：カテゴリ一覧で調べたいカテゴリーの「表示」おｎテキストリンクをクリックすると、「?cat=〇〇」と表示される。〇〇の部分がカテゴリーID。
設定する手順
- 管理画面の［外観］の［カスタマイズ］をクリック
- ［SANGOオリジナル機能］の［記事一覧タブ切替（トップページ）］をクリック
- 取得したい記事一覧を選択したら完成
※タブやカテゴリをセレクトできます。
設定する方法｜詳細
参考 SANGOトップページのタブ切替機能の設定方法まとめSANGOカスタマイズガイド画面右側（右カラム）にメニュー（ナビゲーション）を付けたい
画面右側に、ナビゲーションを表示する方法です。
ユーザーが欲しい情報を探しやすくするためのナビゲーションになります。
設定する手順
表示する位置を変更したい場合
変更方法は簡単！
変更したいウィジェットをドラッグアンドドロップします。
※ドラッグアンドドロップ
変更したいウィジェットをクリックしたまま、変更したい位置に動かすこと。
Weeeebyで表示しているウィジェット
- 検索
- テキスト
- タグクラウド
- 人気記事
- 最近の投稿
- カテゴリー
- 固定ページ
タイトルを装飾したい
タイトルを装飾する方法です。
ページをより見やすく・文章をより読みやすくするためには、タイトルの装飾は重要です。
うまく反映できたときの見え方
リボン風だと、こんな感じの見え方だよ～
ステッチ風は、こんな感じ～
折れてる見出しは、こんな感じで反映できるよ～
設定する方法１
簡単＆ノーリスクで反映できる設定方法です。
参考 見出しの挿入方法と種類一覧SANGOカスタマイズガイド設定する方法２
私は、見出しのカラーも変えたかったのと、hタグに反映することで、どのページでも自動的に見出しを反映させたかったので、以下の中から選んで、CSSを変更しました。
コーディングが苦手は私には、難しかった！そして、突然バグって・かなり焦った！！
なので、調整されたい方は、自己責任で＆バックアップ（私の場合は、元データをメモ帳にコピペ保存してから変更着手）をしっかりとってから設定することをオススメします。
参考 CSSのコピペだけ！おしゃれな見出しのデザイン例まとめ68選サルワカ | サルでも分かる図解説明マガジンSANGO｜記事投稿でよく使う装飾・タグリスト
記事投稿でよく使う装飾やタグをまとめました。
