2013年3月8日金曜日

アメブロのメッセージボードをすべての記事の上で常に表示させる

アメブロのメッセージボードはブログのトップページにしか表示されません。

     


この場合、例えばトップページに「相互読者募集!」とか「オススメの記事はこちら!」とか「無料相談はこちら!」とか読者へ伝えたいメッセージを書いてもトップページにしか表示されないため、それぞれの検索やリンクなどでそれぞれの記事に直接来た人にはうまくメッセージを伝えられません。

 これってかなりの機会損失だと思います。

 っというわけでアメブロのメッセージボードを常に表示できるようにしてみました。

 フリープラグインを使うので、アメブロの管理画面からサイドバーの「プラグインの追加」の画面で「フリープラグイン」をクリックします。


 

 そして、フリープラグインの中に、

 ============================


<script type="text/javascript" src="http://www.google.com/jsapi"></script> 
<script type="text/javascript">google.load("jquery", "1.6");</script>


<script type="text/javascript">
var myMe ='表示させたい文章'
$(function() {
$(".skinMainArea2").before('<div class="fix">'+ myMe + '</div>');
});
</script>


  =======================

 を貼付けます。

 他にもプラグインを使っている場合には特に気にせず、一番下に貼付けてください。

「表示させたい文章」というところにアメブロのメッセージボードで表示している文章を表示させます。

 そのため、アメブロの管理画面から「メッセージボード」へ行きメッセージボードの内容をコピーしますが、このときにメッセージボードの中にある無駄な改行を無くして改行を消してからコピーしましょう。


 


 そして、コピーしたメッセージボードを先ほどのフリープラグインに貼付けて保存して完成です。

 一応、作業の際はバックアップのため、メッセージボードやフリープラグインの内容はテキストファイルなどにコピーしてから作業した方が良いです。

 そして、最後に一手間。

 このままだとトップページにメッセージボードが二つ表示されちゃいます。


 


 各記事などにちゃんとメッセージボードが表示されていることが確認出来たら、最後に管理画面からメッセージボードを開いてすべて消して保存すれば完成です。


 


 これで、すべての記事にメッセージボードが表示されるようになりました!!


 

 これだけでも、読者の反応が変わると思うので試してみてください!

アメブロのメッセージボードの活用 〜メッセージボードの文字の太さや大きさ色や配置の変更方法〜




アメブロのメッセージボードはテキストのサイズや太さや色の変更ができるようになっていないためもし、自分で文字の色や大きさ、太さなど変更しようとするとHTMLタグを打ち込まないといけなくて非常に面倒なので、ひと工夫してみました。

まずは、ブログの記事を書く画面にいきます。
そして、好きなようにメッセージボードに書く文章を書きます。





色をつけたり、配置を真ん中にしたり、大きさを変えたり、文字を太くしたら今度は表示を「通常表示」から「HTML表示」に変更します。






そして、出て来たタグをコピーします。
次にメッセージボードの画面に行き、コピーしたタグを貼付けます。





読者登録ボタンを以前の記事に書いた通り設置したので、そのタグの上部に貼付けます。
貼付けたら「表示を確認する」で実際にどうなっているか確認しましょう。

確認してみるとバランスが少しおかしいです。




 再度、記事を書く画面に行って編集して確認を繰り返します。
気をつけないと行けないのでが、文章の途中で段落を設ける場合、

例えば、

今日はいい天気ですね。


今日は
いい天気ですね。

という書き方にすると<br>というタグがつきますが、メッセージボードにそのまま貼付けると余分な改行をしてしまうのでメッセージボードに貼付けるときに<br>というタグを探して消して調整してみましょう!

何度も調整したらきれいになりました!




アメブロのメッセージボードの活用 〜メッセージボードに読者登録ボタンを設置してみる〜














アメブロを見ているとメッセージボードに読者登録ボタンを設置している人がいます。

ブログを始めた頃に効率的に読者を増やすために効果的なので今回設置してみることにしました。

まずは、読者登録ボタンを用意します。

自分で作っても良いですが、結構面倒なので無料でボタンの画像を提供してくれるところを探します。

「読者登録ボタン」「画像」「無料」
とかで検索すれば出て来ると思いますので、そこからもらって画像を準備します。

僕は、無料アメブロテンプレートについていたボタンを少し加工して使うことにしました。






次に、画像をアメブロにアップロードします。
















管理画面の左のサイドバーから「投稿・編集」カテゴリの「画像フォルダ」をクリックします。次に「ファイルの選択」をクリックして最後に「アップロード」をクリックします。

無事に読者登録ボタンがアップロードされると下に画像が表示されるので、記事に追加をクリックします。


すると、ブログ記事を書く画面に画像が表示されて移動されるので、「通常表示」から「HTML表示」に変更します。変更するとHTMLのタグが出てきます。












