Social button（基本的な設定）

mixi, twitter, facebook

by FiNGAHOLiC

HTML

<!--
1. http://developer.mixi.co.jp/connect/mixi_plugin/favorite_button/から埋め込みコードを取得する。
2. data-service-keyは必須なので取http://developer.mixi.co.jp/connect/mixi_plugin/mixi_check/mixicheck/#add_serviceから得する。
-->
<div 
    data-plugins-type="mixi-favorite"
    data-service-key="8c265894cd6ca70497074f6c5b8454067278a157"
    data-size="medium"
    data-href=""
    data-show-faces="false"
    data-show-count="true"
    data-show-comment="false"
    data-width=""></div>
<script type="text/javascript">
    (function(d){
        var s = d.createElement('script');
        s.type = 'text/javascript';
        s.async = true;
        s.src = '//static.mixi.jp/js/plugins.js#lang=ja';
        d.getElementsByTagName('head')[0].appendChild(s);
    })(document);
</script>

<!--
1. https://twitter.com/about/resources/buttonsから埋め込みコードを取得する。
※ ちなみに!function(){}()は(function(){}())と同義。
http://stackoverflow.com/questions/3755606/what-does-the-exclamation-mark-do-before-the-function
-->
<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>

<!--
1. https://developers.facebook.com/docs/reference/plugins/like/（Step1）から埋め込みコードを取得する。
2. https://developers.facebook.com/appsでサイトを登録し、appIDを取得、jsのクエリに挿入する。
3. https://developers.facebook.com/docs/reference/plugins/like/（Step2）OGPの設定をする。
-->
<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/en_US/all.js#xfbml=1&appId=414280305262678";
       ...