Help Center
카페24 소식
[모바일쇼핑몰] 모바일/PC쇼핑몰 화면전환 설정 기능추가 안내
2013-12-31
안녕하세요, 카페24 운영도우미 입니다.
[모바일쇼핑몰 > 환경설정] 에서 '모바일/PC쇼핑몰 화면전환 설정' 기능이 업데이트 되었습니다.
자세한 내용은 아래를 참조해 주세요.
■ 적용일자 : 2013-12-30 (월)
■ 업데이트 내용
1. '모바일/PC쇼핑몰 화면전환 설정' 기능 설정
- [모바일쇼핑몰 > 환경설정]에서 ‘모바일/PC쇼핑몰 화면전환 설정’ 기능이 추가되었습니다.
- 해당 기능을 사용할 경우, 모바일쇼핑몰에서 하단의 'PC버전' 클릭을 통해 PC쇼핑몰로 전환했을 경우,
'모바일 화면보기'라는 버튼이 표시되어 다시 모바일쇼핑몰 화면으로 전환 할 수 있는 기능이 제공됩니다.
- 본 기능은 PC디자인이 '스마트디자인모드'인 경우에만 이용 가능합니다.
▼ 환경 설정 화면
2. HTML 추가
해당하는 PC디자인에 하단의 HTML을 추가하여 기능이 실제 작동되도록 구성합니다.
* PC스킨 편집 경로 : [디자인관리> (스마트디자인) > 디자인관리 > 디자인 보관함] - 디자인 편집하기
1) 추가파일: layout/basic/main.html 및 /layout/basic/layout.html
- 파일에 하단 소스코드를 추가합니다. (html body 영역내의 최하단에 넣으시면 됩니다.)
<div module="Layout_conversionPc">
<!--@css(/css/module/layout/conversionpc.css)-->
<a href="{$mobile_url}"><span>모바일 화면보기</span></a>
</div>
2) 추가파일: css > module > layout > conversionpc.css
- 해당파일 신규생성 후 하단 소스코드를 추가합니다.
.xans-layout-conversionpc a { display:block; padding:21px 0 22px; border:2px solid #9d9db0; border-radius:4px; font-weight:bold; font-size:38px; color:#63666e; text-align:center; } .xans-layout-conversionpc a { background:#fff -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f2f2f2)); background:#fff -moz-linear-gradient(top, #fff, #f2f2f2); } .xans-layout-conversionpc a:hover { text-decoration:none; } .xans-layout-conversionpc a span { padding:0 0 0 42px; background:url("http://img.echosting.cafe24.com/design/skin/default/layout/ico_go_mobile.png") no-repeat 0 0; background-size:27px 35px; }
▼ 적용화면
- 모바일쇼핑몰 화면 접속 후, 하단에 있는 ‘PC버전’을 클릭합니다.
- PC버전 화면 하단에 ‘모바일 화면보기’ 가 표시되어 다시 모바일쇼핑몰로 이동할 수 있습니다.
카페24 는 쇼핑몰 운영을 보다 편리하고 쉽게 할 수 있도록 기능 업데이트를 지속적으로 진행하고 있습니다.
더 좋은 서비스가 되기 위해 노력하겠습니다. 끊임없는 애정과 관심 부탁 드립니다.
궁금하신 사항은 언제든지 고객지원센터 1:1게시판으로 문의해주세요. [문의하기]