
ブログを音声入力することで作業効率があがったから、今日は午後の部を書いて公開するよ!

すごいね音声入力!!
それで午後の部のテーマは何?

午後の部はブログ村のバナーにgif(動く画像)を取り込むやり方を紹介するよ!
上手くすればランキングアップにつながるかも?

当ブログを読んだ施主の皆様が、家ブログを書くときに役立ちそうな知識ですね!!
☑家づくりのブログを書きたい方
☑家づくりの記録をしようか迷っている方
☑ブログ村での順位を上げたい方
〇ちょっとこだわったブログを書くコツはこちらのシリーズをごらんください。



お品書き
ブログ村のバナー作成法

まずは標準的なバナー作成法について軽くおさらいしておきます。 ブログ村に初めて登録される方向けなので、登録済みの方は読み飛ばしO.Kです

下に示されましたボタンのようなもの、これがバナーですね。



これをブログに設置しておくだけでブログ村のランキングに参加することができます。まず上のバナーをクリックしてブログ村にアクセスしてみてください


実はバナーが押された時点で、お一人あたり10ポイントがブログに加算されます。
貴重なポイントをありがとうございました。

(ちゃっかりしてるね、ヨムオ君)
で、緑の新規会員登録ボタンを押せば良いのかな?

会員登録を済ませるとマイページを作成することができます。 そしてこちらがマイページの画面です。
左側のメニューからバナーを作ることができますのでやってみてください。


【バナー】か【オリジナルバナー】かの選択ができますので、まずは【バナー】を選択してみましょう。


【カテゴリー・総合ブログのバナー 】 をクリックすると自身が参加しているカテゴリーのバナーを作るためのhtmlコードが表示されます。
<a href=”https://house.blogmura.com/ranking.html?p_cid=10995333″ target=”_blank” ><img src=”https://b.blogmura.com/house/88_31.gif” width=”88″ height=”31″ border=”0″ alt=”にほんブログ村 住まいブログへ” /></a><br /><a href=”https://house.blogmura.com/ranking.html?p_cid=10995333″>にほんブログ村</a>

こんな感じの文字列をhtmlコードとして記事内に張り付ければ完成です。(ワードプレスならカスタムhtmlというフォーマットがあると思います。)
かんたんですね!
ブログ村のgifバナー作成法

先ほどの【バナー管理】では【オリジナルバナー作成】ができるのですが、jpegやpngなど静止画像にしか対応していません。


【オリジナルバナー作成】では↓のようなバナーが作れます。これだけでも通常のバナーより目を引くデザインかと思います。
にほんブログ村

なので別のアプローチが必要です。
下に示す2つのhtmlコードを見比べてみてください。
<a href=”https://house.blogmura.com/ranking.html?p_cid=10995333″ target=”_blank” ><img src=”https://b.blogmura.com/house/88_31.gif” width=”88″ height=”31″ border=”0″ alt=”にほんブログ村 住まいブログへ” /></a><br /><a href=”https://house.blogmura.com/ranking.html?p_cid=10995333″>にほんブログ村</a>
このコードが示す内容は↓

にほんブログ村
<a href=”https://blogmura.com/ranking.html?p_cid=10995333″ target=”_blank” ><img src=”https://yomuotoko2.me/wp-content/uploads/2019/08/1566191896Lk9z31exSPXiQ181566191893.gif” width=”240″ height=”240″ border=”0″ alt=”にほんブログ村 にほんブログ村へ” /></a><br /><a href=”https://blogmura.com/ranking.html?p_cid=10995333″></a>
このコードが示す中身は↓

にほんブログ村
2つのコードの違いは実は〇〇と△△の部分だけです。
<a href=”https://blogmura.com/ranking.html?p_cid=10995333″ target=”_blank” ><img src=”〇〇〇〇〇” width=”△△” height=”△△” border=”△△” alt=”にほんブログ村 にほんブログ村へ” /></a><br /><a href=”https://blogmura.com/ranking.html?p_cid=10995333″> にほんブログ村 </a>
〇の部分にはブログに投稿しておいたgifファイルのアドレスを、△の部分には表示したいサイズを入れればO.K.です。
ブログ村のgifバナー作成法
- 画像編集サイト(Canva)で画像を編集。
- ↓のgifでは20枚程度の画像を用意しました。
- gifアニメ作成サイト(BANNER KOUBOU)に作成した画像をアップ

- gif画像をブログにアップ
- アップした画像の詳細画面にあるアドレス(https:で始まる)をコピー
- ブログ村でgif用の静止画像1枚を使ってオリジナルバナー作成
- そのバナーのhtmlコードのアドレス部分をgifのアドレスに書き換える
せっかくマスコットキャラやgif画像を作ったのですから、さまざまな場所に活かしたいですよね。
例えば、吹き出し画像や記事中画像でもgifとしてアップする事ができます。
ぜひいろいろ試してPV数アップを狙ってみてください。
ブログ村のバナーをgif化してINポイント&ランキングアップを狙おう!のまとめ
☑gif画像作成法
☑バナー画像をgif化する方法

今回の記事はいかがでしたでしょうか?
“ブログ村No.1マスコットキャラ”るんばーが動くgifバナー、いいね!と思われましたらクリックをお願いします。

いつからNo.1マスコットに!?
猫ブログとか犬ブログの人に謝りなさい!

↓の方に出口一覧があります。
いずれもおススメリンクですので、お時間がありましたらそちらからご退出ください。
関連記事もお読みいただけますと嬉しいです。
【WEB内覧会系】
【家づくりのポイント】
【ハウスメーカー実例系】