公開ページに簡易ログインフォームを設置する

バージョン1.4.0以降

 

公開ページに簡易ログインフォームを設置します。

 

 

簡易ログインフォームは

ログインフォームを表示する(左)

ログイン後、Myページのナビゲーションを表示する(右)

の二つの機能があります。

 

始めに、

ログインの有無に関係なく、Myページ用のブロックを表示させようとする箇所に

 

<!-- shop:module="common.parts.mypage_login" -->

 

上記のタグで囲います。

 

続いて

Myページ用に囲んだ箇所にログイン前のフォームを表示するように記述します。

 

<!-- shop:module="common.parts.mypage_login" -->

<-- cms:id="not_loggedin" -->
<div id="login" class="sideBox">
  <div class="indent">
  <h3>ログイン</h3>
  <form cms:id="login_form">
    <p>
      メールアドレス:<br />
      <input type="text" cms:id="mail" />
    </p>
    <p>
      パスワード:<br />
      <input type="password" cms:id="password" />
    </p>
    <p>
      <input type="checkbox" cms:id="auto_login" />
      <label for="login_memory">自動的にログイン</label>
    </p>
    <p><input type="submit" name="login" value="ログイン" /></p>
  </form cms:id="login_form">
</div>
</div><!--END .sideBox -->
<!-- /cms:id="not_loggedin" -->

<!-- /shop:module="common.parts.mypage_login" -->

 

ここで使用するcms:idについてはこちらをご覧ください。

 


 

続いて、

ログイン後に表示する箇所を追加します。

 

<!-- shop:module="common.parts.mypage_login" -->

<!-- cms:id="not_loggedin" -->
<div id="login" class="sideBox">
  <div class="indent">
    <h3>ログイン</h3>
    <form cms:id="login_form">
      <p>
        メールアドレス:<br />
        <input type="text" cms:id="mail" />
      </p>
      <p>
        パスワード:<br />
        <input type="password" cms:id="password" />
      </p>
      <p>
        <input type="checkbox" cms:id="auto_login" />
        <label for="login_memory">自動的にログイン</label>
      </p>
      <p><input type="submit" name="login" value="ログイン" /></p>
    </form cms:id="login_form">
  </div>
</div><!--END .sideBox -->
<!-- /cms:id="not_loggedin" -->

<!-- cms:id="is_loggedin" -->
<div id="mypage" class="sideBox">
  <div class="indent">
    <h3>マイページ</h3>
    <ul class="clearfix">
      <li><a href="/shop/user/top">マイページトップ</a></li>
      <li><a href="/shop/user/order">購入履歴一覧</a></li>
      <li><a href="/shop/user/edit">登録情報変更</a></li>
      <li><a href="/shop/user/logout">ログアウト</a></li>
    </ul>
  </div>
</div><!--END .sideBox -->
<!-- /cms:id="is_loggedin" -->

<!-- /shop:module="common.parts.mypage_login" -->

※ログイン後のcms:idはありません。

 

 

このエントリーをはてなブックマークに追加

トラックバック

トラックバック記事記事

この記事のトラックバックURI: