쇼핑몰에 소개, 설명 등의 이미지가 들어간 페이지를 

추가하여 사용하고 싶으실 경우 아래 설명대로 해주세요.

< PC디자인 새 페이지 추가하기 >

1. 디자인관리> 디자인보관함 > 수정 버튼 클릭

2. 스마트디자인 편집창이 뜨면 편집창 좌측 하단의 '화면추가' 버튼 클릭

3. 쇼핑몰 화면 추가 팝업창이 뜨면 폴더 중에 쇼핑정보(shopinfo) 폴더를 클릭한 상태에서

   파일명 입력칸에 파일명.html 을 입력 (파일명은 영어 이름으로 원하시는대로 지어주세요.) 후 저장 버튼 클릭

   새 페이지가 생성되며 페이지 주소는 /shopinfo/파일명.html 이 됩니다.

   예를들어 파일명이 intro 인 html 파일을 shopinfo 폴더에 생성했다면 

   페이지 주소는 /shopinfo/intro.html 이 됩니다.

4. 편집창에 새로 생성된 파일이 나타나며 편집창 하단의 작은 아이콘 3개 중 가장 우측의 아이콘을

클릭하면 html 편집창을 넓게 사용 가능

5. 새로 생성된 파일에 있는 html 소스를 모두 삭제한 후 아래 소스를 복사하여 붙여넣습니다.

    아래 소스에서 '페이지 제목'이라고 된 부분이 두 군데가 있는데, 둘 다 글자를 해당 페이지 제목에 맞게 동일하게 수정하시고

   '내용 삽입하는 곳'이라고 된 글자를 삭제한 후, 그 자리에 직접 삽입하실 내용을 넣어줍니다. 

  이미지를 삽입하고 싶으시면 이미지를 파일 업로더로 업로드하신 후 이미지 태그를 넣어주시면 됩니다. 

   < 파일 업로더로 이미지 업로드 하는 방법 (아래 주소 클릭해주세요.) >

  https://byulmoa.com/article/%EC%9C%A0%EC%9A%A9%ED%95%9C-%EC%9B%B9-%ED%8C%81/3/8698/page/2/

   아래 소스 중 초록색으로 표시된 center 라고 된 부분은 내용이 페이지 중앙에 정렬된다는 뜻으로 

   페이지 왼쪽으로 정렬을 원하시면 center 를 left 로 수정해주시면 됩니다.

    내용을 모두 넣고나면 반드시 편집창 상단 좌측의 '저장' 버튼을 클릭해주세요.

<!--@layout(/layout/basic/layout.html)-->

<style>

#page_contents { text-align:center; }

#page_contents img { max-width:100%; height: auto !important; }

</style>

<div class="path">

    <span>현재 위치</span>

    <ol>

        <li><a href="/">홈</a></li>

        <li title="현재 위치"><strong>페이지 제목</strong></li>

    </ol>

</div>

<div class="titleArea">

    <h2>페이지 제목</h2>

</div>

<div id="page_contents">

내용 삽입하는 곳

</div>

6. 차후에 페이지를 다시 열어 수정 작업을 할 경우 

디자인관리> 디자인보관함 > 수정 버튼 클릭하여

편집창 좌측 하단의 화면명 검색창에서 해당 페이지의 파일명 검색하여

파일 열어 수정 가능

예시)  intro.html

--------------------------------------------------------------------------

< 모바일 디자인 새 페이지 추가하기 > 

1. 모바일쇼핑몰 > 디자인보관함 > 수정 버튼 클릭

2. 스마트디자인 편집창이 뜨면 편집창 좌측 하단의 '화면추가' 버튼 클릭

3. 쇼핑몰 화면 추가 팝업창이 뜨면 폴더 중에 쇼핑정보(shopinfo) 폴더를 클릭한 상태에서

    파일명 입력칸에 파일명.html 을 입력 (파일명은 영어 이름으로 원하시는대로 지어주세요.) 후 저장 버튼 클릭

   새 페이지가 생성되며 페이지 주소는 /shopinfo/파일명.html 이 됩니다.

   예를들어 파일명이 intro 인 html 파일을 shopinfo 폴더에 생성했다면 

   페이지 주소는 /shopinfo/intro.html 이 됩니다.

4. 새로 생성된 파일에 있는 html 소스를 모두 삭제한 후 아래 소스를 복사하여 붙여넣습니다.

    아래 소스에서 '페이지 제목'이라고 된 글자가 한 군데 있는데, 해당 페이지 제목에 맞게 수정하시고

    '내용 삽입하는 곳'이라고 된 글자를 삭제한 후, 그 자리에 직접 삽입하실 내용을 넣어줍니다.

     (PC디자인과 삽입할 내용이 동일하다면 내용 부분을 복사하여 붙여넣기 해주시면 됩니다.)

    내용을 모두 넣고나면 반드시 편집창 상단 좌측의 '저장' 버튼을 클릭해주세요.

<!--@layout(/layout/basic/layout.html)-->

<style>

#page_contents img { max-width:100%; height: auto !important; }

</style>

<div id="titleArea">

    <h2>페이지 제목</h2>

    <span module="Layout_MobileAction">

        <a href="#none" onclick="{$go_back}"><img src="//img.echosting.cafe24.com/skin/mobile_ko_KR/layout/btn_back.gif" width="33" alt="뒤로가기"></a>

    </span>

</div>

<div id="page_contents"><br>

내용 삽입하는 곳

</div>

5. 

차후에 페이지를 다시 열어 수정 작업을 할 경우 

모바일쇼핑몰 > 디자인보관함 > 수정 버튼 클릭하여

편집창 좌측 하단의 화면명 검색창에서 해당 페이지의 파일명 검색하여

파일 열어 수정 가능

예시)  intro.html