Last active
August 29, 2015 14:25
-
-
Save peace098beat/779c80bfc03441b9fa26 to your computer and use it in GitHub Desktop.
SNSボタンを設置する!!! v3
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- | |
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