【SANGOカスタマイズガイド】サイドバーにウィジェットを設定~ユーザビリティを高めるウィジェットをサイドバーに配置する~

この記事には広告を含む場合があります。

記事内で紹介する商品を購入することで、当サイトに売り上げの一部が還元されることがあります。

サイドバーにウィジェットを配置する。サイドバーとはサイトの横(WordPressだと主に右)にある機能を設置するスペース。ウィジェットはユーザビリティを高めるための画面部品みたいなもの。今回はWordPressの標準ウィジェットをサイドバーに配置する。

注意事項

画面や仕様などは2021年8月に確認したもので最新の情報と異なる可能性があります。ご了承ください。

動作環境

しでばr

WordPress バージョン: 5.8

SANGO バージョン: 2.10.5

サイドバーにウィジェットを設定

ここで設定するウィジェット(GUI部品)はWordPressの標準機能である。テーマにSANGOを使用しているが他のテーマでも設定できる。

よく使うサイドバーを設定しユーザビリティを向上させる。自身がウェブサイトアクセス時によく使うメニューなどを入れればよい。

1. 追加するウィジェット

ウィジェットとはウェブサイトで使用する「画面の部品」みたいなもの。この部品を組み合わせてウェブサイトを構成する。ここではよく使う以下の4つのウィジェットを例に説明する。ウェジェットには機能が備わっており設定時にパラメーターなどで調整が可能。WordPressに登録された情報をユーザーに分かりやすく表示してくれる。

追加うるウィジェット
  • アーカイブ
  • カテゴリー
  • 最近の投稿
  • 検索

「外観>ウィジェット」をクリックし設定画面を表示する。

2. サイドバーに追加

サイドバーにウィジェットを追加する。「利用できるウィジェット」からドラッグ&ドロップすることで設定できる。

Point

ウィジェットを追加したら必ず保存ボタンをクリックする。

3. 検索ウィジェット

サイト内を検索するウィジェットちょっとわかりにくいので「サイト内検索」なとタイトルを付けた方がいいかもしれない。便利な機能であるが使い方がわからない場合が多いかも。

4. 最近の投稿

新しい記事をおすすめするための機能。サイトの最近のトピックなどを確認できるがリピーターしか使わないと思う。特化サイトでは必須だと思うが雑記サイトだと不要かも。

5. アーカイブ

月単位の記事一覧を表示。これで過去記事などをチェックできるわけだが検索流入してきたユーザーが使うかは微妙。これよりもカテゴリーの方が重要かも。

6. カテゴリー

サイト回遊率を高めるためにもこのウィジェットは必須。似たような記事を探したい場合や興味のあるカテゴリーを見るけるのに非常に役立つ。

7. 確認

設定したウィジェットを確認。

一番目につきやすい位置に設置した検索ウィジェット。ぱっと見サイト内の記事を検索する機能とはわかりにくいか。タイトル付けた方が良い気がしてきた。

のこり3つのウィジェット。行数の少ないウィジェットを上に配置している。重要度から考えるとカテゴリーウィジェットが一番であるが行数が多いので一番下に設定。本気で分析するならヒートマップなどのツールを使う必要あり。

8. モバイル端末

PC版では画面の右側に配置されるサイドバーだがモバイル端末だと画面の一番下に表示される。トップページからかなり距離があるのでかなりアクセスしづらい。多分モバイル端末だとサイドバーへのアクセスは少ないと思う。サイドバーはほぼPC端末専用と思っていいだろう。

モバイル端末はサイドバーの代わりにメニューが使われる。ハンバーガーメニューと呼ばれる三本線のメニューでモバイル端末で使われることが多い。

他固定フッタなとも有効である。

【SANGOカスタマイズガイド】モバイル用フッター固定メニューの設定~アクセスの多いモバイル端末のユーザビリティを向上~

まとめ

とりあえずカテゴリーはないと使いにくいと思う。あとは必要なウィジェットを色々試したり、使いやすいと思うサイトを参考にしたりすればよい。大手サイトなどはヒートマップ分析などでギンギンに調整しているので参考になると思う。特にトップページで見える内容は重要でサイトのイメージや回遊率を決めるハズ。

モバイル端末だとサイドバーへのアクセスがいづらいので別途メニューを追加する必要がある。これらのウィジェットの配置はPC端末とモバイル端末を別で考えた方がいい。モバイルはモバイル端末の実機でユーザビリティをちゃんとテストした方がいいだろう。

ポイント
  • 既存ウィジェットはドラッグ&ドロップで簡単に設置可能
  • ウィジェットはユーザビリティを考えて配置
  • モバイル端末は別途ハンバーガーメニューが必要

まずは自分が使いやすいと思う配置でいいと思います。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です。入力した「コメント」、「名前」、「サイト」は一般公開されます。匿名の場合は「名前」にニックネームを使用してください。