ページにソーシャルシェアセクションを作成する

GemPages v6をお使いの場合は、 この記事.

ソーシャルシェアリングセクションとは何ですか?

ソーシャル共有セクションは、クリック可能なソーシャル メディア アイコンを表示するページ上のブロックで、通常は製品ページ、ブログ記事、プロモーション キャンペーンなどの主要なコンテンツの近くに配置されます。

訪問者がこれらのアイコンをクリックすると、次のいずれかを実行できます。

• コンテンツを直接共有する ソーシャル メディア アカウントに投稿する (例: Facebook で製品リンクを共有する)。
• ソーシャルプロフィールにアクセス あなたのブランドをフォローしたり、関わり合ったりすることができます。

ソーシャル共有セクションを追加すると、次のことが可能になります。

• 複数のプラットフォームにわたってブランドの露出を高めます。
• オーガニックシェアからストアへの新しいトラフィックを促進します。
• 顧客に製品を友人やコミュニティに推奨するよう促します。
• アクティブで接続されたソーシャル チャネルを表示して信頼を構築します。

GemPagesでソーシャルシェアセクションをデザインする手順

GemPages v7 でソーシャル共有セクションを設計するには、行要素と画像要素を使用することをお勧めします。

次の手順に従います。

ステップ1: GemPagesエディターにアクセスする

• Shopify管理画面から、 GemPages ビルダー アプリ> ページ GemPages で構築されたすべてのページを見つけます。
• 対象ページをクリックしてエディターを開きます。

ステップ2: 複数列の行要素を追加する

• 左側のサイドバーから、行要素をページ上の目的の位置にドラッグ アンド ドロップします。

例えば、FacebookとX（旧Twitter）にリンクしたソーシャルシェアセクションをデザインしたい場合、2列レイアウトの行を使用します。

• このセクションでさらに多くのソーシャルプラットフォームにリンクしたい場合は、 レイアウト のセクションから無料でダウンロードできます。

行要素には最大 6 列を含めることができることに注意してください。

ステップ3: 各列に画像要素を追加して設定する

• 各列に画像要素をドラッグ アンド ドロップします。

• 次に、画像をクリックして設定パネルを開き、 ソース のセクションから無料でダウンロードできます。

• 現在の画像にマウスを移動してクリック 画像をアップロード ソーシャル プラットフォームのロゴをアップロードします。

• 下にスクロールして リンク セクションをオンにして設定を展開します。次に、 クリック後 = ページを開く.

• そこから、次のリンクをコピーして、対象のソーシャル プラットフォームでページを共有できます。

• URL をページの URL に置き換えます。

たとえば、X で GemPages のホームページを共有したいとします。リンクは次のようになります。 https://x.com/intent/tweet?url=https://gempages.net/

• 編集中のページを共有したい場合は、そのURLを 公開設定 パネル：

URLをコピーするか、下のハンドルを変更することもできます ページのURLとハンドル 共有する前に必要に応じて。

また、プレビュー画像を追加することもできます ソーシャルシェア画像プレビュー ソーシャルプラットフォーム上での可視性を高めるためのセクション:

完了したら、をクリックします。 設定を適用.

ステップ4: サイズを調整し、間隔を設定する

• 画像をクリックして下にスクロールすると サイズ 左側のサイドバーのセクション。

ここからお好みの フレーム そして調整します 幅と高さ ロゴ画像の。

例えば、 幅 = 50 ピクセル.

• 親要素を右クリックして選択すると、行の設定パネルに戻ります。

• 以下のスクリーンショットに示すように、ジョブタイプを 列幅 = コンテンツに合わせて調整、およびを調整します ギャップ = 0 下 列間隔 のセクションから無料でダウンロードできます。

ステップ5: 保存して公開する

完了したら変更を保存して パブリッシュ ページを再公開します。その後、ライブストアで結果を確認できます。

結果：