【スマホ版写真解説付き】WordPressウィジェットって何? SWELLのサイドバーどうやるの?

これが一番分からなかったです、それはサイドバー!

ウィジェットは実際見てみれば理解できる感じでしたが、サイドバーよ。

月海

何度やっても何度やっても表示されないよ。

スマホからでしかSWELLを操作してないからなのかもしれませんが、サイドバーの編集画面でもどこがどれに相当するのか分からない!

かなーり悪戦苦闘しました。

目次

ウィジェットって何?

ウィジェットは簡単に言うと、ブログやサイトを作る為のオプション部品です。

月海

無くても大丈夫だけど、あると便利なトッピング的な!

ただ単に記事や小説だけ書く分にはウィジェットを導入しなくても初期設定のままでも大丈夫です。新着記事とアーカイブは初期設定でも表示されていましたし。

けれど読む側としては、

  • どんな人が書いているのか(プロフィール)
  • 特定の記事だけ読みたい(検索やカテゴリー)
  • どんな記事が読まれてるのか(人気記事)

など、あった方が親切、便利だな、と思える機能があるわけです。(メールフォームはプラグインで導入してるので除外します)

その為の外付け機能のことをウィジェットと呼びます。

サイドバーって結局どこなのさ

月海

サイドバーだから、横っちょに表示されるアレでしょ?

と思ってたら違いました。

サイドバーはあっちこっち色んなところに表示できるようになっていて、すべてを引っくるめて「サイドバー」と定義してるようです。

けれどどのサイドバーがどこに表示されるのか、スマホ版ではやってみないと分からない名称のものもあり、私はここで長らく詰まっていました。

月海

あまりにも分からないのでいっそ全て非表示にしてやろうかと思ったくらい。

まずはここ!

ここの赤マルを押すと表示されるサイドバー。

今現在は検索、カテゴリー、新着などが表示されてます。

この部分に表示させるのが一番分かりませんでした。

ここに表示させるのに何日も何日も掛かったんですよ。途中めんどくさくなって投げてたけど。

ちなみにSWELLのサイドバーは↓の画像ような感じで選択します。

2種類の選択画面が表示されていますが、左側はライブプレビューと言って、サイドバーの場所を指定してから表示させるウィジェットを選択する場合の画面。

右側は逆にウィジェットを選択してから、表示するサイドバーを選んでいく場合の画面です。

私は左側のライブプレビューからやりましたが、これはどちらからでも使いやすい方で大丈夫です。

画像は途中で切れていますが、まだ選択できるサイドバーの場所はいくつかあります。

そして私が詰まっていたトップページ左上のサイドバーは、この画像の中のどこから設定するのかと言いますと。

ここです。「スマホ開閉メニュー下

スマホ開閉メニューって名前だった!

月海

トップページ云々っていう部分じゃないんかい!

そりゃー初心者にはたどり着けません。

ウィジェットをサイドバーに組み込む

私のサイトは創作小説がメインなので、最低限、

  • サイト内検索
  • カテゴリー(小説のタイトルと、小説以外の記事が分かるようにしたい)
  • 新着記事(更新履歴の代わり)

これらがあれば良いのかな、と考えています。

月海

これをサイドバー「スマホ開閉メニュー下」に組み込みます。

ウィジェットの編集は、ダッシュボードメニューの「外観」→「ウィジェット」を選択します。

このような画面に切り替わります。

このまま編集する方は、追加したいウィジェット横にある「追加」ボタンを押してください。

試しにプロフィールを押してみました。

こんな感じで項目を入力する画面に切り替わるので、必要事項を入力します。

この画面を下にスクロールしていくと、追加するサイドバーの選択肢が出ますので、表示させたいサイドバーを選んで決定してください。

なお、「ヘッダー内部」と書かれたサイドバーはスマホでは表示されません

表示されないけれど、ウィジェットの設定が終わったら一度ブラウザをPCモードに切り替えて確認することをオススメします。

月海

なぜかと言うと、知らないうちに設定しちゃってるかもしれないからです!←やった

多分、分からない分からないと言いながらやってるうちに、サイドバーの「ヘッダー内部」にプロフィールを埋め込んだらしく、PCモードに切り替えたらトップページの画像半分を隠す形でプロフィールがドドーン! と表示されてました。

スマホでは何も表示されないので、PCモードに切り替えなかったら気付かなかったかもしれないです。

月海

お恥ずかしい……こまめにPCモードでも確認してね

▼PCモードへの切り替え方はこちらから▼

ライブプレビューでウィジェットを設定する

次に、ライブプレビューを使ってウィジェットを設定する方法です。

同じくサイドバー「スマホ開閉メニュー下」を使って説明します。

どちらも仕上がりは同じなので、好きな方で設定してください。

月海

普段私はこちらからやっています。

「外観」→「ウィジェット」の順で表示させるまでは一緒です。

ライブプレビューで編集する場合は、「ライブプレビューで管理」という部分をタップします。

すると以下の画面に切り替わるので、編集したいサイドバーを選びます。

ここでは「スマホ開閉メニュー下」を選びます。

右下の「ウィジェットを追加」をタップ。(画像はすでに追加した後のものです)

すると、次のような画面が表示されます。

画像は違うサイドバーを選んじゃってるんですが、右側に縦にほそーく+マークが表示されてるの、分かりますか?

これが追加するウィジェットの選択肢です。

月海

ここが私が困った場面です。
きちんと表示されてないと思い込んで進めませんでした。

でも良く見ると、縦長に表示されているだけで、きちんと選択肢は認識できるようにはなっています。

慌てず、落ち着いてスクロールし、追加したいウィジェットを選びましょう。

ウィジェットを追加すると、

こんな感じで一覧化されるので、ウィジェット名をダブルタップし、項目の入力が必要だったら入力してから最後に忘れず一番下にある「完了」を押してください。

ウィジェットをサイドバーから削除したい場合は「完了」の隣の「削除」を押します。

そして最後に。

公開ボタンを忘れずにタップ!

月海

よく押し忘れて何度もやり直すんですよ、私。

以上でウィジェットの設定ができます!

サイドバーのそれぞれの表示場所は、また別の記事でー!

月海

お疲れ様でーす!

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