twitterボタンの設置例


twitterボタン コード取得のページ

twitterボタン へアクセス。

ボタンを選択するとボタンオプションとプレビュー、コードが表示されます。

twitterボタン コード例)

<a href="https://twitter.com/share" class="twitter-share-button" data-lang="ja">ツイート</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

文書外のJavaScript定義ファイルを作成

<a href="https://twitter.com/share" class="twitter-share-button" data-lang="ja">ツイート</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

ボタンコード中の赤の文字列をメモ帳などに移動し、任意のファイル名.js で保存。


本文

twitterボタンコード例)

<script type="text/javascript" src="twitter.js"></script><a href="https://twitter.com/share" class="twitter-share-button">Tweet</a>

data-langなどの独自データ属性は、XHTML1.*で書かれたページではサポートしていないので削除しちゃいましたが、data-langに関しては大丈夫そうです。


このエントリーをはてなブックマークに追加

関連)

はてなブックマークボタンの設置例facebook いいね!ボタンの設置例facebook いいね!ボタンの設置例 2014facebook いいね!ボタンの設置例2Google +1 ボタンの設置例twitterボタンの設置例各ボタンを綺麗に横に並べる各ボタンを綺麗に横に並べる 2トップページへ戻る


RAWで撮ろうLife with a cameraLife with a camera 2


inserted by FC2 system