HTML

【Web制作】Twitterのツイートボタンを表示する方法

「ウェブサイトにツイートボタンを表示する方法」をご紹介します。

 

下のようなリンクボタンを押すと、Twitterアプリが起動するボタンです。

ウェブサイトにTwitterのツイートボタンを表示する方法

ウェブサイトにツイートボタンを表示する方法を手順を追って説明します。

①headタグにスクリプトを記述する

HTMLのheadタグ内に以下のスクリプトを記述します。

そのままコピペで利用できます。

<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

 

 

②bodyタグにHTMLを記述する

bodyタグにHTML要素を記述します。

<div class="twitter">
   <a href="//twitter.com/share" class="twitter-share-button" data-text="駆け出しエンジニアのタイピングゲーム" data-url="https://taiyosite.com/typing_game" data-lang="ja" data-hashtags="駆け出しエンジニアのタイピングゲーム">ツイート</a>
</div>

 

 

③カスタマイズ

自由にカスタマイズしてください。

data-textツイートしたい文章
data-urlシェアしたいURL
data-lang日本語のサイトなら”ja”でOKです
data-hashtagsハッシュタグ

 

 

記事を読んでくださりありがとうございました。

参考になったという方は、広告をクリックしていただけると励みになります。

よろしくお願い致します。

JavaScript
関連記事