サイトにXへの誘導ボタンを設置

関連ページ 参考URL このサイトはゼロベースから構築していますが、ページの終わり付近にXへ誘導するボタンを付けたいと最近思い始めました。
幸いX公式がGUI上で手軽にコードを生成できる機能を提供してるので、それを使い実装させてもらいました。
まずこちらの X/Publish のサイトに移動します。

中心部にEnter a X URLと書いてありますが、ポストボタンを作る際はXのURLは関係ないです。
下にスクロールするといくつかテンプレートが用意されています。
右端を選択しオーバーレイウィンドウを出した後、その中の左端をクリックします。
すると更に下に生成されたコードが出てくる。

これをコピペしてサイトに張り付ければ完成です。
アカウントフォローボタンも、ポストボタンの作成と手順が似ています。
さきほど出したオーバーレイウィンドウの中の、今度は左から2番目を選択します。

するとフォローさせたいXアカウントのプロフィールを貼れと出てきます。

自分の場合はhttps://x.com/shader_jigokuになるので、これを貼ってPewviewボタンを押すとコードが生成されました。
生成されたコードを自分のサイトにコピペすればOKです。
生成されたコードに対して、data-size="large"のタグを差し込むとボタンが少し大きくなります。
下はポストボタンのコードとその結果比較。
Tweet Tweet