【リツイート(ＲＴ)ボタン】アメブロ ブログ設置方法
【リツイート(ＲＴ)ボタン】アメブロ ブログ設置方法
「リツイート（ＲＴ）ボタンをアメブロに設置する」
公式のTwitterリツイート(RT)ボタンをアメブロに、
設置する方法です。
リツイートボタンのソースは長いのですが、外部
ファイルにすれば,アメブロのフリープラグインに
リツイートボタンも設置しやすくなりますね。
注）フリープラグイン編集は自己責任で。
不具合発生のクレームは,お受けしません。
アメブロにTwitterリツイートボタン設置する手順
「公式ＲＴボタンスクリプト置き場の準備」
リツイートボタンスクリプトを設置するサーバー、
又は,アメブロで別のブログアカウントを準備。
サーバーにアップロードする場合、無料・有料
どこでも可能です。無料ならＦＣ2ホームページ
がおすすめ。
レンタルサーバーがあるならそちらを推奨します。
「公式ＲＴボタンソースをメモ帳等にコピー」
1このページ にRT設定の流れが掲載されてます。
ソースをコピーして メモ帳にはりつけます。
2
↑記事ソースの赤文字部分をメモ帳内で削除
3
本家Ｔwitter活用術 下部のコードを先ほど削除
した部分に貼り付けます。
「ＲＴボタンのスクリプトをサーバにアップ」
1
適当にファイル名を決めメモ帳を保存します。
ファイル名の後の拡張子はjsで保存。
2
アメブロ内におく場合は、別ブログを用意して、
テンプレをカスタマイズ可能なものに変更後、
ＣＳＳを全て消しスクリプトをペーストします
例：ＲＴボタンアップロード・貼り付け用スクリプト
$(document).ready(function(){
var tid = 'shiyoyoublog';
var page_url = location.href;
if (page_url.match(/^.+\/entrylist[\-0-9]*\.html$/g ))
{
var entries = $(".newentrytitle a");
var classname = ".updatetime";
var flg = 0;
} else {
var entries = $(".foot a:contains('記事URL')");
var classname = "div.entry .theme";
var flg = 1;
}
for (i = 0; i < entries.length; i++) {
var url = entries[i];
if (flg == 0) {
title = entries.eq(i).text();
} else {
title = $("div.entry h3.title").eq(i).text();
} var twitter_btn = 'ツイッター活用術のコード';
$(classname).eq(i).append(' <span>' + twitter_btn +
'</span> ');
}
})
「ＣＳＳのＵＲＬを調べ抽出、メモ帳に貼り付け」
1
サーバーにアップロードした場合は、そのファイルの
ＵＲＬをメモ帳に貼り付け
2
アメブロの場合はスクリプトブログをブラウザで表示
した後、Firefoxメニュー「表示⇒ページのソース」
ＣＳＳがいくつかありますが、通常は上から４番目の
ＵＲＬをコピーして、メモ帳に張りつけます。
抽出したＵＲＬ例
http://usrcss.ameblo.jp/skin/templates/ce/77/111.css"
「修正後、フリープラグインにペースト、保存」
↓の様にメモ帳内で修正して、フリープラグインに貼り付け
修正例
<script type="text/javascript"src="抽出したＵＲＬ">
</script>たったこれだけになりました。
「アメブロ文字制限外部スクリプト化まとめ」
メリット
1 フリープラグイン字数制限がだいぶ楽になる
2 ＳＥＯ対策的にも外部スクリプトは有効
デメリット
1 外部化した物の表示が一瞬遅れる場合がある
2 無料サーバー、別アメブロを、スクリプト用にする
注意点
外部スクリプト前には、フリープラグインは事前に
全てのブログパーツ等のスクリプトに応用できま
すが、確かGoogleアナライズは無理だと思います。最後にくれぐれも自己責任でお願いします。
ご不明な点は↓コメください では
▼「竜馬伝ですか？原田泰造の演技も結構いいね」▼
という方応援よろしくお願いします！
▼「今日買ったツイッター書籍 マーケティング戦略▼
に加え、すぐ使えるＴｗｉｔｔｅｒアプリやツール情報も豊富」
- 携帯&iPhone ツイッターを使いこなす! /武井 一巳
- ￥760
- Amazon.co.jp