『AddClipsIdが設定されていないか、他の設定に間違いがあります。』にハマる
Solarisの運用管理者として10年以上, Webサービスもちょこまかつまみ食いし、ともすれば寝る時間よりオンラインで過ごす時間の方が長い──そんなボクには、この業界では致命的な『苦手』がある。
プログラムが苦手なんである。
それが発覚したのは専門学校の卒業研究のときだった。
設計まではまずまず、素人なりにカタチになった。なのに。
開発の段にいたってプログラムがちっとも動かない。
テストフェイズになれど、発表の当日になれど、一連の画面の遷移でエラーの出ないことがない。直せども直せども、汲めども尽きぬバグの井戸──ってな具合。
それなりに自分はコンピュータと仲がよいのだと浅はかにも密かに自惚れていたボクの鼻はへし折れるといより、もはや粉々に踏み砕かれ。
おかげさまで、ひとときはコード恐怖症になったほどである。
もちろん、UNIX系OSの運用管理者ゆえ、日常の管理を行うスクリプト言語からは逃れられない。自分が少しでも楽をしたければ、LL言語の一つも使えねば──と、そんな事情から半ば強制的にリハビリをして恐怖症だけは治ったのだけれど。
それでも、未だにコードは苦手で。
それゆえか、AJAXで世に隆盛を極めるJavaScriptには未だマトモにお付き合いをしてこなかった。
こないだ、それがためにちょいとばかり苦労する羽目になり──
そんなわけで、今日は『学ばぬものは陥る』というお話。
AddClipsというサービスがある。
多くのソーシャルブックマークサービスにあなたのサイトを対応させたくありませんか?たくさんあるRSSリーダーの追加ボタンにうんざりしていませんか? Add Clipsはソーシャルブックマーク追加ボタンやRSSリーダーへの追加ボタンを1つに統合して、どのソーシャルブックマーク/RSSリーダーを使っているユーザーにも対応できるオールインボタンを提供するサービスです。
とまぁ、こんな具合のけっこうなサービスで、前々から気になりつつ、放ってあったのを不意に思い立って導入することにしたのが先週末のこと。
確認したところ手順はたった3ステップである。
- AddClipsボタンをつくる
ボタンの種類や大きさ, 色, 統計情報を使うかどうかなどを選ぶだけ。 - AddClipボタンが発行されるのでコピーする
- blogの所定の箇所(対応してるblogなら指示が出る)か、ホームページの任意の場所にソースコードを『そのまま』貼り付ける
で、発行されたソースコードは次のようなものである。(AddClipsIdだけはダミーの値を入れてある)
<!-- AddClips Code START --> <script type="text/javascript"> <!-- AddClipsUrl = location.href; AddClipsTitle = document.title; AddClipsId = 'hogehoge'; AddClipsBcolor='#78BE44'; AddClipsNcolor='#D1E9C0'; AddClipsTcolor='#666666'; AddClipsType='1'; AddClipsVerticalAlign='middle'; AddClipsDefault='bookmark'; // --> </script><script type="text/javascript" src="http://js.addclips.org/v2/addclips.js" charset="utf-8"></script> <!-- AddClips Code END -->
Bloggerの場合は、このコードをBloggerテンプレートの「<b:includable id='post' var='post'>から</b:includable>」に埋め込み下さい。
(ボタン完成 - AddClipsより)という指示。
よしよし、簡単かんたんと指示通りに貼り付け、ホクホク顔でblogを開く。
ところが──
『AddClipsIdが設定されていないか、他の設定に間違いがあります。』
こんなダイアログが出て、ページは表示できてもAddClipsは動かない。
慌ててソースを見返してみるが、間違ってない。二度、三度と見直しても、やっぱり間違っていない。AddClipsのFAQを見てみると──
エラーの通り、AddClipsIdが設定されている可能性があります。設定されている場合は、貼り付けたコードの改行が<BR>に変換されているなど、Javascriptが認識されていない可能性が高いと思われます。ソースコードをご覧頂き、不要コードが自動的に挿入されていないか、ご確認下さい。AddClipsからはき出したコードをそのまま貼り付ければ、基本的に上記エラーは解消されます。
こんな具合。
ところが何度みなおしても、何度はりつけ直しても直る気配がない。
ぐぐったり、blog向けじゃないWebサイト向けのソースを張ったり、その他、あれこれあれこれ試行錯誤すること1時間ほど。
ようやくここで。
「もしかしてソースの記述が間違ってるんじゃね? 例えばscriptのパラメータがコメントアウトされてちゃダメだとか」
と思いつき。他のWidgetの記述の仕方をみたら、どんぴしゃり。
そんなわけで、正しい記述は次の通り。
<!-- AddClips Code START --> <script type="text/javascript"> AddClipsUrl = location.href; AddClipsTitle = document.title; AddClipsId = 'hogehoge'; AddClipsBcolor='#78BE44'; AddClipsNcolor='#D1E9C0'; AddClipsTcolor='#666666'; AddClipsType='1'; AddClipsVerticalAlign='middle'; AddClipsDefault='bookmark'; </script><script type="text/javascript" src="http://js.addclips.org/v2/addclips.js" charset="utf-8"></script> <!-- AddClips Code END -->
このあたり、多少なりでもJavaScriptをかじっていればすぐに分かったハズで。
ホント、まことにお恥ずかしい限り。
後々、どなたかのお役に立てばということと、自戒のために、ここにblog記事として残すことにした次第である。
やれやれ、どっとはらい。