ヘッダーとフッターのプリセット

プリセットとは、一度保存しておけば、さまざまなレイアウトで再利用できるヘッダーやフッターのデザインのことです。プリセットを変更すると、それを使用しているすべてのレイアウトが更新されます。そのため、新しいロゴの追加や住所の変更といった作業も、20回も編集する必要はなく、1回の編集で済みます。

アプリのナビゲーションにある**「ヘッダーとフッター」**の下に表示されています。

プリセットの作成

このページには、「ヘッダー」と「**フッター」**の2つのセクションがあり、それぞれに「ヘッダーを追加」および「フッターを追加」ボタンがあります。プリセットに名前を付け、デザインを指定して、保存してください。

デザイン作業中、「プレビュー」カードには、メール本文の代わりに表示される灰色の枠の上または下に、メールで実際に表示されるのと同じヘッダーやフッターが表示されます。変更を加えるたびにその変更が即座に反映されるため、保存する前に結果を確認することができます。

共有プリセットの一覧が表示された「ヘッダーとフッター」ページ
共通のヘッダーとフッター:いずれか一方を変更すると、それを使用しているすべてのレイアウトが自動的に更新されます。

ヘッダーのオプション

まずはレイアウトをお選びください:

レイアウト そこから何がわかるか
ロゴのみ ロゴのみ
ロゴ+テキスト ロゴの下にキャッチコピーや説明文が記載されているもの
ロゴ+テキスト+リンク ナビゲーションリンク付きのヘッダー全体

次に、各パーツの設定を行います:

  • ロゴ - 表示・非表示の切り替え、画像の選択、代替テキストの設定、サイズ(小:80px、中:150px、大:220px、特大:300px)および配置の選択が可能です。
  • テキスト - キャッチコピーや簡単な説明文です。{{ secrets.xxx }} および {{ variables.xxx }} をサポートしています。
  • ナビゲーションリンク ― それぞれにラベルとURLが設定されています。
  • 配置方法 ― 要素を縦に積み重ねるか、横に並べて配置してください。
  • テキストとリンクの配置 - 積み重ね型ヘッダーのみ対象です。デフォルトでは、テキストとリンクはロゴに合わせて配置されます(ロゴと同じ)。 「左」「中央」「右」のいずれかを選択して、それぞれを個別に配置することができます。例えば、ロゴを中央に配置し、テキストとリンクを左揃えにするといった具合です。並列配置のヘッダーでは、独自の配置が維持されるため、このオプションは非表示になります。
ヘッダーのレイアウト、コンポーネント、スタイル、プレビューを備えたヘッダープリセットエディタです。「使用先」カードには4つのレイアウトが一覧表示されています
ヘッダーのプリセット:レイアウト、コンポーネント、スタイル。下部にプレビューが表示されます。これを使用すると、レイアウトがそれに応じて変更される番組があります。

フッターの設定

レイアウト そこから何がわかるか
ミニマル 著作権および配信停止に関する事項のみ
全文 ソーシャルリンク、カスタムテキスト、著作権、配信停止
  • ソーシャルリンク - Facebook、Instagram、X(Twitter)、LinkedIn、YouTube、TikTok、Pinterest、Snapchat、Tumblr、Twitch、Vimeo、メール、およびウェブサイト。
  • カスタムテキスト - 会社の詳細、法的記載事項、記載が必要なあらゆる内容。変数やシークレットをサポートしています。
  • 法的情報 - 著作権表示を表示または非表示にします。
  • 方向と配置 - 垂直または水平、左/中央/右。

その他の言語のテキスト

プリセットは1つのデザインですが、その文言は言語ごとに異なる場合があります。保存済みのプリセットを開き、「言語」カードまでスクロールしてください。「言語を追加」の下から言語を選択し、**「追加」**をクリックしてください。新しい言語は、そのプリセット固有のテキストを基に開始されるため、表示を変更したい部分のみを上書きすればよいのです:

  • ロゴの代替テキスト(ロゴが表示される見出し)
  • 任意のテキスト
  • 配信停止の手順(フッター)
  • 「...」のラベル - ナビゲーションリンクまたはソーシャルリンクごとに1つのフィールド

変更されるのは言葉だけです。レイアウト、色、ロゴ、リンクのURL、およびリンクの順序は、どの言語でも同じです。空欄のままにしておくと元のテキストが保持されるため、キャッチコピーを翻訳しつつ、ブランド名はそのままにしておくことができます。**「削除」を選択すると、**その言語がプリセットから再び削除されます。

プリセットに言語が設定されると、プレビューカードに「プレビュー言語の選択」が表示されます。「オリジナル」を選択するとプリセット固有のテキストが表示され、各言語を選択するとその言語のテキストが表示されます。

メールにはどのようなテキストが含まれるのでしょうか

メールの言語によって決まります。これは、Shopify Flowステップが送信する言語(例:{{order.customerLocale}})か、ステップが言語を送信しない場合のレイアウトの主要言語({{ language }}と同じ値)となります。プリセットは、以下の順序でテキストを選択します:

  1. 具体的な表現としては、カナダ・フランス語圏のお客様向けの「fr-ca」となります。
  2. 基本となる言語:de-AT および de-CH では、de のテキストが使用されています。
  3. その言語の地域バリエーションです。
  4. それ以外の場合は、プリセットに設定されているテキストが使用されます。

プリセットには独自のメイン言語がないため、追加されていないすべての言語については、そのプリセットに設定されたテキストがフォールバックとして使用されます。言語が欠落していることを理由に、表示がブロックされたり空白になったりすることは一切ありません。

レイアウトエディタでも同様の表示がされます。レイアウトの翻訳を開くと、そのレイアウトで使用されているプリセットが、その言語のテキストとともに表示されるため、キャンバス上の表示はお客様に表示される内容と一致します。レイアウトの言語機能の詳細については、お客様の言語でメールを送信してください をご覧ください。

「言語を追加」という機能があるプリセットページの最後にある「言語」カード
プリセットの言語:言語を1つ追加し、そのテキストを翻訳します。その言語で送信されるメールでは、その翻訳が使用されます。レイアウト、色、ロゴは変更されません。

レイアウトでのプリセットの使用

ビジュアルビルダーでレイアウトを開き、キャンバス上のヘッダーまたはフッター領域をクリックしてください。「保存済みプリセット」のドロップダウンには、ご自身のプリセットに加え、**「カスタム(このレイアウトのみ)」**が表示されます。

他のメールのデザインと統一感を保ちたい場合は、「プリセット」を選択してください。この1通のメールに、例えば1回限りのキャンペーンヘッダーなど、他とは明らかに異なる要素が必要な場合は、**「カスタム」**を選択してください。

プリセットの削除

プリセットは、レイアウトで使用されている場合でも、いつでも削除できます。使用中のレイアウトがある場合は、削除後にアプリがそのレイアウト名を通知します:

プリセットが削除されました。3つのレイアウトでこのプリセットが使用されていましたが、今後はこれなしで表示されます:注文確認、VIPウェルカム、配送状況の更新

それらのレイアウトは引き続き機能します。別のプリセットを選択するか、「**カスタム」**に切り替えるまでは、ヘッダーやフッターが表示されない状態で表示されるだけです。

関連情報