Skip to content

Instantly share code, notes, and snippets.

@peace098beat
Last active August 29, 2015 14:25
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save peace098beat/779c80bfc03441b9fa26 to your computer and use it in GitHub Desktop.
Save peace098beat/779c80bfc03441b9fa26 to your computer and use it in GitHub Desktop.
SNSボタンを設置する!!! v3
<!--
SNS-Link-Code.html
Description:
SNSボタンを設置するためのコード
シェアするURLはhttp://cgi.geocities.jp/jog073/
Button set:
1. Twitterボタン
2. Facebookボタン
3. LINEボタン
Sampleページ:
http://bl.ocks.org/peace098beat/58731ab7c608aabdbfbc
(このコードが実行されるページ)
Tomoyuki Nohara by 2015/07/15
-->
<!DOCTYPE html>
<html>
<head></head>
<body>
<!--
1. Twitterボタン
https://about.twitter.com/ja/resources/buttons#tweet
-->
<p> Twitter Button </p>
<!-- シェアボタンに変換される -->
<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://cgi.geocities.jp/jog073" data-text="感動のフォトムービーを丁寧に製作。忘れられない大切な思い出を、素敵な映像に仕上げます。" data-hashtags="WEEDINGMOIVE" data-dnt="true">Tweet</a>
<!--
2. Facebookボタン
https://developers.facebook.com/docs/plugins/share-button
-->
<p>facebook</p>
<!-- シェアボタンに変換される -->
<div class="fb-share-button" data-href="http://cgi.geocities.jp/jog073/" data-layout="button_count"></div>
</div>
<!--
3. LINEでおくる
https://media.line.me/howto/ja/
-->
<p>LINE</p>
<!-- シェアボタンに変換される(おまじない。長いけどしょうがない) -->
<span>
<script type="text/javascript" src="//media.line.me/js/line-button.js?v=20140411" ></script>
<script type="text/javascript">new media_line_me.LineButton({"pc":true,"lang":"ja","type":"a"});</script>
</span>
<!--
4. お気に入り登録ボタン
http://allabout.co.jp/gm/gc/23783/
-->
<a href="#" onclick="window.external.AddFavorite('http://cgi.geocities.jp/jog073/','WeddingMovie'); return false;">お気に入りに登録</a>
<input type="button" value="お気に入りに登録" onclick="window.external.AddFavorite('http://cgi.geocities.jp/jog073/','WeddingMovie');">
<!-- ここまで -->
</body>
<!--
************************************************
*
* 各ボタン用のスクリプトを配置
* (注意!)スクリプトは<HEAD>か<BODY>の後に配置する。
*
************************************************
-->
<!--
Twitterシェアボタンのスクリプト(おまじない)
-->
<script>
! function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0],
p = /^http:/.test(d.location) ? 'http' : 'https';
if (!d.getElementById(id)) {
js = d.createElement(s);
js.id = id;
js.src = p + '://platform.twitter.com/widgets.js';
fjs.parentNode.insertBefore(js, fjs);
}
}(document, 'script', 'twitter-wjs');
</script>
<!--
Facebookシェアボタンのスクリプト(おまじない)
-->
<div id="fb-root"></div>
<script>
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s);
js.id = id;
js.src = "//connect.facebook.net/ja_JP/sdk.js#xfbml=1&version=v2.4&appId=261782643960973";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<!--
LINEシェアボタンのスクリプトは無い!
-->
<!-- スクリプトここまで -->
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment