Twitterボタンを設置
2667 ワード
Twitterボタンを設置
Twitter公式のやつ
https://publish.twitter.com/#
上記URLでパラメータとかを設定するとコードを生成してくれる
TweetButton.html
<a href="https://twitter.com/share?ref_src=twsrc%5Etfw" class="twitter-share-button" data-text="Hello,World!" data-via="Reply" data-hashtags="hashtag" data-lang="ja" data-show-count="false">Tweet</a>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
ので、それをコピペするだけ (scriptタグの記載場所はどこでもOK)
注意事項
- リダレクトができない環境だと使えない
- リダイレクト禁止するChrome拡張を入れていたので、それに気が付かないでめっちゃハマった
- attributeやボタンのスタイルの適用はwidgets.jsが読み込まれた時点で表示されているボタンに対して適用されるため、 widgets.js読み込み完了時点でボタンが表示されていない場合(display : none;とか)、その後ボタンを表示してもスタイルが適用されない
↓こうなる
Tweet
ので、ボタンを表示した後widgets.jsを読み込んでやればいい
TweetButton.js
document.getElementById('button').style.display = "block"; //表示
twttr.widgets.load();
Author And Source
この問題について(Twitterボタンを設置), 我々は、より多くの情報をここで見つけました https://qiita.com/uranesu/items/36f662eeacd0b2be121c著者帰属：元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .