【Shopify / Liquid】ログイン時は「アカウント」を「ログアウト」に変更する

▼毎日をちょっと楽しく過ごす

ヘッダーやグローバルメニューにある「アカウント」リンクを、ログイン中は「ログアウト」に変更したい時があります。

「アカウント」リンクがある箇所はテーマに依存しますが、大体はヘッダーの中にあると思います。

(さらにSnippetsファイルを読み込んでいるかもしれません)

該当箇所のLiquidファイルを開いて編集していききます。

※最初にテーマのバックアップを取ることをお勧めします。

オンラインストア > テーマ > アクション > テーマファイルをダウンロード

ログインしているかどうかは「customer」オブジェクトに値が入っているかどうかで分岐する

ログインしているかどうかは「customer」オブジェクトをif文で分岐するだけです。

{%- if customer -%}
    ログイン中のhtml
{%- else -%}
    ログインしていない時のhtml
{%- endif -%}

ですので「アカウント」を「ログアウト」にしたいときは、

{%- if customer -%}
   <!-- ログイン中は「ログアウト」-->
   <a href="{{ routes.account_logout_url }}">{{ 'customer.general.logout'| t }}</a>      
{%- else -%}
   <!-- ログインしていない時は「ログイン」-->
   <a href="{{ routes.account_url }}">{{ 'customer.general.login'| t }}</a>    
{%- endif -%}

このように書けでしょう。

「ログアウト」「ログイン」のテキストは多言語でも使えるようにLocaleファイルを使っています。

運用を考えてもSchema locale filesを使うのが良いと思います。

上記例の「’customer.general.logout’」等はテーマに依存します(またご自身で追加もできます)ので、差し替えて利用してください。

この記事はあなたの役に立ちましたか?