アメブロの全ページにフォームを表示する方法
アメブロには、トップページを表示したときだけ記事の上に表示できる「メッセージボード」という機能があります。
しかし、こういった表示を記事ページでもしたい、という要望もちらほら見かけます。
以下の手順で実装できましたので自分もやってみたい！という方は試してみてください。
＜2012年1月9日追記＞
トップページとそれ以外のページで表示内容を変える方法も書きました。
アメブロのトップページとそれ以外で異なるフォームを表示する
＜追記ここまで＞
方法は、
1. アメブロの中で完結する方法
2. 外部サーバーを利用する方法
の2通りがあります。
なお、アメブロ側で仕様が変わるなどして使えなくなることもあるかと思いますので実装できない場合はコメントなどでご連絡ください。
1. アメブロの中で完結する方法
フリープラグインに、下記のコードを書きます。
【表示したいHTML】に改行が入っているとうまく動かないので注意が必要です。
<script language=”javascript”><!–
function displayForm() {
var thisContent =’【表示したいHTML】’
var targetTag = document.getElementsByTagName(‘div’);
for(i = 0; i < targetTag.length; i++){
thisObject=document.getElementsByTagName(‘div’)[i];
if(thisObject.className==’skinMainArea2′){
thisObject.innerHTML = ( ‘<p class=”form_js”>’+ thisContent + ‘</p>’)+thisObject.innerHTML;}}}
window.onload = function(){displayForm();}
// –></script>
上記コードのざっくりとした意味は、「<div class=”skinMainArea2″></div>というカタマリがあったらその前に【表示したいHTML】を追加しますよ」といった感じです。
ただし、フリープラグイン自体に文字数の制限があるのでフォームの内容が長くなる場合は注意が必要です。
2. 外部サーバーを利用する方法
外部サーバーを利用する場合は文字数制限がないので気楽に設置ができます。
なお、今回ご紹介するのはPHPという言語が使えるサーバーをレンタルしている場合です。
外部サーバーに以下の2つのファイルを設置する
(1) form_js.php
以下のコードをコピペしてUTF-8で保存します。
<?php
$target_file = “./msgbrd.html”;
$arr_search = array(“\n”,”‘”);
$arr_replace = array(“”,”\'”);
$content = str_replace($arr_search, $arr_replace, file_get_contents($target_file));
?>function displayForm() {
var thisContent ='<?php echo $content; ?>’
var targetTag = document.getElementsByTagName(‘div’);
for(i = 0; i < targetTag.length; i++){
thisObject=document.getElementsByTagName(‘div’)[i];
if(thisObject.className==’skinMainArea2′){
thisObject.innerHTML = ( ‘<p>’+ thisContent + ‘</p>’)+thisObject.innerHTML;}}}
(2) msgbrd.html
このファイルには表示したいフォーム（またはそれ以外の任意の内容）を書きます(UTF-8)。
iframeのようにページ丸ごとを表示するわけではなくページの一部分に追記するので、スタイルシートや画像を使う場合は絶対パスで書いた方がよいと思います。
(2) フリープラグインに以下のコードを貼り付ける
<script language=”javascript”
src=”http://【(1)で設置した外部サーバー】/form_js.php”></script>
<script language=”javascript”><!–
window.onload = function(){displayForm();}
// –></script>
もし上記の方法でうまくいかなかったり、もっと別の方法でやっているよ、という方がいらっしゃったらTwitterなどからご紹介頂けると嬉しいです。
