※2025年8月27日現在の仕様に基づいたご案内です。
以下の通り設定したボタンをクリックすると、X(旧Twitter)の投稿画面が表示され、指定した内容でシェアができます。(上記例のリンクで立ち上がるページはこちら)
設定手順
シェアボタンに設定するテキストやボタンを選択します。
ボタン設置方法の例:左パネルの[追加]タブ > [パーツ]タブ > ボタン[全て表示]右側のパネルの[設定]タブを開きます。
右パネルが閉じている場合は開いてください。
[リンク]欄に、以下形式のURLを入力します。
texthttps://twitter.com/intent/tweet?url=[シェアするURL]&text=[ツイート内テキスト]&via=[ユーザ名]&related=[表示ユーザー]&hashtags=[ハッシュタグ]
記入例:
texthttps://twitter.com/intent/tweet?url=https://naomi-osaka.studio.design&text=Congratulations%2C%20Naomi%20Osaka!&hashtags=withStudio
URL内で設定できる項目
text | 投稿テキスト |
url | リンク先 |
hashtags | ハッシュタグ付きワード(複数指定の場合はカンマで区切る) |
via | 投稿者名 |
related | おすすめアカウント |
in-reply-to | メンションするアカウント |
Studioでは、現在表示しているページのURLを $url という変数で取得できます。この変数を利用すると、閲覧者が現在のページをSNS投稿画面に呼び出し、シェアできるようになります。
3. サイトを更新します。 更新するまで、変更内容は反映されません。
4. プレビューまたは公開ページでリンクをクリックし、シェアボタンが機能することを確認します。
Tips:外部サービスの「Twitter Publish」では埋め込みコードを生成できます。生成したコードは、Embedボックスに貼り付けることで投稿の埋め込みやシェアボタンの設置が可能です。
ツイッター ソーシャルボタン ソーシャル ソーシャルメディアシェア


