Simplicityでサイトにグローバルナビを作成・表示する方法

この記事は約4分で読めます。

lgf01a201310271900

 

初心者でも、簡単にカッコイイスタイルのブログが作れると大人気のテーマ、Simplicity。

 

わたしも使わせていただいております。

 

ブログ初心者で、コードとかさっぱりのわたしでも、簡単に色々とカスタマイズすることが出来てしまうので本当にありがたいテーマです。

 

今回は、そのSimplicityをテーマとして使用したこのサイトに、グローバルナビを表示させてみましたので、その手順をメモ。

スポンサーリンク

グローバルナビとは?

 

ブログやサイトなどを開くと、必ずと言って良いほど設置されているグローバルナビ。

 

記事をカテゴリーごとに分けて表示することによって、サイトに訪れた人に対し、サイトをより見やすく、わかりやすいものにしてくれます。

 

このサイトで言うと、これですね。

スクリーンショット 2016-02-22 6.01.09

 

これがあるのとないのとでは、サイトの見た目がガラリと変わります。

記事も整理しやすくなります。

 

なので、まだグローバルナビを設置していない方は作成することをおすすめします。

 

尚、グローバルナビを作成するには、カテゴリーの作成から行う必要があります。

 

もしまだカテゴリーを作成していない方は、こちらの記事を参考に作成してみてください。

Simplicityでカテゴリーを作成して記事を分類する方法
皆さん、記事を書いた後、カテゴリー分けってしていますか?記事がたまってきてからやろうとすると、結構時間も掛かって面倒くさい作業になってしまいますので、ブログを始めたら早めにこの作業を覚えてしまうことをオススメします。一度覚えてしまえば、あと...

 

 グローバルナビを作成する

 

「管理メニュー」→「メニュー」をクリックします。

スクリーンショット_2016-03-11_15_01_29

 

「新規メニューを作成」をクリックし、「メニュー名」に自分の付けたい名前を入力し、「メニューを作成」をクリックします。

 

*この名前は管理上のものとなるため、サイト上に表示されるものではありません。

「グローバルナビ」など、自分の管理しやすい名前を付けておくと便利です。

スクリーンショット 2016-02-09 18.43.31

 

左カラムにある「カテゴリー」をクリックし、「すべて表示」をクリックします。

 

「カテゴリー」で作成した項目がズラリと出てくるので、その中でグローバルナビに表示させたい項目(サイト上に表示したい項目)を選択し、「メニューに追加」をクリックします。

スクリーンショット 2016-02-09 18.58.07

 

選択した項目が右側に反映されます。

ドラッグして並び替えることも出来ますし、後で変更も可能です。

スクリーンショット 2016-02-09 18.46.50

 

すぐ下の、「メニュー設定」の2箇所にチェックを入れましょう。

ここにチェックを入れていないと、グローバルナビに表示されません。

スクリーンショット 2016-02-09 18.47.48

 

「サイトを表示」にて、きちんと反映されているか確認しましょう。

 

きちんと表示されていれば完了です。

 

また、表示する項目を変更したい場合は「投稿」→「カテゴリー」から変更することが出来ます。

スクリーンショット_2016-03-11_15_38_52

 

グローバルナビの色を変更する

 

サイトに訪れた方が見やすいように、また自分の好きなように色を変更することが出来ます。

 

管理画面から、「カスタマイズ」→ 「色」へ。

スクリーンショット 2016-02-09 19.27.33

 

スクロールしていき、「グローバルナビ色」を探します。

 

いろいろな色を試して、気に入った色に設定しましょう。

スクリーンショット 2016-02-09 19.27.53

 

色の変更をしたいときは、ここからいつでも可能です。

 

 グローバルナビを横幅いっぱいに表示する

 

これは、ヘッダーの画像を横幅いっぱいになるように設定した際に、グローバルナビも同じ長さに揃えてあげる機能です。

 

(ヘッダーの画像がデフォルトの長さの場合は、必要ありません)

スクリーンショット_2016-03-11_15_44_52

 

「カスタマイズ」→ 「ヘッダー」へいき、「ヘッダー外側背景画像」の下に表示されている項目、「グローバルナビを横幅いっぱいにする」にチェックをします。

スクリーンショット 2016-02-11 3.15.07

 

これで、ヘッダーと同じ長さに調節することが出来ます。

 

まとめ

 

グローバルナビは名前の通り、サイトに訪れてくれた方に対して、ナビをしてくれる機能です。

 

カテゴリー分けをしっかりして、グローバルナビを見ただけでどこに何が書いてあるのかきちんとわかるようにしましょう。

 

また、「サブメニュー」を追加してあげることをオススメします。

 

グローバルナビを更に細かく分類して表示してくれる機能です。

詳しくはこちらの記事をどうぞ!

Simplicityでグローバルナビにサブメニューを追加・表示する方法
今回は、グローバルナビに「サブメニュー」を追加・表示したのでその方法をメモしておきます。あまりにも簡単な方法で、記事にするのも申し訳ほどなのですが、私自身やり方がわからなくて結構いろいろチャレンジした結果出来て嬉しかったので、書きます!笑尚...

 

この記事を読んでいただき、どうもありがとうございました!!

またお会いしましょう。

コメント

タイトルとURLをコピーしました