はてなブログへのバナー掲載方法

 1. にほんブログ村バナーhtml取得方法

 2. はてなブログでのバナー掲載方法

 3. その他のバナー掲載方法はこちら (細かく設定したい方向け)



1. にほんブログ村バナーhtml取得方法

PCからバナーhtmlを取得したい方
マイページに移動しましたら、バナー管理にカーソルを当てるとメニューが新たに表示されるので、下記画像赤枠内の「バナー」をクリックしてください。


バナーをクリックすると下記ページに遷移するので、赤枠内の「カテゴリー・総合ブログのバナー」をクリックしてください。
クリック後にブログの見本が表示されるので、青枠内の文字をコピーしてください。


以上でバナーが取得できますので、お試しくださいませ。


バナー掲載方法へ進む


スマートフォンからバナーhtmlを取得したい方

マイページに移動しましたら、赤枠内の「メニュー」をクリックしてください。

メニュー画面が開いたら赤枠内の「バナー管理」をクリックしてください。

バナー管理クリック後、下記画面に切り替わりましたら、「バナー一覧」をクリックしてください。


ページが遷移しましたら、赤枠内の「カテゴリー別バナー」部分をクリックするとバナー見本が表示されますので、使用したいバナー画像下の青枠内の文字列をコピーしてください。


以上でバナーが取得できますので、お試しくださいませ。


バナー掲載方法へ進む

目次へ戻る




2. はてなブログでのバナー掲載方法

PCでの初期設定

以下のような設定を行ってください。これを行わないと、スマートフォンから閲覧する方にバナーが表示されません。


はてなブログの管理画面から、デザインをクリックし、①のスマートフォンのアイコンをクリックします。
スマートフォンのアイコンをクリックした後に、②の記事をクリックします。


記事をクリックした後に、記事上下のカスタマイズ欄にある、③の「PCと同じHTMLを表示する」にチェックを入れてください。
チェックを入れた後に、④の変更を保存するをクリックしてください。


以上の設定ができましたら、PCからのバナー掲載方法へ進んでください。


PCからのバナー掲載方法

はてなブログの右上にある自分のアイコンから、デザインをクリックし、①のカスタマイズをクリックします。


カスタマイズをクリックした後に、②の記事をクリックします


記事をクリックした後に、記事上下カスタマイズ欄にある、③の記事下の枠内をクリックしてください。


クリックした後に、空白内で右クリックし、④の貼り付けをクリックします。
貼り付けが成功すると、⑤のようにバナーhtmlが貼り付けられます。
⑤のようになりましたら、⑥の変更を保存するをクリックしてください。


以上で完成しますので、お試しくださいませ。


目次へ戻る


スマートフォンでの初期設定

マイブログから、①の設定をタップします。


設定に移動した後に、編集モード欄にある、②のはてな記法モードかMarkdownモードを選択してください。


以上の設定ができましたら、スマートフォンからのバナー掲載方法へ進んでください。


スマートフォンからのバナー掲載方法

新規記事から、本文にバナーhtmlをペーストし、記事を書いてから公開してください。


目次へ戻る



3. その他の掲載方法


PCから新規記事へのバナー掲載方法はこちら

新規記事から、左上にある、①のHTML編集をクリックします。
HTML編集をクリックした後に、余白内で右クリックし、②の貼り付けをクリックします。
貼り付けが成功すると、③のようなバナーhtmlが表示されます。


貼り付けた後に、④の編集見たままをクリックします。
すべて成功していると、⑤のようにバナーが表示されます。
⑤のように表示されましたら、記事を書いて、⑥の記事を更新するをクリックしてください。

以上で完成しますので、お試しくださいませ。


その他の掲載方法へ戻る

目次へ戻る


PCから記事上へのバナー掲載方法

はてなブログの右上にある自分のアイコンから、デザインをクリックし、①のカスタマイズをクリックします。


カスタマイズをクリックした後に、②の記事をクリックします


記事をクリックした後に、記事上下カスタマイズ欄にある、③の記事上の枠内をクリックしてください。


クリックした後に、空白内で右クリックし、④の貼り付けをクリックします。
貼り付けが成功すると、⑤のようにバナーhtmlが貼り付けられます。
⑤のようになりましたら、⑥の変更を保存するをクリックしてください。


以上で完成しますので、お試しくださいませ。


その他の掲載方法へ戻る

目次へ戻る


PCからサイドバーへのバナー掲載方法はこちら

はてなブログの右上にある自分のアイコンから、デザインをクリックし、①のカスタマイズをクリックします。


カスタマイズに移動した後に、②のサイドバーをクリックします。
サイドバーをクリックした後に、③のモジュールの追加をクリックします。


モジュールの追加をクリックした後に、左の欄から、④のHTMLをクリックします。
枠内で、右クリックし、⑤の貼り付けをクリックします。
貼り付けが成功しましたら、⑥のようなバナーhtmlが表示されます。
⑥がのようになりましたら、⑦の適用をクリックしてください。


以上で完成しますので、お試しくださいませ。


その他の掲載方法へ戻る

目次へ戻る


PCからフッタへのバナー掲載方法はこちら

はてなブログの右上にある自分のアイコンから、デザインをクリックし、①のカスタマイズをクリックします。


カスタマイズに移動した後に、②のフッタをクリックします。
フッタをクリックした後に、③の空白内をクリックします。


クリックした後に、空白内で右クリックし、④の貼り付けをクリックします。
貼り付けが成功すると、⑤のようにバナーhtmlが貼り付けられます。
⑤のようになりましたら、⑥の変更を保存するをクリックしてください。


以上で完成しますので、お試しくださいませ。


その他の掲載方法へ戻る

目次へ戻る