Shopify
ログイン画面
メタフェイズではShopifyを利用したストア構築を行っています。
今回はLiquidでログイン画面を設定する方法を紹介いたします。
templates/customers/login.liquidに下記を記述します。
{% form 'customer_login' %} {%- if form.errors -%} {% if form.errors contains 'form' %}<div>メールアドレス又はパスワードが間違っている可能性があります。</div>{% endif %} {%- endif -%} <div>メールアドレス(必須):<input type="text" name="customer[email]" id="" placeholder="例)sample@sample.com" autocorrect="off" autocapitalize="off" {% if form.email %}value="{{ form.email }}"{% endif %} required></div> {%- if form.password_needed -%} <div>パスワード(必須):<input type="password" value="" name="customer[password]" id="" placeholder="" required></div> {%- endif %} <button type="submit">ログイン</button> {% endform %}
これだけでも機能しますがログインした状態で/account/loginへアクセスするとログインしているのに入力画面が表示されます。それを防ぎたい場合はlayout/theme.liquidのタグ直後に下記を記述します。
{%- if template == "customers/login" and shop.customer_accounts_enabled and customer -%} <meta http-equiv="refresh" content="0;URL=https://{{ request.host }}"> {%- endif -%}
この記述によってログインした状態で/account/loginへアクセスするとトップページへリダイレクトするようになります。
Shopifyを利用したストアの構築・運用のご相談はお問い合わせフォームより受け付けております。
お問い合わせ
Webサイト制作やWebビジネスに関するお悩みがある方はお気軽にご相談ください。