ホーム > お知らせ, 技術資料 > パスワードの自動入力を回避する方法

パスワードの自動入力を回避する方法

2014 年 6 月 30 日

customerチェックアウト遷移中のお客様情報入力ページにて、Chrome など一部のブラウザで、1度入力したパスワードが自動入力されてしまう現象を回避するための修正が、Welcart1.4 に同梱されているWelcart Default テーマに行われています。

ここでは、既に利用しているテーマにこの修正を反映させるための方法を説明いたします。

 

 

 

【手順1】:スタイルシートへの記述追加

まずは、ご利用中のテーマフォルダ内のstyle.cssに新しいクラス名に対しての記述を追加します。

ここでは「hidden」というクラス名を追加するものとして進めていきますが、
既に「hidden」というクラス名を使用されている場合は別のクラス名を追加して下さい。
その場合、これ以降の記述中の「hidden」というクラス名を、追加するクラス名に置き換えて記述を行って下さい。

以下の内容をstyle.cssに記述します。

.hidden {
display: none;
}

 

【手順2】:wc_tempateのファイルに記述を追加

ご利用中のテーマフォルダ内のwc_templeteフォルダの中にある、以下の4つのファイルを修正していきます。

/wc_templates/member/wc_login_page.php
/wc_templates/member/wc_member_page.php
/wc_templates/member/wc_new_member_page.php
/wc_templates/cart/wc_customer_page.php

上のファイルから順に記述を追加していきます。

 

wc_login_page.php

wc_login_page.phpの記述中にパスワードの入力箇所を出力している以下のような記述があります。

<p>
<label><?php _e('password', 'usces'); ?><br />
<input type="password" name="loginpass" id="loginpass" class="loginpass" size="20" /></label>
</p>

上の記述中の、

<input type="password" name="loginpass" id="loginpass" class="loginpass" size="20" />

の前に

<input class="hidden" value=" " />

という記述を追加します。

そして、オートコンプリートをオフにするためのautocomplete=”off”という属性値を
パスワードのinputタグ内に追加します。

追加した後の記述は以下のようになります。

<p>
<label><?php _e('password', 'usces'); ?><br />
<input class="hidden" value=" " />
<input type="password" name="loginpass" id="loginpass" class="loginpass" size="20" autocomplete="off" /></label>
</p>

残りの3つのファイルも同じ修正を加えていきます。

 

wc_member_page.php

記述追加前

<tr>
<th scope="row"><?php _e('password', 'usces'); ?></th>
<td colspan="2"><input name="member[password1]" id="password1" type="password" value="<?php usces_memberinfo('password1'); ?>" />
<?php _e('Leave it blank in case of no change.', 'usces'); ?></td>
</tr>

 

記述追加後

<tr>
<th scope="row"><?php _e('password', 'usces'); ?></th>
<td colspan="2"><input class="hidden" value=" " /><input name="member[password1]" id="password1" type="password" value="<?php usces_memberinfo('password1'); ?>" autocomplete="off" />
<?php _e('Leave it blank in case of no change.', 'usces'); ?></td>
</tr>

 

wc_new_member_page.php

記述追加前

<tr>
<th scope="row"><em><?php _e('*', 'usces'); ?></em><?php _e('password', 'usces'); ?></th>
<td colspan="2"><input name="member[password1]" id="password1" type="password" value="<?php usces_memberinfo('password1'); ?>" /></td>
</tr>

 

記述追加後

<tr>
<th scope="row"><em><?php _e('*', 'usces'); ?></em><?php _e('password', 'usces'); ?></th>
<td colspan="2"><input class="hidden" value=" " /><input name="member[password1]" id="password1" type="password" value="<?php usces_memberinfo('password1'); ?>" autocomplete="off" /></td>
</tr>

 

wc_customer_page.php

このファイルには2箇所記述の追加を行います。
記述追加前(1つ目)

<tr>
<th scope="row"><?php _e('password', 'usces'); ?></th>
<td><input name="loginpass" id="mailaddress1" type="password" value="" /></td>
</tr>

 

記述追加後(1つ目)

<tr>
<th scope="row"><?php _e('password', 'usces'); ?></th>
<td><input class="hidden" value=" " /><input name="loginpass" id="mailaddress1" type="password" value="" autocomplete="off" /></td>
</tr>

 

記述追加前(2つ目)

<tr>
<th scope="row"><?php if( $member_regmode == 'editmemberfromcart' ) : ?><em><?php _e('*', 'usces'); ?></em><?php endif; ?><?php _e('password', 'usces'); ?></th>
<td colspan="2"><input name="customer[password1]" style="width:100px" type="password" value="<?php echo esc_attr($usces_entries['customer']['password1']); ?>" /><?php if( $member_regmode != 'editmemberfromcart' ) _e('When you enroll newly, please fill it out.', 'usces'); ?></td>
</tr>

 

記述追加後(2つ目)

<tr>
<th scope="row"><?php if( $member_regmode == 'editmemberfromcart' ) : ?><em><?php _e('*', 'usces'); ?></em><?php endif; ?><?php _e('password', 'usces'); ?></th>
<td colspan="2"><input class="hidden" value=" " /><input name="customer[password1]" style="width:100px" type="password" value="<?php echo esc_attr($usces_entries['customer']['password1']); ?>" autocomplete="off" /><?php if( $member_regmode != 'editmemberfromcart' ) _e('When you enroll newly, please fill it out.', 'usces'); ?></td>
</tr>

以上、4つのファイルを修正すれば完了となります。

カテゴリー: お知らせ, 技術資料 タグ:
関連記事