パーソナライズの回答結果をSNSでシェアする

パーソナライズの回答結果をSNSでシェアする

結果ページ内にSNSシェアボタンを設置することで、回答結果をSNSでシェアすることができます。
SNSシェアボタンのコード内にシェア用URLの変数を埋め込み、結果ページに記述してください。

▼シェア用URLの変数　※詳細はThymeleaf変数リファレンスをご参照ください。

${share_url}

例：Twitterのシェアボタンを設置する場合のコード

<a href="https://twitter.com/share?ref_src=twsrc%5Etfw" class="twitter-share-button" th:data-url="${share_url}" data-show-count="false">Tweet</a>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

また、シェア表示判定の変数を用いることで、シェアした画面の「購入ページへ」などのボタンを非表示にしたり、JavaScriptのメソッドを動作させないようにすることができます。

▼シェア表示判定の変数　※詳細はThymeleaf変数リファレンスをご参照ください。

${is_share}

例：シェアした画面で「購入ページへ」のボタンを非表示にする場合のコード

<div th:if="${!is_share}" class="btn_area"><a href="javascript:PSL.doNextPage();" class="next_btn">購入ページへ</a></div>

シェア表示判定の変数を用いて、シェアした画面で「購入ページへ」と「結果をシェアする」のボタンを表示させないように記述した場合、結果ページの画面とシェアした画面はそれぞれ以下のように表示されます。

▼結果ページの画面

▼シェア用の画面