Help Center
카페24 소식
[스마트디자인] 아이핀 인증 확대적용!
2013-01-24
안녕하세요, 카페24 운영도우미 입니다.
스마트디자인에도 아이핀 인증 서비스가 확대 적용되어
성인인증 및 14세 미만 비회원 구매제한에 적용 방법을 안내드립니다.
*참고 : 아이핀 서비스 오픈공지 보기
자세한 내용은 아래를 참조해 주세요.
1. 제목 : 스마트디자인 아이핀 인증 확대적용!
2. 적용일자 : 2013-01-23 (수)
3. 업데이트 내용
- 14세 미만 비회원 구매제한 팝업
- 성인인증 페이지 적용
나이확인 및 성인인증이 필요한 위의 영역에 아이핀 인증이 적용되었으며,
정상 동작을 위하여 Html 디자인 수정 및 설정이 필요하므로 하단의 상세안내를 확인하시기 바랍니다.
* 아이핀 인증 서비스는 유료 부가서비스이므로 신청/결제 완료 후 사용 가능합니다.
[아이핀 인증 서비스 신청]
- '어드민 > 부가서비스 > 운영지원 서비스 > 아이핀인증 서비스 > 서비스 신청' 메뉴에서
아이핀 인증 서비스 신청이 완료되어 신청 상태가 사용 중이어야 다음 설정을 진행할 수 있습니다.
('어드민 > 상점관리 > 상점 운영관련 설정 > 본인인증 서비스 설정' 메뉴에서 신청 상태 확인 가능)
[14세 미만 비회원 구매제한 팝업에 적용]
1) '어드민 > 상점관리 > 상점운영 관련설정 > 상점운영방식 설정 > 구매권한' 메뉴로 이동하여
다음과 같이 14세 미만 비회원 구매차단 설정을 합니다.
2) '어드민 > 디자인관리 > 스마트디자인 > 디자인 편집 > 14세미만 구매제한 확인 절차
(member/check_under_fourteen.html)' 페이지로 이동하여 아래와 같이 소스를 수정합니다.
- 빨간색으로 표시된 부분은 삭제, 파란색으로 표시된 부분은 해당 위치에 추가합니다.
|
.xans-member-adulthead { width:754px; margin:30px auto; }
.xans-member-adulthead h1 { height:23px; margin:30px 0; border-bottom:1px solid #dedcdc; }
.xans-member-adulthead h1 span { float:left; height:23px; padding:0 23px 0 0; border-bottom:1px solid #272823; font-size:18px; color:#272823; }
.xans-member-adulthead .under19 { margin:0 0 20px; border:1px solid #d2d2cf; background:#f5f5f5; }
.xans-member-adulthead .under19 .msg { width:363px; margin:0 auto; padding:70px 0 70px 117px; font-size:11px; line-height:18px; color:#8f8f91; }
.xans-member-adulthead .under19 .msg h2 { height:80px; margin:0 0 0 -117px; padding:20px 0 0 117px; background:url(http://img.echosting.cafe24.com/design/skin/mono/intro/bg_under19ipin.gif) 0 0 no-repeat; color:#333; font-size:22px; line-height:1.3em; }
.xans-member-adulthead .under19 .msg .info { padding:0 0 42px; }
.xans-member-adulthead .under19 .msg .info span { display:block; padding:24px 0 0; }
.xans-member-adulthead .under19 .msg .info span em { color:#34a7b3; font-style:normal; }
.xans-member-adulthead .member { overflow:hidden; zoom:1; margin:-1px 0 0; padding:40px 38px; border:1px solid #d2d2cf; background:#f5f5f5; }
.xans-member-adulthead .member h2 { float:left; width:260px; }
.xans-member-adulthead .member .inner { float:left; width:390px; }
.xans-member-adulthead .member .login { overflow:hidden; }
.xans-member-adulthead .member .login .inputType { float:left; width:195px; }
.xans-member-adulthead .member .login .inputType span { overflow:hidden; display:block; padding:0 0 3px; }
.xans-member-adulthead .member .login .inputType span strong { float:left; width:60px; padding:3px 0 0 0; }
.xans-member-adulthead .member .login .inputType span input { width:120px; padding:3px; }
.xans-member-adulthead .member .login .btn { float:left; }
.xans-member-adulthead .member .security { padding:0 0 0 60px; }
.xans-member-adulthead .member .join { padding:7px 0 0 60px; }
.xans-member-adulthead .member .join a,
.xans-member-adulthead .member .join a:hover { padding:0 0 0 7px; font-size:11px; color:#8f8f91; background:url(http://img.echosting.cafe24.com/design/skin/mono/intro/ico_joinus.gif) 0 50% no-repeat; }
.xans-member-adulthead .member .ipin { padding:10px 0 0; font-size:11px; line-height:16px; color:#8f8f91; }
.xans-member-adulthead .member .ipin span { display:block; padding:0 0 5px; }
▼ 화면1. 14세미만 구매 제한 팝업 적용화면
[성인인증 페이지에 적용]
1) '어드민 > 디자인관리 > 스마트디자인 > 디자인 기능설정 > 인트로화면' 메뉴로 이동하시면
아이핀 인증으로 성인인증이 가능한 새로운 유형의 인트로화면이 추가되었습니다.
원하시는 화면을 선택해주세요.
▼ 화면1. 성인인증 추가된 페이지
2) 새로 추가된 인트로 페이지를 위한 HTML 파일, CSS 파일을 추가합니다.
① CSS 파일 추가
- 경로 : /css/module/member/adultHead.css
- 파일 명 : adultHead.css
② HTML 파일 추가 1
- 경로 : /intro/adult_im.html (본인인증+회원로그인 인트로)
- 파일 명 : adult_im.html
<!--@layout(/layout/basic/intro.html)-->
<div
module="Member_AdultHead">
<!--@css(/css/module/member/adultHead.css)-->
<h1><span>
로그인</span></h1>
<div
class="under19">
<div
class="msg">
<h2>19
세 미만의 미성년자는 <br
/>
출입을 금합니다.</h2>
<p
class="info">
이 정보내용은 청소년 유해매체물로서 <br
/>
정보통신망 이용촉진법 및 정보보호 등에 관한 법률 및 청소년 보호법의 <br
/>
규정에 의하여 19세 미만의 청소년은 사용할 수 없습니다. <br
/>
<span>
미성년자 차단을 위하여 <em>로그인 또는 본인인증 절차</em>를 거치셔야 합니다.</span>
</p>
<a
href="{$outlink}"><img
src="
http://img.echosting.cafe24.com/design/skin/mono/intro/btn_under19ipin.gif" alt="19
세 미만 나가기"
/></a>
</div>
</div>
<div
class="member"
module="Member_Login">
<h2><img
src="
http://img.echosting.cafe24.com/design/skin/mono/intro/h2_ipinMember.gif" alt="
회원 로그인"
/></h2>
<div
class="inner">
<p
class="login">
<span
class="inputType">
<span
class="name"><strong>
아이디</strong> {$form.member_id} </span>
<span
class="number"><strong>
비밀번호</strong> {$form.member_passwd}<br
/></span>
</span>
<span
class="btn"><a
href="#none"
onclick="{$action_func_login}"><img
src="
http://img.echosting.cafe24.com/design/skin/mono/intro/btn_login.gif" alt="
로그인"
/></a></span>
</p>
<p
class="security">
<input
id="check_secret_connect0"
name="check_secret_connect"
fw-filter=""
fw-label="check_secret_connect"
fw-msg=""
value="T"
type="checkbox"
/><label
for="check_secret_connect0"
>
보안 접속</label>
</p>
<p
class="join">
<a
href="/member/id/find_id.html{$skip_intro}">
아이디</a>
<a
href="/member/passwd/find_passwd_info.html{$skip_intro}">
비밀번호 찾기</a>
<a
href="/member/join.html{$skip_intro}">
회원 가입 하기</a>
</p>
</div>
</div>
<div
class="member"
{$display_auth}>
<h2><img
src="
http://img.echosting.cafe24.com/design/skin/mono/intro/h2_ipinNoMember.gif" alt="
비회원 성인인증"
/></h2>
<div
class="inner">
<label><input
type="radio"
name='AuthType'
checked />
아이핀(i-PIN) 인증</label>
<p
class="ipin">
<span><a
href="#none"
onclick="{$ipinpopup}"><img
src="
http://img.echosting.cafe24.com/design/skin/mono/member/btn_memJoin2.gif" alt="
아이핀 인증"
style="vertical-align:middle"
/></a></span>
아이핀이란, 회원님의 개인정보 보호를 위해 <br
/>
웹사이트에 주민등록번호를 제공하지 않고,<br
/>
본인임을 확인하는 인터넷상의 개인식별번호 서비스입니다.<br
/>
아이핀을 통한 가입을 원하시면 아이핀 인증 버튼을 눌러 진행해 주십시오.
</p>
</div>
</div>
③ HTML 파일 추가 2
- 경로 : /intro/adult_i.html (본인인증 인트로)
- 파일 명 : adult_i.html
<!--@layout(/layout/basic/intro.html)-->
<div
module="Member_AdultHead">
<!--@css(/css/module/member/adultHead.css)-->
<h1><span>
로그인</span></h1>
<div
class="under19">
<div
class="msg">
<h2>19
세 미만의 미성년자는 <br
/>
출입을 금합니다.</h2>
<p
class="info">
이 정보내용은 청소년 유해매체물로서 <br
/>
정보통신망 이용촉진법 및 정보보호 등에 관한 법률 및 청소년 보호법의 <br
/>
규정에 의하여 19세 미만의 청소년은 사용할 수 없습니다. <br
/>
<span>
미성년자 차단을 위하여 <em>로그인 또는 본인인증 절차</em>를 거치셔야 합니다.</span>
</p>
<a
href="{$outlink}"><img
src="
http://img.echosting.cafe24.com/design/skin/mono/intro/btn_under19ipin.gif" alt="19
세 미만 나가기"
/></a>
</div>
</div>
<div
class="member"
{$display_auth}>
<h2><img
src="
http://img.echosting.cafe24.com/design/skin/mono/intro/h2_ipinNoMember.gif" alt="
비회원 성인인증"
/></h2>
<div
class="inner">
<label><input
type="radio"
name='AuthType'
checked />
아이핀(i-PIN) 인증</label>
<p
class="ipin">
<span><a
href="#none"
onclick="{$ipinpopup}"><img
src="
http://img.echosting.cafe24.com/design/skin/mono/member/btn_memJoin2.gif" alt="
아이핀 인증"
style="vertical-align:middle"
/></a></span>
아이핀이란, 회원님의 개인정보 보호를 위해 <br
/>
웹사이트에 주민등록번호를 제공하지 않고,<br
/>
본인임을 확인하는 인터넷상의 개인식별번호 서비스입니다.<br
/>
아이핀을 통한 가입을 원하시면 아이핀 인증 버튼을 눌러 진행해 주십시오.
</p>
</div>
</div>
</div>
※ 게시판 성인인증 페이지에도 적용하려면, 인트로 본인인증(adult_i.html) 및 인트로 본인인증+회원(adult_im.html)
페이지 내 소스를 전체복사하여 게시판(board.html) 페이지에 넣고 수정하시면 됩니다.
▼ 화면1. 성인인증 적용 후 화면
4. 예외 사항
- 사용 도중 아이핀 인증이 만료되거나 일시중지되면, 성인인증/14세 미만 비회원 구매제한 팝업 내에서
아이핀 인증 관련 영역은 자동으로 비노출됩니다.
카페24 는 쇼핑몰 운영을 보다 편리하고 쉽게 할 수 있도록 기능 업데이트를 지속적으로 진행하고 있습니다.
더 좋은 서비스가 되기 위해 노력하겠습니다. 끊임없는 애정과 관심 부탁 드립니다.
궁금하신 사항은 언제든지 고객지원센터 1:1게시판으로 문의해주세요. [문의하기]