僕の場合には下記の様なタグが出てきました。
===========================================


<a href="http://stat.ameba.jp/user_images/20120914/14/neobp/e8/72/j/o0280007012187136657.jpg"><img src="http://stat.ameba.jp/user_images/20120914/14/neobp/e8/72/j/t02200055_0280007012187136657.jpg" alt="元不動産営業マンが日本の不動産に見切りをつけて旅をしながら海外投資とネットを主戦場に戦うネオバックパッカーのブログ!" id="1347609359234" ratio="4"></a>


===========================================

一番頭のところの、

http://stat.ameba.jp/user_images/20120914/14/neobp/e8/72/j/o0280007012187136657.jpg

の部分が画像の保存先になります。
これを【1】のリンク先とします。


次に「読者登録」のリンク先を探します。
自分のブログの「読者になる」ボタンのリンク先のアドレスをコピーしまう。





これを、リンク【2】とします。


次にアメブロの管理画面のサイドバーにあるメッセージボードを開きます。















そこに、以下のタグをコピーして貼付けます。


<div style="text-align: center;">
<a href="◆リンク【2】◆">
<img src="◆リンク【1】◆" alt="読者登録" border="0" />
</a></div>

◆のところにはリンク【1】と【2】を入れてください。

そして、公開をクリックします。
すると、トップページの記事の上に「読者登録ボタン」が設置されました。















これで、読者を増やしていきましょう!

アメブロのメッセージボードの活用 〜メッセージボードには何を書いたらよいか?〜


アメブロのメッセージボードって使ってますか?

メッセージボードとはアメブロのトップページのヘッダーの下、記事の上にあるメッセージが書かれているスペースです。

ここを有効的に使うことによって、より効果的に読者やブログの訪問者に語りかけることができます。

じゃあメッセージボードには何を書いたら良いでしょうか?

そのときに伝えたいことを書いて常に更新していくようにしましょう!



例えば、

世界一周ブログの場合
「日本→香港→ラオス→シンガポール(いまここ!)」

みたいな感じで現状をわかりやすく伝えます。


副業チャレンジブログの場合
「8月の売り上げ 100,000円 のうち利益90,000円」
 来月の目標
    売り上げ 150,000円 のうち利益120,000円」

とか現状を分かりやすく書いてあげましょう。

読者登録を増やしたいときにはそのようなメッセージを、メールマガジンを運営している人はメールマガジンの登録スペースにも使えますし、書評ブログなら最近の一押しの本など、そのとき相手に一番伝えたいスペースに使えます。

しかし、注意しないといけないのはトップページ以外には表示されないのです。


よく、会社の連絡先などをメッセージボードだけに表示している人がいますが、直接検索などで記事に来てくれた人には見えなくなってしまいますので、ちゃんと毎回記事の一番下にいれるかサイドバーに設置しましょう!

アメブロのメッセージボードに画像を表示させてボタンをつける

メッセージボードにメッセージを表示させることは簡単ですが、今回は画像を表示させてみることにします。

 画像を表示させるには、まず表示させたい画像をアメブロや他のサーバーにアップさせないとだめですが、今回はアメブロにまずはアップしてみましょう。

 まずは、サイドバーの「画像フォルダ」をクリックして「ファイルを選択」そしてファイルを選んだら「アップロード」でアップロードします。


 


 そうしたら、画面の下に今アップロードした画像が表示されるので「記事に追加」をクリックします。


 


 すると、先ほどアップした画像のリンクタグができますのでそのままコピーします。


 


 それを、そのままメッセージボードに貼付けるとアメブロのメッセージボードに画像が表示されます。

 しかし、そのままだと画像が左によってしまうので真ん中に表示させるには、先ほどコピーした画像のリンクタグを先ほどのリンクタグの両側に貼付けます。



<div style="text-align: center;">先ほどコピーした画像のリンクタグ</div>


先ほどのリンクタグの両側に貼付けます。これで、画像が真ん中に表示されるようになりました。


 今回はアメブロのメッセージボードに画像を表示させるだけでしたが、ボタンの画像をアップしたのでついでにクリックするとリンク先に飛ぶ画像にします。


 まずは、画像をクリックしたら表示されるURLを準備します。そして、下の「ここに表示したいURLを記入」のところに挿入します。


〇〇の部分は先ほどアップロードした画像のリンク先と名前にそれぞれなっていると思うので実際には〇〇とはなってなく、URLや名前が表示されていれば大丈夫です。



<div style="text-align: center;"><a href="ここに表示したいURLを記入" target="_blank"><a href="〇〇"><img src="〇〇" alt="〇〇" /></a></div>




を先ほどのタグの代わりにメッセージボードに張り付ければボタンが表示され、画像をクリックするとリンク先が表示されるようになります。


 

 こうすることによって、アメブロのメッセージボードを有効に使うことができると思いますので、ぜひ試してみてください!