注目キーワード
  1. Kyash
  2. espo
  3. THE THOR

THE THORでにほんブログ村のバナーを設置する方法【WordPressユーザー向け】

ブログ村の登録が完了したら、次はバナーの設置です。

バナーを設置すると、記事を読んだユーザーのクリックでポイントが貯まります。

ポイントを貯めてランキング上位にいくことで「にほんブログ村」からの流入も増えて、多くのアクセスを得ることができますね。

今回はWordPressのテーマ「THE THOR」で「にほんブログ村」のバナーを設置する方法について解説します。

ワードプレス(THE THOR)でにほんブログ村のバナーを設置する方法

バナーの設置

バナーの取得

メニューの「バナー管理」>「バナー」をクリック。

バナー管理

バナー一覧」が表示されるので、「カテゴリー・総合ブログのバナー」をクリックします。

バナー一覧

バナーのイメージ・コードが表示されるので、設置したいカテゴリのコードをコピーしましょう。

このコードをブログの所定の箇所に記載することでバナー設置することができます。

バナーのコード一覧

WordPressに設定

WordPressでバナーを設置する場合は、

外観」>「ウィジェット」を使用します。

WordPressのウィジェット

バナーを設置したいエリアを選択します。

設置したいエリアを選ぶ

当サイトでは「投稿ページ下部エリア」に設置しています。

ここに設定しておくと、全ての投稿の下部エリアにバナーが表示されるようになるので、各ページごとに設定する必要がありません。

バナーのコードは「カスタムHTML」に記載しましょう。

  • タイトル:空欄でOK
  • 内容:バナー一覧からコピーしたコードを貼り付けます。

カスタムHTML

完了」ボタンをクリックすると保存が完了して、サイトに反映されます。

例えば、カテゴリのバナーコードをそのまま貼り付けると下記のような表示になります。

カテゴリバナーコード

カテゴリバナー表示

生活ブログ」の画像部分も「にほんブログ村」の文字の部分もクリックすることができ、クリックすると「生活」カテゴリのランキングページに飛びます。

自分のサイトに合ったカテゴリのバナーを選びましょう。

デフォルトの設定で問題なければ、ここまででバナーの設置は完了です。

バナーのアレンジ

先ほど貼り付けたバナーのコードを見てみましょう。

バナーコードの解説

赤枠部分がサブカテゴリの画像部分、青枠部分が「にほんブログ村」の文字部分です。

黄枠部分の「<br />」は改行の意味です。

改行「<br />」を削除してみると、下のような表示になりました。

改行を消したバナー表示

また、「にほんブログ村」と書かれている文字は自由に書き換えて問題ありません。

これらを応用して、当サイトでは

カテゴリボタン」「ブログ村総合ボタン」「メッセージ

が横並びで表示されるように設定しています。

<a href=”https://life.blogmura.com/seikatsujutsu/ranking/in?p_cid=XXXXXXXX” target=”_blank” ><img src=”https://b.blogmura.com/life/seikatsujutsu/88_31.gif” width=”88″ height=”31″ border=”0″ alt=”にほんブログ村 その他生活ブログ 生活術・ライフハックへ” /></a>
<a href=”https://blogmura.com/ranking/in?p_cid=XXXXXXXX” target=”_blank”><img src=”https://b.blogmura.com/88_31.gif” width=”88″ height=”31″ border=”0″ alt=”ブログランキング・にほんブログ村へ” />←応援お願いします!</a>
  • 赤字部分はカテゴリによって異なるので、掲載したいカテゴリを選んでマイページのバナー一覧に載っているとおりにコピーしましょう。
  • 青字部分はユーザーによって異なる8桁の数字が入ります。
  • 黄字部分はクリックしてもらえるように、読者に向けたメッセージを書きましょう。

以上でバナーのアレンジは完了です。

自分好みにカスタマイズして、より多くの人に見てもらえるように工夫しましょう!

にほんブログ村バナー設置方法
最新情報をチェックしよう!