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