今日は雨降りで外に出れなかった・・・・・
ヒマなので「いいね!」ボタンとFacebookコメント欄を付けてみました
最初は難解でしたが理解できれば意外と簡単です
以下は
「初心者でもわかる!! Face bookいいねボタン配置方法 Movable type編」(とかいいつつ忘備録)
です
とりあえず最低限アカウントは必要です
取得したら
Facebook開発者のページ(英語)
でリンク用のhtmlコードを入手します
ページ中ほどにあるボックスに各種情報を入力します
URL to like
ボタンを設置するWebページのURLを入力します
http:// から入力
Sendbutton
送信ボタンも設置する場合チェックを入れます
LayoutStyle
表示形式を選択します
表示形式を変更してコンパクトにしても、
送信ボタンを押した時表示が切れてしまう可能性があるので
とりあえずStandardにします
Width
変更してもあまり意味はないのでとりあえずデフォルトの450で
Font
日本語表示の場合関係ありません
Color Schme
ボタンを黒くするか白くするか選択できます
Verb to Display
ボタン表示を「いいね」と「おすすめ」で選択可能です
全て条件を入力したら、Get codeボタンを押します
埋め込み用のコードが表示されたらとりあえず1.の部分を選択してコピーします
<body>のすぐ後にコピーしてくださいと書いてありますが
自分のような趣味でサーバーを運用している素人はMovable Typeの場合どこで何をしたらいいの??
となる訳です
Movable typeはバラバラになったWebページのパーツを
Perlのプログラム上で組み合わせて表示する仕組になっている為
ここでは<body>以下を表示するパーツを探せばいいわけなのですが
それはここにあります
「デザインタブ」内の「テンプレート」タブ内にある「テンプレートモジュール」以下の「ヘッダー」部分です
クリックすると編集画面になりますから
先ほどコピーしたコードを貼り付けします
貼り付けしたら保存ボタンを押して保存します
再びFacebookのページに戻り2.のプラグインコードを選択しコピーします
Movable typeの画面に戻り先ほどのテンプレートモジュールの画面にある「テンプレートモジュールの作成」を押します
編集画面が出ますので
プラグインコードを貼り付けします
タイトルはFacebookなどわかりやすい名前を適当につけておきます
画面では大量に<br>が入っていますが
ボタン下のスペースを確保するために入れてあります
もっとスマートな方法があると思いますが調べるの面倒なので・・・・・
入力が完了したら保存してください
保存が完了するとテンプレートモジュール内に「Face book」というモジュールが追加されているはずです
とりあえずメインのページにボタンを追加したいのであれば
同じ画面の一番上にある「インデックステンプレート」内の「メインページ」をクリックします
編集画面が出たら、適当な<$mt:Include module="プラグイン名"$>をコピーして表示したい位置に張り付けた後プラグイン名の部分を「Face book」に書き換えます
自分は記事の最後に表示したかったので、「フッター」の手前に追加しましたが、場所を変えればいろいろな部分に追加することができます
Javascriptのコードが<body>以下に記入されていれば
ウィジェットとして登録することもできますが
サイズの関係で切れてしまうためオススメできません
以上の作業が終了したのち再構築すればメインページにボタンが配置されているはずです
コメントする