ウィジェットを活用してオリジナリティーあふれるサイトを作成しよう!

使用前の準備や設定
カメコ
カメコ

ウィジェットと聞いて「何それ?」と思われた方は多いのではないでしょうか?

ウィジェットとは、何らかの機能を持ったプログラムのことで、WordPress(ワードプレス)ではウィジェットを利用することで「カレンダー」や「最新の投稿一覧」、「カテゴリ一覧」や「タグ一覧」などのコンテンツを表示することができるようになります。

表示したり、設定できる位置などは利用している「テーマ」によって異なりますので、設置や表示についての詳細などは実際に利用する「テーマ」にそって確認をする必要がありますが、多くはページのヘッダー、サイドバー、メインコンテンツ、フッターなどの要素部分に表示をさせることができます。

なお、WordPress(ワードプレス)で用意されているウィジェットで、ネットショップ(ECサイト)として比較的利用頻度の高いと思われる項目は次のような項目になります。

  • カレンダー
  • 最新の投稿
  • カテゴリ一覧

ただし、あくまで一例ですので、運営されるサイトの構成などにあったウィジェットを自由に追加してみてください!

新しいバージョンのWordPressを利用されている場合には、ウィジェット設定のエディターも投稿ページや固定ページのエディターと同じように「ブロックエディター」が導入されています。
ウィジェットのブロックエディターご利用については「WordPress ウィジェット設定のブロックエディターについて」をご参照ください。

ウィジェットを設定してみよう

例としてメニュー部分に「カレンダー」のウィジェットを表示させてみます。
(例では、WordPress(ワードプレス)標準テーマ「Twenty Fifteen」を利用して説明しています。)

1.ダッシュボード(管理画面)の「外観」>「ウィジェット」を選択します。

ご注意

ウィジェットの設定や表示設定、項目名についてはテーマごとに異なります。
ここでは作成したメニューをサイト上のどの場所に表示するかを選択しますが、選択できる位置や項目も使用するテーマによって異なりますのでご注意ください。

2.「利用できるウィジェット」に本テーマで設定ができるウィジェットが表示されているので、
今回の目的の「カレンダー」をマウスで左クリックしたまま右の「ウィジェットエリア」まで移動します。

以上で「カレンダー」の追加は完了です。
ホームページを参照してみると、検索フォームの下に「カレンダー」が追加されました。

※カレンダーのデザインについてはphpやHTMLの直接編集が必要になります。

ご注意

ウィジェットとして挿入したパーツのデザインはテーマにより異なります。
また、ウィジェットを設定・表示できる個所もテーマによって異なりますので、ご利用の際にはテーマの表示や取り扱いと照らし合わせてご自身の責任の下でご活用ください。

ウィジェットの編集や削除について

「ウィジェットエリア」に追加したウィジェットのタイトルを変更・編集したり、ウィジェットを削除することもできます。

1.ダッシュボード(管理画面)の「外観」>「ウィジェット」を選択します。

2.「ウィジェットエリア」に表示されているウィジェットをクリックすると、設定メニューが表示されます。

  • ①「タイトル」を入力するとWebページに表示されるタイトルを設定することができます。
  • ②「削除」をクリックするとウィジェットを削除することができます。

例では、「最近の投稿」ウィジェットについて「新着商品のご紹介!」とのタイトルに変更しました。
変更後は「保存」ボタンをクリックし設定を有効にします。

3.Webページを参照すると「新着商品のご紹介!」として新着情報が参照できるようになりました。

カメコ
カメコ

いかがでしょうか?ウィジェットを上手く活用することで、WordPress(ワードプレス)で作成したページにいろいろなパーツを簡単に追加する事ができるので、ぜひお試しください!