これから Nishiki Pro または Nishiki
テーマを使うなら1度は確認しよう!

Nishiki テーマおすすめ設定 テーマおすすめ設定を見る

ウェブサイトを作るからには何らかの「目的」を持つとは思いますが、WordPress テーマ Nishiki Pro を使う方の中には、ウェブサイトを活用して「売り上げを増やしたい」「お問い合わせ件数を増やしたい」「特定のページをもっと見てもらって自分を知ってもらいたい」という方も多くいます。

そのような方々からのフィードバックをいただきまして「フッターメニュー」を設置する機能を追加しました。

目次

フッターメニューのサンプル

以下に使い方の一例をご紹介します。

特集ページへの誘導として使う

例えば「ファッション系」のウェブサイトやブログを運営していたとすると、季節ごとの特集ページなどに誘導して、参考にしてもらうのもいいですね。

特定のカテゴリーページへの誘導として使う

例えば「海外旅行系」のウェブサイトやブログを運営していたとすると、それぞれ「使用した航空会社」「おすすめの食事」「おすすめスポット」などのカテゴリーページへ誘導して、一覧で情報を探してもらうのもいいですね。

お問い合わせへの誘導として使う

お問い合わせフォームや、電話番号などが掲載された連絡先のページへの誘導をするのもいいですね。

ページ上部へのスクロールボタンとして使う

ページの右下あたりに設置しているウェブサイトをよく見かけるのですが、Nishiki Pro テーマの開発者的には、同様の動作をさせるならフッターメニューに追加をおすすめします。

検索ボタン、メニューボタンを追加してナビゲーションの役割を持たせる

検索フォームとメニューをボタンで呼び出すことができます。ページトップへ戻るボタンも含めてナビゲーションの役割を持たせるのもいいですね。

固定(追尾)表示させてユーザビリティ(使いやすさ)向上を図る

フッターメニューは固定(追尾)させることができます。これは強力!

上記のほかにもいろいろと用途があると思いますので、ぜひお試しください。

フッターメニューは WordPress の管理画面でコードを書かずに設定することができます。

フッターメニューの作成方法

WordPress の管理画面から「外観」→「メニュー」を選択してください。

次に、新しくメニューを作成(下の画像の例では「フッター」)して、メニュー設定欄の「メニューの配置」の「フッター」にチェックを入れれば準備完了です。

メニューの追加と並び替え

左側の一覧からメニューを追加します。追加できるメニューは投稿ページ、固定ページ、カテゴリーページはもちろん、Nishiki Pro 専用ボタンや、お好みでメニューが作れるカスタムリンクにも対応しています。

カスタムリンクを活用すれば、URL に Google Analytics 解析用のパラメーター(例:utm_source、utm_medium、utm_campaign など)も入れられます。解析結果から分析を行い、ウェブサイトの改善やコンバージョン率を上げたい方は、ぜひパラメーターも設定してみましょう。

また、追加したメニューはドラッグ&ドロップで並び替えも簡単にできます。

Nishiki Pro テーマ専用ボタンを追加しよう

Nishiki Pro テーマ専用で検索パネルとメニューパネルを表示するボタンを追加できます。追加したいボタンにチェックを入れて「メニューに追加」ボタンを押せば OK です。

ボタン追加の注意事項
  • 検索・メニューボタンはフッターメニューのみ機能します。グローバルメニューには対応していません。
  • 検索・メニューボタンはそれぞれ 1 つだけフッターメニューに追加してください。2 つ以上同じボタンを追加すると動作しません。

追加したメニューの詳細設定

追加したメニューはそれぞれ詳細設定できます。下の画像はカスタムリンクを追加した例です。

アイコン設定

メニューそれぞれ、アイコンを設定できます。アイコンは 500 種類以上の中から選ぶことができます。

使用できるアイコンは、WordPress の管理画面から「外観」→「Nishiki Pro About Page」を選択して「使用できるアイコンフォント」のタブに一覧で掲載しています。

使用したいアイコンが決まったら「CSS class(オプション)」に入力しましょう。

例えば「arrow-up」アイコンを入れたい場合は、

icomoon icon-arrow-up

と入力します。

もし「CSS class(オプション)」の入力欄が表示されていない場合は、ページ右上に「表示オプション」があるので選択して「CSS クラス」にチェックを入れましょう。

カスタマイザーの設定

メニューを追加したら、次はデザイン設定をしましょう。

WordPress の管理画面から「外観」→「カスタマイズ」→「フッター」を選択すると、以下のように設定項目が表示されます。

カラー設定

フッターメニューの背景、テキストのカラーを変えられます。マウスオーバー時のカラーも変更できます。

固定(追尾)表示

カスタマイザー画面でページをスクロールした時に下部に固定(追尾)するかどうかを設定します。ページ中どの場所を見てても下部にずっと表示されるので、アクセスもしやすいですし、次のアクションを促す導線としても役立ちます。

表示パターンは以下の 3 つです。

  1. 常に固定(追尾)
  2. モバイル表示(768px 以下)の場合で固定(追尾)
  3. なし

ヘッダーとフッター両方を固定(追尾)させている場合、ページの表示領域が狭くなってしまうので、どちらか一方のみ固定表示させてもいいかもしれません。お好みで設定していください。

対応ブラウザ

主要ブラウザで動作確認はできていますが、固定(追尾)設定については position : sticky が有効なブラウザのみサポートしています。

ご要望などフィードバックはこちらまで

フッターメニューの機能についてご紹介しました。

サポトピアの ユーザーコミュニティ ではより良い製品を作り、提供するため、フィードバックを大切にしています。「テーマにこんな機能があればいいのに」「操作マニュアルを追加してほしい」などの要望を随時受付けていますので、興味・関心がありましたらぜひご参加ください。

Nishiki テーマに関する情報は #wpnishiki をチェックしてください。

サポトピア おすすめ WordPress テーマ

WordPress テーマ Nishiki Pro

WordPress 公式テーマ Nishiki の洗練されたデザインを継承したプロフェッショナル版テーマです。「本当に必要とされる機能」をテーマ内にすべて搭載しているので、プラグインをたくさん入れなくても OK。メンテナンスコストも抑えることができ、効率の良いウェブサイト運営を行うことができます。

EC サイト対応テーマ Nishiki Pro for WooCommerce

今の時代、誰もが商材を持ち、ネット上で販売できる仕組みを持ってもいいと思います。WordPress を使って EC サイトが構築できる「Nishiki for WooCommerce」を使って、お持ちの商材を販売しませんか。ドロップシッピングサイトも作れます。