最終更新日:2018.05.31
WordPressの無料テーマ『LION MEDIA』について解説しているページです。
今回のテーマは、【ウィジェット】の使い方です。
ウィジェットの操作方法を知りたい方は、『LION MEDIA』の解説後に説明をしていますのでそちらをご覧ください。こちらからジャンプできます。
前回の記事はこちら
『LION MEDIA』カスタマイズ【SNS・OGP設定】の使い方
『LION MEDIA』ってなぁに? どんな機能があるのって方はこちら
8ヶ所のウィジェット設置エリア
『LION MEDIA』のウィジェット設置エリアは全部で8ヶ所もうけられています。
- 通常サイドバーエリア
- 固定サイドバーエリア
- TOPページ上部エリア
- 記事上エリア
- 記事下エリア
- 左フッターエリア
- 中央フッターエリア
- 右フッターエリア
WordPressをインストールした際に設定されている「Twenty Seventeen」と比べてみると、『LION MEDIA』の方が様々なエリアに設置できるのがわかりますね。
『LION MEDIA』のウィジェットエリア
「Twenty Seventeen」のウィジェット設置エリア
ウィジェットエリアのイメージ
ウィジェットのエリア名だけ言われても、なんだかイメージがわきませんよね。では、Webページのどのエリアのことをいっているのか見てみましょう。
TOPページ
TOPページは、2カラムを使用しているとサイドバーが表示されます。
メニューバーとアーカイブ記事のあいだにある「TOPページ上部エリア」、サイドバーの上部「通常サイドバーエリア」、通常サイドバーの下「固定サイドバーエリア」、TOPページのBack to Top の表示より下の「フッター(左、中央、右)エリア」があります。
TOPページ(クリックすると大きくなります。)
投稿ページ
投稿ページでは、上部のSNSフォローアイコンと記事のあいだにある「記事上エリア」、下部のSNSフォローアイコンの下にある「記事下エリア」があります。
投稿ページ
記事を読むときは、下へ下へとスクロールしていきますよね。
その際、通常サイドバーは記事と一緒に上へとあがっていき、記事が長いとサイドバーは見えなくなってしまいます。
しかし、固定サイドバーの場合、下へスクロールしてもある一定の位置に固定され、記事を追尾する形で表示され続けます。どんな長い記事であっても、固定サイドバーに設置したウィジェットは表示されたままなので、誘導したい別の記事を設置したり、ホームへすぐに戻れるようにボタンを設置したりといったことができます。
『LION MEDIA』のウィジェット
『LION MEDIA』には、[LION]人気記事と[LION]広告のウィジェットが追加されています。プラグインなしでランキング記事や、広告をすぐに配置することができます。
[LION]人気記事
ウィジェットの設定だけで、PV(ページビュー)数の多い順にランキング記事を表示することができます。
タイトルに何も入力していない場合は、「RANKING」と表示されます。
表示する投稿数は、何位まで表示するかを入力します(表示件数は自由)。
投稿日の表示にチェックを入れると日付が表示されます。
設定が終われば、「完了」をクリックします。
ランキング記事の表示例
[LION]広告
このウィジェットを使用すると広告表示が簡単に行えます。
AdSenseなどの広告タグを入力すると「Advertisement(広告)」と表示された広告枠が設置されます。
カスタマイズ済みのウィジェット「最近の投稿」
WordPressの通常ウィジェットとして備わっている「最近の投稿」。新着記事を紹介するウィジェットですよね。[LION]の表示はありませんが、サムネイル画像が表示されるようにカスタマイズされています。
「Twenty Seventeen」と「LION MEDIA」と比べてみると違いがよくわかります。
「Twenty Seventeen」の最近の投稿
「LION MEDIA」の最近の投稿
タイトルにあった画像を設定しておくと、内容もイメージしやすくなりますよね。
ウィジェットの設定はどこからするの?
ダッシュボード > 外観 >カスタマイズ > ウィジェット
もしくは、
ダッシュボード > 外観 > ウィジェット
から行うことができます。
前者の場合、「ライブプレビュー」(変更箇所がすぐにプレビューされる)で確認をしながら作業が行え、ウィジェットの「完了」をクリックしたあと、最後に「公開」ボタンを押すことで、サイト上に公開されます。
後者の場合、ウィジェットの「完了」をクリックすると変更した内容がサイト上に公開されます。
ウィジェットの操作方法
外観 > ウィジェット の操作
ウィジェットの追加【ドラッグ&ドロップ】
画面左に利用できるウィジェットの一覧、右に設置できるエリアの一覧が表示されています。利用したいウィジェットを設置したいエリアにドラッグ&ドロップすると配置できます。
すでに複数設置している場合は、挿入したい位置にドラッグ&ドロップします。例えば、「カテゴリー」と「アーカイブ」のあいだに「カレンダー」を設置したい場合、ドラッグ&ドロップで「カテゴリー」と「アーカイブ」のあいだに持っていくことで設置できます。
ウィジェットの追加【直接クリック】
追加したいウィジェットをクリックすると、エリアの一覧が表示されます。設置したいエリアを選択し「ウィジェットを追加」ボタンを押します。
追加したウィジェットは一番下の位置に挿入されます。詳細な設定項目が展開されるので、必要に応じて入力し、終われば「完了」をクリックします。
ウィジェットの並び替え
並び替えは、挿入したい位置にドラッグするだけです。
削除したい場合
ウィジェットタイトルの左にあるをクリックすると詳細項目が展開します。一番下にある「削除」をクリックすると、そのエリアから削除することができます。
また、「利用できるウィジェット」と表示されている位置へドラッグ&ドロップすることで削除ができます。
外観 > カスタマイズ > ウィジェット の場合
ウィジェットを設置していないエリアがある場合
使用していないウィジェットエリアがあると、「お使いのテーマには他に〇個のウィジェットエリアがありますが、このページでは表示していません。」と表示されます。
カスタマイザー上には、ウィジェットを設置しているエリアのみ表示されます。
8か所中、6か所設置の場合
カスタマイザー上にないウィジェットエリアに、ウィジェットを設置したい場合は、外観 > ウィジェット からのみ行えます。
ウィジェットの追加
ウィジェットを追加したいエリアをクリックすると、設置しているウィジェットが表示されます。
「+ ウィジェットを追加」ボタンをクリックしたら、ウィジェット一覧が表示されるので、追加したいウィジェットをクリックしましょう。
[LION]人気記事を追加した例
詳細項目を入力(必要に応じて)し、「完了」をクリック。最後に、画面上部の「公開」ボタンを押せばオンライン上に公開されます。
ウィジェットの並び替え
並び替えをいたいエリアをクリックし、設置しているウィジェットが表示されたら、項目の一番下に「並び替え」と表示があります。これをクリックすると設置しているウィジェットの表示が変わります。
「」「」をクリックすることで「上」「下」への移動が行えます。
ウィジェットを他のエリアへ移動する
ウィジェットを他のエリアへ移動したい場合は、「」をクリックするとエリアの一覧が表示されます。移動先のエリアをクリックするとウィジェットが移動されます。
削除したい場合
ウィジェットを削除したい場合は、ウィジェット名の左にあるをクリックすると詳細項目が開きます。一番下にある「削除」をクリックすると、そのエリアから削除することができます。
以上でウィジェットの解説は終了します。お疲れさまでした。
次は『LION MEDIA』を使うとWordPressの「投稿」「固定」ページはこう変わる!をお伝えします。
前回の記事はこちら
『LION MEDIA』カスタマイズ【SNS・OGP設定】の使い方
『LION MEDIA』ってなぁに? どんな機能があるのって方はこちら