AREA

創作ログ

サイトにTwitterのシェアボタンを設置する

よくあるTwitterシェアボタンを、自分のサイトに設置する方法まとめ。

HTML埋め込むコードを作成

以下のサイトにアクセスします。
Twitter Publish

f:id:hkarea:20180405203021p:plain
f:id:hkarea:20180405203200p:plain
右のTwitter ButtonsからShare Buttonを選びます。

ツイート内容をカスタマイズ

f:id:hkarea:20180405203339p:plain

set customize optionsから
・シェアされるテキスト(内容)
・シェアされるURL
・シェアされた際にメンションしたいTwitterアカウントのID
・ツイートに含めたいハッシュタグ
・おすすめアカウント※
を入力し、updateを押して出た埋め込み要素をコピーします。
それを設置したいサイト内にペーストして終わり。

このカスタマイズ内容だと以下のようにシェアされます。
f:id:hkarea:20180405204100p:plain
f:id:hkarea:20180405204159p:plain

ざっくりまとめたら死ぬほど読みづらい記事になってしまった…
とりあえず最初のリンクにアクセスすればなんとなくわかるかと思います。

疑問※

recommend accountはツイート後にフォローを促すアカウントを表示するポップアップのカスタマイズだと思うのですが、
何故か一瞬でポップアップウィンドウが閉じているようです。
解決次第、記事を更新したいです。