≫≫【超簡単】副業ブログの始め方を詳しく解説!

【SWELL】サイドバーの基本設定3つとカスタマイズ方法!

当ページのリンクには広告が含まれています。
記事タイトルとイラスト画像
  • URLをコピーしました!

SWELLでサイドバーの設定ってどうやるの?

トム

そんな質問にお答えしていきますね。

また、本記事はブログ初心者さん向けに、やさしく解説しているので安心して読み進めて下さい。

自己紹介
この記事を読んで欲しい人
  • SWELL使用のブログ初心者さん
  • サイドバーの基本設定がまだ済んでない方
  • 「おすすめ記事」「広告リンク」を設定したい方

ブログの顔ともいうべきサイドバーは、サイト訪問者にとって大切なナビゲーションツールです

WordPressテーマ「SWELL」を使えば、初心者でも手軽に美しくそして機能的なサイドバーを設計できます。

サイドバーは、

「プロフィール」の表示から「最新記事」の紹介、「広告リンク」の設置まで、サイドバーはブログの「顔」として多岐にわたる情報を伝える大切な場所。

本記事で、サイドバーの基本的な設定方法を学んでいって下さい。

続きを読めば、あなたのブログもきっと次のレベルへと進化させることができるはずです。

ぜひこの続きで、サイドバー設定の「いろは」をマスターしましょう。

目次

【SWELL】サイドバー3つの基本設定

当サイトのサイドバーにも設置してある4項目の設定方法を順番に解説していきますね。

まずは、

トム

プロフィールからいきます。

プロフィール

プロフィールに記載・入力できる情報
  • 名前
  • 役職(肩書き)
  • プロフィール文
  • アイコン画像
  • プロフィール背景画像 など

早速、プロフィールをサイドバーに設置していきます。

できれば、

トム

別タグで自分のサイトを開いて一緒に作業しましょう。

STEP
WordPress管理画面のダッシュボード「外観」>「ウィジェット」をクリック
STEP
[SWELL]プロフィールをクリック
STEP
「共通サイドバー」>「ウィジェット」をクリック
STEP
プロフィールに載せたい箇所を入力

*入力内容の変更はいつでも可能です。

なので、

トム

とりあえず名前だけでもOKです。

STEP
必要箇所の入力が終わったら画面下の「保存」をクリック
STEP
「ライブプレビューで管理」をクリックして表示内容を確認

設定したら、

トム

表示内容の確認をして完成です!

検索ボックス

続いて、検索ボックスを設置していきます。

検索ボックスは、サイト内の記事を検索できる便利な機能です。

サイトに訪問したユーザーが

トム

迷子にならないように設置しておきましょう。

STEP
WordPress管理画面のダッシュボード「外観」>「ウィジェット」をクリック
STEP
「検索」をクリック
STEP
「共通サイドバー」>「ウィジェットを追加」をクリック
STEP
「完了」をクリックして終了

*タイトルは任意なのでとりあえず無視してOKです。

新着記事

次は、

トム

新着記事の設置をしていきます。

STEP
WordPress管理画面のダッシュボード「外観」>「ウィジェット」をクリック
STEP
[SWELL]新着記事をクリック
STEP
「共通サイドバー」>「ウィジェットを追加」をクリック
STEP
必要事項の入力・変更をして「保存」をクリック

*タイトルは未入力でもOKです

STEP
「完了」をクリックして終了

【SWELL】サイドバーをカスタマイズ

広告リンクの設置

次は、他のサイトでもよく見かける「SWELLの広告リンク」を設置していきます。

SWELLの広告を取り扱うASPは、「もしもアフィリエイト」です。

まだ登録されてない方は、下記の記事を参考に登録を済ませておきましょう。

登録が済んでる方は、

トム

順番に進めていきましょう。

STEP
「もしもアフィリエイト」のサイトへログイン
STEP
検索窓に「SWELL」と入力
STEP
提携申請後、「広告リンクへ」をクリック
STEP
ソースをコピー
STEP
WordPress管理画面のダッシュボード「外観」>「ウィジェット」をクリック
STEP
[SWELL]広告コードをクリック
STEP
「共通サイドバー」>「ウィジェットを追加」をクリック
STEP
広告タグ:に、先ほどのソースコードをペーストして「保存」
STEP
「完了」をクリックして終了

おすすめ記事の設置

SWELLのサイドバーに「おすすめ記事」を設置するには、ブログパーツを作成する必要があります。

ひと手間増えますが、

トム

落ち着いて作業していきましょう。

STEP
WordPressの管理画面「ブログパーツ」>「新規投稿を追加」をクリック
STEP
「おすすめ記事(サイドバー)」と入力
STEP
記事作成画面の「+」ボタンをクリック
STEP
「投稿リスト」ブロックを表示
STEP
「ブロック」>「Settings」>「表示する投稿数」の変更
STEP
「ブロック」>「Pickup」>「投稿IDを直接指定」にID番号を入力

投稿IDは、WordPress管理画面のダッシュボード「投稿」>「投稿一覧」に記載されたIDの番号です。

記事毎に番号が割り振られているので、

トム

サイドバーに表示したい記事のID番号を入力しましょう

STEP
画面右上の「公開」をクリック
STEP
Word Press管理画面のダッシュボードにある「ブログパーツ」をクリック
STEP
呼び出しコードをコピー
STEP
「テキスト」をクリック
STEP
「共通サイドバー」>「ウィジェットを追加」をクリック
STEP
タイトルに「おすすめ記事」と入力
STEP
呼び出しコードを貼り付けて「保存」をクリック
STEP
「完了」をクリックして終了

追尾サイドバーの設置

ここからは、上↑の動画のように

トム

追尾サイドバーに目次を設置」する方法を紹介していきます。

STEP
WordPressの管理画面メニュー「外観」>「ウィジェット」をクリック
STEP
[SWELL]目次をクリック
STEP
「追尾サイドバー」>「ウィジェット」をクリック
STEP
「完了」をクリックして終了

*タイトルは任意なので無しでもOK。

ここまで、

トム

本当にお疲れ様でした。

まとめ

この記事を通じて、SWELLのサイドバー設定の基本から応用的なカスタマイズ方法について詳しく解説しました。

「プロフィール」の表示、「検索ボックス」、「新着記事」リストの設置は、ユーザーがブログの概要を把握しやすくするためにとても重要です。

一方で、

カスタムコンテンツとして「おすすめ記事」や「広告リンク」をサイドバーに取り入れることで、ユーザーの滞在時間を延ばし、ブログの収益化にもつながります。

また、「追尾サイドバー」機能は訪問者がスクロールしても常に表示される部分なので、記事の「目次」を設定することによりユーザビリティが向上するでしょう。

いずれにしても、サイドバーはブログに訪れる人々にとっては「目印」となるもの。

創意工夫して、

トム

ブログの魅力を最大限に引き出すよう工夫してみてください。

今回の情報が副業としてブログを始めたばかりの方にとって、一助となれば幸いです。

また、ブログ導入文の書き方について詳しく知りたい方は、下記の記事をご覧になっていってください。

以上、お付き合いありがとうございました。

記事タイトルとイラスト画像

この記事が気に入ったら
いいねしてね!

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