こんにちは、せこしょーです。
今日はホームページやブログサイトなどに
各種公式SNSフォローボタンを設置する方法を書いていきます。
YouTube
Step 1: チャンネルIDを取得ください。
自分のYouTubeアカウントにログインして、
チャンネルIDを アカウント詳細設定 にアクセスして取得ください。
Step 2: ボタン設置箇所に以下コードを挿入ください。
※取得したチャンネルIDを”自分のチャンネルID”のところを置き換えてください。
<script src="https://apis.google.com/js/platform.js"></script>
<div class="g-ytsubscribe" data-channelid="自分のYouTubeのチャンネルID" data-layout="default" data-count="default"></div>参考ページ： YouTube公式
ボタン設置箇所に以下コードを挿入ください。
※自分のTwitterアカウントのURLを置き換えてください。
※自分のTwitterユーザー名を置き換えてください。
例えば、
ユーザー名：sek0shoの場合、
アカウントURL→https://twitter.com/sek0sho
<a href="自分のTwitterアカウントのURL?ref_src=twsrc%5Etfw" class="twitter-follow-button" data-show-count="false">Follow @自分のTwitterユーザー名</a>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>参考ページ： Twitter公式
ボタン設置箇所に以下コードを挿入ください。
※自分のInstagramアカウントのURLを置き換えてください。
例えば、
ユーザー名：hanyamizucchiの場合、
アカウントURL→ https://www.instagram.com/hanyamizucchi/
<a class="ig-b- ig-b-v-24" href="自分のInstagramアカウントのURL?ref=badge"><img src="//badges.instagram.com/static/images/ig-badge-view-24.png" alt="Instagram" /></a>参考ページ： https://ryke.jp/instagram-badge/
※ 2017年11月16日 にfacebookのフォローボタンは廃止されたようです。
https://developers.facebook.com/blog/post/2017/11/07/changes-developer-offerings/
なので、ここではいいねボタンとシェアボタンの設置方法を書いていきます。
Step 1: bodyタグの最初に以下コードを挿入
<div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/ja_JP/sdk.js#xfbml=1&version=v6.0"></script>Step 2: ボタン設置箇所に以下コードを挿入
自分のfacebookアカウントのURLを置き換えてください。
例えば
ユーザー名：hanyamizu.stone
facebookアカウントのURL→ https://www.facebook.com/hanyamizu.stone
<div class="fb-like" data-href="自分のfacebookアカウントのURL" data-width="" data-layout="standard" data-action="like" data-size="large" data-share="false"></div>参考ページ：facebook公式
Step1について、
サイトがWordPressのバージョンが5.2以上を利用であれば、
以下コードをfunctions.phpの最後に追記すればOKです。
/**
* bodyタグ開始に挿入
*/
add_action( 'wp_body_open', function() {
?>
<div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/ja_JP/sdk.js#xfbml=1&version=v6.0"></script>
<?php
});
以上です、ありがとうございました。
コメント