ワードプレステーマ「humming bird」から「SANGO」に変更した時のカスタマイズ方法




SANGO
メインで運営している、無添加特化の雑記ブログかすみそらいふ
テーマ『humming bird』から『SANGO』に変更したので、変更箇所と参考にしたページでまとめます。

SANGOは機能がありすぎるのでかなり戸惑います。
humming birdはかなりシンプル。
自分でCSSをいじってオリジナル感を出すことができます。

なので使いやすかったけど
色々カスタマイズしていくうちに
変更できる部分に限界を感じ、
思い切って『SANGO』に変更しました。

テーマのアップロード方法

ダウンロードしたテーマのzipファイルを解凍せずにそのままワードプレス内にアップロードします。

追尾サイドバー

PC限定表示ですが
サイドバーに見出しが固定されます。

追尾してくるので自分が読んでいる箇所が一目瞭然で見やすいです。

ウィジェットの設定をしよう:広告の貼り方も解説
上記リンク内の『追尾サイドバー』を参照してください。

トップへ戻るボタンの表示


チェックを入れます。

H2タグ(見出し)をオリジナルに変更

見出しの挿入方法と種類一覧

タグ内の 『 hh 』 の部分をH2に変えて使用。
AddQuicktagに登録してテキストエディタで毎回打ち込む。

上記のタグを、毎度<h2></h2>で挟むことで
カスタマいうが反映&目次にも反映されます^^

スマホで見た時に下の方にメニューボタンなどを固定する方法

モバイル用フッター固定メニューの設定方法

トップページのタイトルの下に目立つ文字&リンクの設定方法

アフィリエイトリンクをコードで挟みボタンにする方法

アフィリエイトリンクを改変せずにボタンを使う方法

ボタンのコードはこちらを見ました。

ボタンの挿入方法と種類一覧

ボックスのショートコード

SANGOのボックスのショートコードは色合いがブルー系が多く、
ピンク系の雰囲気に合うボックスがなかなかないのでショートコードの出番は少なそうです・・

ボックスのショートコードはこちらからチェックできます。
>>ボックス・枠を挿入する方法と種類一覧

結局CSSをいじって自分の好きな色合いのボックスをカスタマイズしました。
>>【CSS】おしゃれなボックスデザイン(囲み枠)のサンプル30

カラーコードはこちらのサイトをめちゃくちゃ使ってます。
>>WEB色見本 原色大辞典 – HTMLカラーコード

Fontawesomeが簡単に使える

SANGOではCSSをいじらなくても
Fontawesomeから直接コピーするだけで
かわいいアイコンを使うことができるので
簡単で便利です。
(humming birdだとCSSにタグを入れることで使えるようになります)

Fontawesome




コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です