コンテンツにスキップ

共有/印刷 UI

デスクトップとモバイルのレイアウトに合う共有ボタンと印刷ボタンを追加します。

このブロックは、顧客がコンテンツを共有したり、視覚的なごちゃつきをあまり増やさずに印刷したりできる、軽量なページアクションを追加したい場合に使用します。メインコンテンツよりも優先度は低いものの、ユーティリティアクションを見つけやすくしたい場面で最適です。共有/印刷 UIに関するCompany XYZドキュメント を参照してください。

主な設定では、どのアクションを表示するかと、レイアウト内でアイコンをどのように見せるかを制御します。ページ上のコンテンツにとって何が便利かに応じて、共有ボタン、印刷ボタン、またはその両方を表示できます。

アイコンの色を使って、これらのアクションを周囲のデザインになじませたり、少し目立たせたりできます。ブロックが暗い背景、鮮やかな背景、または画像中心の背景にある場合は、アイコンが引き続きはっきり見えることを確認してください。

顧客が使う可能性の高いアクションだけを有効にしてください。焦点の絞られたレイアウトでは、余分なユーティリティボタンがメインの目的の妨げになることがあります。

このグループを使用して、デスクトップとモバイルで水平配置を個別に制御します。これにより、ブロックがレイアウトに後から追加されたように見えるのではなく、近くのコンテンツとつながっているように感じられます。

画面サイズによって、より適した配置は異なります。デスクトップではバランスよく見える配置でも、モバイルでは不自然に見えることがあるため、公開前に両方の表示を確認する価値があります。より広い概要については、セクションとブロックに関するShopifyドキュメント を参照してください。

表示設定では、このブロックをデバイスサイズごとにいつ表示するかを制御します。デスクトップでは1つの位置に、モバイルでは別の位置にユーティリティアクションを配置したい場合に便利です。表示設定に関するCompany XYZドキュメント を参照してください。

あるデバイスサイズでブロックを非表示にする場合は、必要なときに顧客が同じアクションを別の場所で見つけられるようにしてください。

  1. ユーティリティアクションは必要最小限にする。 ページコンテンツに合う共有オプションと印刷オプションだけを表示してください。
  2. アイコンのコントラストを確認する。 アイコンの色が周囲の背景に対して見やすいままになっていることを確認してください。
  3. 近くのコンテンツと揃える。 アクションが意図的に見えるように、ブロックの配置をサポートするコンテンツに合わせてください。
  4. モバイルは個別に確認する。 デスクトップの設定に頼らず、小さい画面で配置と表示を確認してください。
  5. 重複するアクションを避ける。 共有や印刷のコントロールがページの他の場所にも表示されている場合は、表示設定を使って重複を減らしてください。