[PaaS のみ]{class="badge informative" title="Adobe Commerce on Cloud プロジェクト(Adobeが管理する PaaS インフラストラクチャ)およびオンプレミスプロジェクトにのみ適用されます。"}

ページ設定

ページの主要なセクションは、一部は一連の標準HTML タグによって制御されます。 これらのタグの一部は、ページの各セクションで使用されるフォント、カラー、サイズ、背景色および画像の選択を決定するために使用できます。 その他の設定は、ヘッダーのロゴやフッターの著作権表示などのページ要素を制御します。 これらのセクションは、HTMLページの基盤となる構造に対応しており、多くの基本的なプロパティは管理者で設定できます。

HTMLページセクション ​ {width="700" modal="regular"}

HTMLヘッド

「HTML Head」セクションの設定は、HTML ページの <head> タグに対応し、各ストアビューに対して設定できます。 このセクションには、ページタイトル、説明およびキーワードのメタデータに加えて、favicon およびその他のスクリプトへのリンクが含まれています。 検索エンジンロボットの手順とストアデモ通知の表示についても、この節で設定します。

HTML ヘッドの設定

  1. 管理者 サイドバーで、Content/Design/Configuration ​に移動します。

  2. 設定するストア表示を見つけ、Action ​列の​ Edit ​をクリックします。

  3. その他の設定 の下で、「HTML Head」セクションの 展開セレクター を展開します。

    HTML Head の設定 ​ {width="500" modal="regular"}

  4. 必要に応じて favicon を更新します。

  5. 必要に応じて、ページタイトル設定を更新します。

    • Default Page Title
    • Page Title Prefix
    • Page Title Suffix

    サフィックスやプレフィックスをデフォルトのタイトルと共に使用して、2 つまたは 3 つの部分から成るタイトルを作成できます。 接頭辞または接尾辞とデフォルトのタイトルの間の区切り文字として、縦棒またはコロンを追加できます。

  6. 検索エンジン最適化(SEO)をサポートし、検索結果から顧客をストアに誘導するのに役立つメタデータを追加または変更します。

    • Default Meta Description
    • Default Meta Keywords
  7. 必要に応じて Scripts and Style Sheets を入力します。

    note note
    NOTE
    「Scripts and Style Sheets」フィールドに入力するJavaScriptは、コンテンツセキュリティポリシー(CSP)設定で許可リストに登録する必要があります。登録しない場合、チェックアウトページでは実行されません。 詳しくは、​ コンテンツセキュリティポリシー ​ を参照してください。
  8. 必要に応じて、demo store notice を有効または無効にします。

  9. 完了したら、「Save Configuration」をクリックします。

HTMLの「見出し」フィールドの説明

フィールド
対象範囲
説明
Favicon Icon
ストア表示
ブラウザーのアドレスバーとタブに表示される小さなグラフィック画像をアップロードします。 許可されるファイルタイプ:ICO、PNG、APNG、GIF、JPG(JPEG)。 すべてのブラウザーがこれらの形式をサポートしているわけではありません。
Default Page Title
ストア表示
ブラウザーで表示された際に各ページのタイトルバーに表示されるタイトル。 個々のページに別のタイトルを指定しない限り、デフォルトのタイトルはすべてのページに使用されます。
Page Title Prefix
ストア表示
タイトルの前にプレフィックスを追加して、2 つまたは 3 つの部分から成るタイトルを作成できます。 メインタイトルのテキストと区別するために、プリフィックスの末尾に縦棒またはコロンを区切り文字として使用することができます。
Page Title Suffix
ストア表示
タイトルの後にサフィックスを追加して、2 つまたは 3 つの部分のタイトルを作成できます。 メインタイトルのテキストと区別するために、プリフィックスの末尾に縦棒またはコロンを区切り文字として使用することができます。
Default Meta Description
ストア表示
説明には、検索エンジンの一覧用にサイトの概要が記載されています。160 文字以下にする必要があります。
Default Meta Keywords
ストア表示
ストアを説明する一連のキーワード。各キーワードはコンマで区切ります。
Scripts and Style Sheets
ストア表示
終了 <head> タグの前にHTMLに含める必要があるスクリプトが含まれます。 例えば、<body> タグの前に配置する必要があるサードパーティのJavaScriptは、ここに入力できます。
Display Demo Store Notice
ストア表示
ページ上部でのデモストア通知の表示を制御します。 オプション:Yes / No

ヘッダー

ヘッダー設定は、ストアのロゴのパスを識別し、ロゴの代替テキストとようこそメッセージを指定します。

​ ヘッダー設定 ​ {width="400" modal="regular"}

ヘッダーの設定

  1. 管理者 サイドバーで、Content/Design/Configuration ​に移動します。

  2. 設定するストア表示を見つけ、Action ​列の​ Edit ​をクリックします。

  3. その他の設定 の下で、「Header」セクションの 展開セレクター を展開します。

  4. ストア表示に必要な変更を加えます。

  5. 完了したら、「Save Configuration」をクリックします。

ヘッダーフィールドの説明

フィールド
対象範囲
説明
Logo Image
ストア表示
ヘッダーに表示されるロゴへのパスを識別します。 サポートされているファイルタイプ:PNG、GIF、JPG(JPEG)
Logo Attribute Width
ストア表示
ロゴ画像の幅(ピクセル単位)。
Logo Attribute Height
ストア表示
ロゴ画像の高さ(ピクセル単位)。
Welcome Text
ストア表示
ウェルカムメッセージはページのヘッダーに表示され、ログインした顧客の名前が含まれます。
Logo Image Alt
ストア表示
ロゴに関連付けられている代替テキストです。
Translate Title
ストア表示
Page Title または Meta Title を翻訳する必要があるかどうかを決定します。

フッター

フッター設定セクションでは、ページの下部に表示される ​ 著作権表示 ​ を更新したり、終了 <body> タグの前に配置しなければならないその他のスクリプトを入力したりできます。

​ フッター設定 ​ {width="400" modal="regular"}

フッターの設定

  1. 管理者 サイドバーで、Content/Design/Configuration ​に移動します。

  2. 設定するストア表示を見つけ、Action ​列の​ Edit ​をクリックします。

  3. その他の設定 の下で、「Footer」セクションの 展開セレクター を展開します。

  4. CopyrightMiscellaneous HTML の設定に対して必要な変更を加えます。

    note note
    NOTE
    「Miscellaneous HTML」フィールドに入力するJavaScriptは、コンテンツセキュリティポリシー(CSP)設定で許可リストに登録する必要があります。登録しない場合、チェックアウトページでは実行されません。 詳しくは、​ コンテンツセキュリティポリシー ​ を参照してください。
  5. 完了したら、「Save Configuration」をクリックします。

フッターフィールドの説明

フィールド
対象範囲
説明
Miscellaneous HTML
ストア表示
終了 <body> タグの直前に配置する必要があるその他のスクリプトをサーバーにアップロードできる入力ボックス。
Copyright
ストア表示
各ページの下部に表示される著作権情報。 著作権記号を含めるには、次のようにHTMLのキャラクターエンティティ \&copy; を使用します。\&copy; 2021 Commerce Demo Store. All Rights Reserved. 必ず、サンプルの著作権表示を独自の表示に置き換えてください。
Display Report Bugs Link
ストア表示
バグ報告のリンク (一部のテーマでサポートされています)が有効になっているか無効になっているかを判断します。
recommendation-more-help
2b0136b4-ef75-405f-9734-60d741f198de