경로 : 디자인 관리 > 쇼핑몰 디자인(pc)
※ PC 쇼핑몰 디자인 관련 기능들을 설정하는 메뉴 입니다.
쇼핑몰 디자인 편집은 쇼핑몰 화면을 직접 보면서 편집이 가능한 ‘Design Edit’ 를 통해 진행하는게 편리하니 해당 가이드를 참고하시기 바랍니다.
목차
1. 템플릿 스킨
1) 프로셀은 하나의 [템플릿]을 선택하고, 선택한 [템플릿]에서 배너와 상품 영역을 여러가지 형태의 스킨을 통해 디자인할 수 있는 쉬운 디자인 편집 기술을 제공하고 있습니다.
•
[템플릿]은 총 4가지 형태를 제공 중이며, 여러가지 형태의 [템플릿]을 계속해서 추가해나갈 예정입니다.
2) 사용할 [템플릿] 선택이 완료되었다면 하단의 ‘템플릿 설정 정보’를 클릭합니다.
•
적용 크기 : 쇼핑몰에 출력되는 배너와 상품 노출 영역을 설정하는 기능입니다.
•
로고/ 배너 초기화 : 등록된 로고와 배너를 초기화 하거나 유지하는 기능입니다.
•
선택이 완료되었다면 ‘확인’ 버튼을 클릭하여 [템플릿]적용을 완료할 수 있습니다.
3) [템플릿] 선택을 완료했다면 ‘편집 모드로 이동’ 또는 pc샵 버튼을 클릭하고, pc 쇼핑몰 화면으로 이동하여 편집을 진행할 수 있습니다.
쇼핑몰 화면에서 ‘Design Edit’를 실행하여 디자인을 편집할 수 있습니다. (’Design Edit’를 통한 디자인 수정 방법은 아래 링크된 페이지를 확인해주세요)
4) 템플릿 커스터마이징
[템플릿]에 따라 커스텀이 가능한 영역이 다르기 때문에 아래 링크된 페이지를 확인해주세요
5) 스킨 설정
•
현재는 ‘basic’ 스킨만 제공되고 있으며, 페이지별 스킨도 추후 여러가지 형태의 스킨을 제공할 예정입니다.
2. 쇼핑몰 로고
1) 프로셀에서는 쇼핑몰 로고를 이미지 파일로 등록할 수 있도록 기능을 제공하고 있습니다.
•
로고 이미지는 선택하신 템플릿에 따라 종류와 권장 사이즈가 다르며, 권장 사이즈를 초과한 경우 비율에 맞추어 자동 축소됩니다.
•
로고 이미지는 PNG, GIF, JPG로 등록 가능지만, 화질과 투명한 배경 처리를 고려해 PNG 파일을 권장합니다.
•
로고 이미지를 등록하지 않은 경우 쇼핑몰 정보란에 입력된 쇼핑몰명이 출력됩니다.
•
+ 버튼을 클릭하여 파일을 등록하시기 바랍니다.
① 상단로고 : 쇼핑몰 상단 화면에 노출되는 로고 입니다.
이미지 등록 후 쇼핑몰 노출 화면
② 하단로고 : 쇼핑몰 하단 화면에 노출되는 로고 입니다
이미지 등록 후 쇼핑몰 노출 화면
③ 페이지로고 : 로그인 페이지에 노출되는 로고입니다.
이미지 등록 후 쇼핑몰 노출 화면
3. 메뉴 관리
1) 쇼핑몰 상/하단의 카테고리 메뉴를 편집하는 기능입니다.
① 상단 메뉴A/B
•
‘상단 메뉴 설정’ 버튼을 클릭하면 메뉴를 추가하거나 삭제할 수 있습니다.
•
‘메뉴 추가하기’ 버튼을 클릭하면 메뉴 유형, 메뉴 명칭, 링크를 설정하는 항목이 추가되며, 여러가지 유형을 선택하여 메뉴를 추가할 수 있습니다.
•
편집이 완료되면 상단 미리보기 화면에서 즉시 확인이 가능합니다.
② 하단 메뉴A/B
•
상단 메뉴와 동일한 형태의 메뉴 편집 기능입니다.
4. 템플릿 배너
1) 쇼핑몰의 모든 페이지와 생성한 카테고리, 게시판, 페이지에 이미지 또는 동영상 배너를 출력할 수 있습니다.
•
템플릿 배너 메뉴에서 ‘템플릿 배너등록’ 버튼을 클릭하면 원하는 페이지와 영역을 선택하여 템플릿을 등록이 가능합니다.
① 노출 정보
•
노출 페이지 : 배너가 노출되길 원하는 페이지를 선택합니다.
•
노출 영역 : 노출 페이지에서 배너 노출 영역을 선택합니다.
•
노출 안내 : 노출 페이지/영역을 설정하면 노출에 대한 안내 문구를 확인할 수 있습니다.
② 템플릿 배너
•
배너명 : 쇼핑몰에 노출되지 않으며, 관리를 위한 배너 명칭을 입력합니다.
•
제작방식 : 이미지/동영상/동영상(URL)을 입력하여 배너를 등록할 수 있습니다.
•
배경색상 : 배경 색상은 등록된 이미지나 동영상의 크기가 권장 크기보다 작거나, 웹 브라우저 가로 100%가 적용되는 타입의 배너 제작 시 사용됩니다.
•
대체 이미지 : 동영상 재생이 불가한 환경에서 접속 시 대체 이미지가 출력됩니다. (동영상만 설정 메뉴가 노출됩니다.)
•
링크 : 배너 클릭 시 연결되는 페이지 주소를 입력합니다.(동영상 등록 후 링크를 등록하는 경우 동영상은 재생되지 않고 입력된 링크로 이동됩니다.)
-예시-
[로그인 페이지 상단 동영상 삽입]
2) 등록이 완료된 템플릿 배너는 ‘목록 결과’ 화면에서 확인이 가능하고, ‘등록정보’ 버튼을 클릭하여 정보를 수정하거나 ‘옵션’ 버튼을 클릭하여 미리보기 또는 삭제가 가능합니다.
5. 인덱스 배너
1) 인덱스 배너는 메인 화면에 노출되는 롤링 배너 , 띠배너, 중간 배너 등 여러 형태의 스킨을 선택하여 이미지 또는 동영상을 노출하는 기능입니다.
•
인덱스 배너 메뉴에서 ‘인덱스 배너 등록’ 버튼과 ‘디스플레이 추가’ 버튼을 확인할 수 있습니다.
•
‘인덱스 배너 등록’은 이미 생성되어 있는 인덱스 배너 영역에 새로운 이미지 또는 동영상을 추가하는 방식입니다.
•
‘디스플레이 추가’는 인덱스 배너 영역을 새롭게 생성하고 그 안에 새로운 배너 이미지 또는 동영상을 등록하는 방식입니다.
•
동영상 등록은 동영상 스킨 선택 시에만 가능합니다.
‘Design Edit’ 사용 시 ‘디스플레이 추가’ 내용을 확인하세요
인덱스 배너 등록
① 노출정보
•
노출영역 : 등록되어 있는 인덱스 배너 영역을 디스플레이라 하고, 단은 디스플레이가 등록된 순서를 표기하고 있습니다. (쇼핑몰 화면에서 상단 영역부터 1단으로 시작되고, 아래로 내려갈수록 단수가 올라갑니다.)
•
타이틀 : 기존에 등록한 배너 타이틀이 자동으로 출력됩니다.
•
적용스킨 : 기존에 적용된 스킨명이 자동으로 출력됩니다.
② 인덱스 배너
•
배너명 : 내부적으로 배너를 관리하기 위한 명칭을 입력합니다. (쇼핑몰에는 노출되지 않습니다.)
•
이미지 : 노출을 원하는 이미지를 등록합니다.
•
링크설정 : 해당 배너를 클릭하면 이동되는 링크 주소를 입력합니다.
디스플레이 추가
① 스킨선택
•
스킨을 선택하여 인덱스 배너의 유형을 정하고, 인덱스 배너를 새롭게 생성하는 기능입니다.
•
여러가지 유형의 스킨을 선택할 수 있으며, 각 유형마다 하단에 배너 제작 가이드가 작성되어 있으니 참고하시기 바랍니다.
② 디자인 설정
•
노출영역 : 선택한 영역을 디스플레이 영역이라 하고 영역의 순서를 단으로 표시합니다.
•
적용스킨 : 선택한 스킨명이 표시되며, ‘스킨변경’ 또는 ‘스킨정보’ 를 확인할 수 있습니다.
•
타이틀 : 배너 영역의 명칭을 입력합니다.
•
출력개수 : 1페이지마다 노출되는 배너 이미지 출력 개수를 선택합니다. (배너 유형별로 선택 가능한 출력 개수가 정해져 있습니다.)
•
설정크기 : 배너 노출 사이즈를 설정합니다.
•
타이틀 노출
◦
노출안함 : 타이틀을 노출하지 않습니다.
◦
텍스트 노출 : 타이틀 항목에 입력된 텍스트를 노출하는 방식입니다.
◦
이미지 노출 : 이미지를 등록하여 타이틀을 노출하는 방식입니다.
③ 고급설정
•
화면전환 : 인덱스 배너 영역에 다수의 이미지를 등록했다면 화면이 전환되면서 이미지가 보여지게 되는데 그때 화면이 전환되는 초 단위를 설정합니다.
•
정렬방식 : 등록한 배너 이미지가 노출되는 순서를 설정합니다.
•
영역크기 : 디스플레이 전체 가로 영역이 표시 됩니다.
•
상하여백 : px 단위로 상/하단의 여백을 설정합니다.
•
최소크기 : 배경 이미지의 세로 영역을 설정합니다.
•
배경색상 : 배너 이미지 영역 뒤의 배경 색을 설정합니다.
•
배경 이미지 : 배너 이미지 영역 뒤의 배경을 이미지를 등록하여 설정합니다.
•
배경 적용방식 : 배경 이미지 적용 방식을 설정합니다.
2) 등록이 완료된 인덱스 배너는 ‘목록 결과’ 화면에서 확인이 가능하고, ‘등록정보’ 버튼을 클릭하여 정보를 수정하거나, ‘옵션’ 버튼을 클릭하여 미리보기 , 디자인 설정, 스킨 정보, 삭제 기능을 사용할 수 있습니다.
6. 팝업창
1) 쇼핑몰 메인 화면에 팝업창을 노출할 수 있습니다.
•
팝업창 메뉴에서 ‘팝업창 등록’ 버튼을 클릭하고 등록 정보를 입력합니다.
① 기본정보
•
팝업창명 : 내부적으로 배너를 관리하기 위한 명칭을 입력합니다. (쇼핑몰에는 노출되지 않습니다.)
•
시작일시 : 팝업이 노출되는 시점을 설정 합니다.
•
종료일시 : 팝업이 노출되지 않는 시점을 설정합니다.
•
제작방식 : 이미지 , 에디터 등록 방식을 제공합니다.
② 팝업창 내용/링크
•
창 크기(사이즈) : 첨부한 이미지 사이즈와 동일하게 노출됩니다. (에디터 등록 방식은 창 크기를 입력하도록 되어있습니다.)
•
이미지 : 팝업창에 노출할 이미지를 등록합니다.
•
링크 설정 : 팝업 클릭 시 이동되는 링크를 설정합니다.
•
팝업창 위치 : 팝업창이 노출되는 영역을 설정합니다.
2) 등록이 완료된 팝업창은 ‘목록 결과’ 화면에서 확인이 가능하고, ‘등록정보’ 버튼을 클릭하여 정보를 수정하거나, ‘옵션’ 버튼을 클릭하여 미리보기 또는 삭제가 가능합니다.
7. 인트로
1) 쇼핑몰 접근 시 최초 노출되는 화면을 인트로 페이지라고 합니다.
•
해당 메뉴에서 여러 형태의 인트로 페이지를 설정할 수 있습니다.
ⓛ 오픈예정 안내
•
기본 오픈예정 안내 인트로를 제공 중이며, 에디터를 통해 원하는 디자인으로 수정할 수 있습니다.
•
변경 후 기본 값 복원을 원한다면 ‘변경내용 초기화’ 버튼을 클릭해 원복이 가능합니다.
•
인트로가 설정되면 회원/비회원 모두 쇼핑몰에 접근이 불가능합니다.
② 사이트 점검 안내
•
기본 사이트 점검 안내 인트로를 제공 중이며, 에디터를 통해 원하는 디자인으로 수정할 수 있습니다.
•
변경 후 기본 값 복원을 원한다면 ‘변경내용 초기화’ 버튼을 클릭해 원복이 가능합니다.
•
인트로가 설정되면 회원/비회원 모두 쇼핑몰에 접근이 불가능합니다.
③ 성인몰
•
기본 성인몰 인트로를 제공 중이며, 에디터를 통해 원하는 디자인으로 수정할 수 있습니다.
•
변경 후 기본 값 복원을 원한다면 ‘변경내용 초기화’ 버튼을 클릭해 원복이 가능합니다.
•
인트로가 설정되면 [성인 인증된 계정 로그인] 또는 [성인 인증된 게스트 모드]를 통해서만 쇼핑몰에 접근이 가능합니다.
④ 폐쇄몰
•
기본 폐쇄몰 인트로를 제공 중이며, 에디터를 통해 원하는 디자인으로 수정할 수 있습니다.
•
변경 후 기본 값 복원을 원한다면 ‘변경내용 초기화’ 버튼을 클릭해 원복이 가능합니다.
•
인트로가 설정되면 관리자 승인을 통해 승인된 회원만 쇼핑몰 접근이 가능합니다.
•
폐쇄몰로 설정 시 회원등급 【0】, 【1】, 【2】는 쇼핑몰을 이용할 수 없으며, 관리자 승인이 완료된 【3】부터 쇼핑몰을 이용할 수 있습니다.
【0】 비회원 > 비회원 // 쇼핑몰 접속(인트로 페이지) 후 로그인 전 상태 (쇼핑몰 이용 불가)
【1】 패밀리 > 승인대기 // 회원가입 후 관리자의 승인을 기다리는 상태 (쇼핑몰 이용 불가)
【2】 브론즈 > 승인거절 // 회원가입 후 관리자의 승인이 거절된 상태 (쇼핑몰 이용 불가)
【3】 실버 > 일반회원 // 회원가입 후 관리자의 승인이 완료된 상태 (쇼핑몰 이용 가능)
•
등급명은 참고용 예시이며, 회원의 상태와 쇼핑몰 이용권한 식별이 가능토록 자유롭게 지정해서 이용하시기 바랍니다.
