こんにちは、makeshopのあらいです。
いつもmakeshopをご利用いただきありがとうございます。

前回、商品詳細ページにSNSボタンが表示されない時の対処方法をご紹介しましたが、
今回はクリエイターモードで「SNSボタン」を表示するソース例をご紹介します！
クリエイターモードで使えるタグはタグリファレンスをご確認ください。

クリエイターモードで「SNSボタン」を表示しよう

設定方法

SNSの表示設定は、商品詳細ページにSNSボタンが表示されない時の対処方法をご確認ください。

SNSボタンを表示するタグ

SNSボタンを表示する時は、下記のタグを使います。

$item.sns.twitter<!--X（旧Twitter）ボタン-->

$item.sns.facebook<!--Facebookボタン-->

$item.sns.line<!--LINEボタン-->

SNSボタンのソース例

商品詳細ページ

表示は、サンプルショップ【Complete】の商品詳細ページで「X（旧Twitter）ボタン」と「Facebookボタン」を確認することができます。

ショップデザイン / テンプレート選択・編集 / クリエイターモード / 商品詳細「HTML」欄

SNSボタンを表示させたい位置に追記してください。

▼HTML

<!--SNSボタン-->
<ul class="item-share">
	<{if {$item.sns.line}>
	<li><{$item.sns.line}></li>
	<{/if}>
	<{if $item.sns.twitter}>
	<li><{$item.sns.twitter}></li>
	<{/if}>
	<{if $item.sns.facebook}>
	<li><{$item.sns.facebook}></li>
	<{/if}>
</ul>

↓このように表示されます。

クリエイターモードでSNSボタンを表示する際にどうぞご参考ください。
それではまた！