ログインページ
学べること
レガシー顧客アカウント用のログインページテンプレートを有効化およびカスタマイズする方法
テーマ設定を使用してログインフォームの外観を変更する方法
テキスト、ボタンのスタイル、レイアウト、リンクを調整する方法
🧩 概要
このログインページはShopifyの一部であり、 従来の顧客アカウントシステム テーマエディタを使って完全にカスタマイズできます。カスタムレイアウトブロック、サイド画像、装飾された入力フィールドに対応しており、顧客のログイン体験の見た目を完全にコントロールできます。
⚠️ このログインページは以下の場合にのみ適用されます レガシー顧客アカウント で有効になっている 設定 > 顧客アカウント.
🎨 ページ構成
ログインページは次のセクションで構成されています：
ロゴ & 時計 （オプション）
ログインフォーム （コア機能）
ミュージックプレーヤー （オプション）
フッター （オプション）
✏️ ログインフォームのカスタマイズ
に移動します テーマエディタ → テンプレート → customer/login.liquid をクリックします ログインフォーム ブロックからカスタマイズを開始します。
🔳 ログイン サイド画像
画像を選択 – ブランド画像をアップロードまたは選択
サイド画像の位置 – 左または右を選択
サイド画像を曲線化 – 角を丸くする
サイド画像を削除 – 完全に非表示にするトグル
🧾 ログイン ヘッダー内容
ヘッダーテキスト – ログインブロックのタイトル（例：「ログイン」や「おかえりなさい」）
サブヘッダーテキスト – 短い説明やカスタムメッセージ
次の項目もカスタマイズできます ヘッダーおよびサブヘッダーの文字色.
🔐 入力フィールド
各フォームフィールドには独自のデザイン設定があります：
メールフィールド
ラベルの色
境界線の色
テキスト色
パスワードフィールド
ラベルの色
境界線の色
テキスト色
🔘 ログインボタン
カスタマイズ：
ボタンテキスト （例：「入る」や「サインイン」）
テキスト色
背景色
アクセシビリティを保つためにコントラストを強めにしてください。
❗ エラーのスタイリング
を設定 ログインエラー情報のテキスト色 ブランドのアラートスタイル（通常は赤）に合わせます。
🔗 追加リンク
以下のテキストと色を更新できます：
登録リンク
パスワードを忘れた場合のリンク
ストアに戻るリンク
これらはログインフォームの下または周辺に表示されます。
🎨 その他
フィールドとボタンの丸み – 入力欄とログインボタンに丸い角を付けるにはオンにします。
✅ 完了です！
カスタムログインページは以下のURLで完全にスタイル設定され、公開されています：
yourstore.com/account/login
💡 ヒント：「登録ページ」と「アカウントページ」のドキュメントと組み合わせて、顧客のジャーニーを完全に構築しましょう。
ヘルプが必要ですか？
💬 Discordでコミュニティに参加： https://discord.gg/hcc2GvgZc6
📧 メールでお問い合わせ： [email protected]
💻 ライブチャット： 月曜〜金曜、午前10時〜午後6時（EST）に当社ウェブサイトで直接利用可能
最終更新