【サイト上部ヘッダー】の設定②

くにみつ

では前回に続き、ヘッダー部分を見ていきましょう^^
今回設定するのは以下の2箇所ですね。
SNSアイコンとナビゲーションを設定していきましょう。

今回設定する2箇所
  1. キャッチコピー
  2. ロゴ
  3. SNSアイコン
  4. ナビゲーション
  5. メインビジュアル
  6. 記事スライダー
ヘッダー構成図
今回は③と④です。
目次

サイト上部ヘッダーの設定

③SNSアイコン

ここでは皆さんが開設しているSNSにリンクを貼ることができます。
初期では「RSSフィード」と「検索アイコン」が表示されていますね。

初期では「RSSフィード」と「検索アイコン」が表示されていますね。
初期では「RSSフィード」と「検索アイコン」が表示されていますね。

まずはこれまで通り

外観」→「カスタマイズ」をクリック

まずはこれまで通り「外観」→「カスタマイズ」をクリック

SNS情報」をクリック

SNS情報」をクリック

SNSリンク設定」がありますので各SNSのURLをコピペしてください。
入力は大変なので、コピペしましょうね^^

SNSリンク設定」をありますので各SNSのURLをコピペしてください。

設定していくとアイコンが表示され、そこをクリックすると各SNSへ移動します。

ちなみに全てURLを入れるとこんな感じになります笑

ちなみに全てURLを入れるとこんな感じになります笑
全て入れた状態

④ナビゲーション

くにみつ

では次に「ナビゲーション」を見ていきましょう。
「ヘッダーナビゲーション」や「グローバルナビゲーション」とも言われます。個人的には「G(ジー)ナビ」と読んでます。

今後は左のメニューから「外観」→「メニュー」を選択します。
※違う場所からも設定できますが、僕はここからが慣れているのでこちらから^^

今後は左のメニューから「外観」→「メニュー」を選択します。

着目は3箇所です。

3箇所です。
3箇所確認しましょう。

まず1つ目。
メニュー名を決めましょう。

①メニュー名を決める

メニュー名の所に→ 「gNavi」 と入力してください。
※わかりやすい名前だったらなんでも大丈夫です。

次に「グローバルナビ」にチェック。

グローバルナビ」にチェック

「グローバルナビ」にチェック。
ここはメニューを表示させたい場所を決めます。

最後に作成したメニューを保存。

③メニューを作成

「メニューを作成」をクリック

メニューを作成」をクリックすると保存されます。

※補足

※新しいメニューを作成する事で、グローバルナビゲーションにはこのメニューを表示。
フッターナビゲーションにはこのメニューを表示と切り分ける事が可能です。

最後に「メニューを保存」をクリックしてください。

最後に「メニューを保存」をクリックしてください。
最後に「メニューを保存」をクリックしてください。
くにみつ

ここで一旦どんなモノがメニューにできるか確認してみましょう。

固定ページ

今は「記事一覧」、「トップページ」しかありませんが、今後「会社案内」や「料金案内」、「お問い合わせ」などのページを作成していくので、作成後、追加していきましょう。

今は「記事一覧」、「トップページ」しかありませんが、
今後「会社案内」や「料金案内」、「お問い合わせ」などのページを作成していくので、作成後、追加していきましょう。

投稿

こちらも今は「Hello world」しか表示されてないですね。
投稿はブログ記事だと思ってください。日々投稿していくものが投稿としてこちらに表示されます。
ただ、あまり使う事はないですね。

こちらも今は「Hello world」しか表示されてないですね。
投稿はブログ記事だと思ってください。日々投稿していくものが投稿としてこちらに表示されます。
ただ、あまり使う事はないですね。

カスタムリンク

カスタムリンクは自由にリンク先を決める事ができます。
別のサイトに移動させたいとか、キャンペーンページを作った際に使用します。

カスタムリンクは自由にリンク先を決める事ができます。
別のサイトに移動させたいとか、キャンペーンページを作った際に使用します。

カテゴリー

そして最後はカテゴリー。これも今は設定してないので「未分類」しかありませんね。
特定のカテゴリー一覧ページにリンクしたい時に使用します。

そして最後はカテゴリー。これも今は設定してないので「未分類」しかありませんね。
特定のカテゴリー一覧ページにリンクしたい時に使用します。
くにみつ

ではとりあえず、「固定ページ」から
メニューを選択していきましょう。

記事一覧」と「トップページ」にチェックを入れ、「メニューに追加」をクリック

記事一覧」と「トップページ」にチェックを入れ、「メニューに追加」をクリックします。

右側に「記事一覧」と「トップページ」が表示されるので、位置を上下移動させましょう。
トップページをドラッグ&ドロップで記事一覧を上下を入れ替えてください。

位置が変わるので、問題なければ右下の「メニューを保存」を押しましょう。

右側に「記事一覧」と「トップページ」が表示されるので、位置を上下移動させましょう。
トップページをドラッグ&ドロップで記事一覧を上下を入れ替えてください。
位置が変わるので、問題なければ右下の「メニューを保存」を押しましょう。
右側に「記事一覧」と「トップページ」が表示されるので、位置を上下移動させましょう。
トップページをドラッグ&ドロップで記事一覧を上下を入れ替えてください。
位置が変わるので、問題なければ右下の「メニューを保存」を押しましょう。

実際のサイトを見てみましょう。そんなに変わり映えはしませんが、トップページと記事一覧のメニューが左右逆転しているのが確認できますか?

管理画面で上に設置したメニューが、実際の表示の時には左に表示されます。
ここでメニューの順番を決めましょう。

画像に alt 属性が指定されていません。ファイル名: 4-6-1024x443.jpg
実際のサイトを見てみましょう。そんなに変わり映えはしませんが、トップページと記事一覧のメニューが左右逆転しているのが確認できますか?
管理画面で上に設置すると、実際の表示の時には左に表示されます。
ここでメニューの順番を決めましょう。
実際のサイトを見てみましょう。そんなに変わり映えはしませんが、
トップページと記事一覧のメニューが左右逆転しているのが確認できますか?
管理画面で上に設置すると、実際の表示の時には左に表示されます。
ここでメニューの順番を決めましょう。
くにみつ

これでSNSの設定とメニューの設定は終了です。
メニューの設定は固定ページ作成後随時設定すると思いますので、場所と設定方法を確認しておきましょう^^

よかったらシェアしてね!
  • URLをコピーしました!
目次