이미지 추가하기 : 상단 이미지 영역에 마우스 커서를 올려놓으면 이미지를 업로드 하거나 포마이샵이 제공하는 무료 이미지를 선택할 수 있습니다. 왼쪽 기본 이미지 영역에 이미지를 추가하면 페이지에 기본 표시 되며, 오른쪽 롤오버 영역에 이미지를 추가하면 롤오버 형식으로 처리됩니다.
이미지 채우기 : 이미지를 그리드에 빈 공간 없이 가득 채우게 됩니다. 이 옵션이 해제되면 허용된 그리드 공간 내에서 이미지를 잘림 없이 표현합니다.
라이트박스 : 이미지를 누르면 주변이 어두워지면서 큰 이미지로 확대하여 보여줍니다. *이미지 링크와 함께 사용할 경우 이 옵션이 무시됩니다.
원형 이미지 : 이미지를 원형으로 만듭니다. 이미지의 원본 비율과 상관 없이 정원 형태로 만듭니다.
흑백 이미지 : 이미지를 흑백으로 만듭니다.
선명하게 : 이미지가 보다 선명하게 보입니다. 이미지 유형에 따라 부적절하게 보일 수 있으니 주의해야 합니다.
높이/높이고정 : 이미지의 높이를 지정합니다. 높이고정이 활성화 되면 기기에 상관 없이 지정된 높이로 표현됩니다.
설명 : 이미지와 함께 출력할 텍스트를 삽입합니다. 이미지 아래에 표시하거나 겹쳐서 표시할 수도 있습니다.
음영 : 이미지 위에 입힐 색상을 지정할 수 있습니다.
링크 : 이미지를 클릭하면 이동하는 메뉴의 링크를 설정할 수 있습니다.
기본 이미지와 롤오버 이미지
롤오버 이미지란 마우스 커서가 이미지에 올라갔을 때 발동되는 효과 또는 이미지 전환을 말합니다. 롤오버 이미지 설정이 비어있으면 마우스를 올려도 변화가 생기지 않습니다. 예를 들어 롤오버 이미지 항목에서 '흑백 이미지'를 체크하게 되면 마우스를 올렸을 때 흑백 이미지로 표현됩니다.
자주 묻는 질문(FAQ) 게시판 만들기
자주 묻는 질문 게시판은 운영자(또는 운영진 그룹)의 고객지원 업무를 줄여줄 뿐만 아니라, 방문자가 빠르게 궁금증을 해결하는 데도 도움을 줍니다.
이 도움말에서는 운영자(또는 운영진 그룹)만 작성할 수 있는 게시판을 만들어, 자주 묻는 게시판으로 제작하는 방법을 설명합니다.
1단계: 게시판 위젯 추가 및 게시판 설정 열기
2단계: 게시판 위젯 설정하기 (게시판 설정)
게시판 위젯을 자주 묻는 질문 게시판으로 설정하기 위한 과정입니다.
1. 게시판 이름 항목에서 게시판의 이름을 작성합니다. 작성한 게시판 이름은 게시판에 표시할 수 있습니다.
2. (선택 사항) 작성해야 할 게시물 수가 많은 경우, 카테고리 옵션을 사용할 수 있습니다. 카테고리를 미리 구성한 다음, 게시물 작성 시 해당 게시물이 속할 카테고리를 선택할 수 있습니다.
3. 옵션 항목에서 자주 묻는 게시판 제작을 위한 필수 옵션을 설정합니다.
댓글 표시: 댓글 사용 안함으로 변경합니다.
4. 권한 항목에서 자주 묻는 게시판 제작을 위한 필수 권한을 설정합니다.
글 작성: 소유자 또는 선택그룹 사용자를 선택합니다.
참고: 앞서 사용자 그룹을 생성하지 않은 경우, 선택그룹 사용자로 선택 시, 선택할 그룹이 표시되지 않습니다. 새 그룹 만들기 도움말을 참고해 사용자 그룹(운영진 그룹)을 생성해 주세요.
3단계: 게시판 위젯 설정하기 (디자인)
자주 묻는 질문 게시판의 디자인 스타일을 설정합니다.
4단계: 게시물 작성하기
상품 카테고리별 다른 디자인 적용하기
시작에 앞서
쇼핑 위젯과 쇼핑 기획전 위젯 2가지를 함께 사용해, 메뉴마다 다른 디자인으로 페이지를 꾸미고 상품을 진열할 수 있습니다.
다음 사이트에서 샘플을 확인하실 수 있습니다.
본 튜토리얼을 진행하기에 앞서 기본 쇼핑설정을 하지 않으셨다면 다음 도움말을 먼저 읽어주세요.
PART 1. 숨김 쇼핑 메뉴 만들기
쇼핑 위젯이 삽입된 숨김 메뉴를 제작합니다.
본 숨김 메뉴는 쇼핑몰 자동 구성을 위한 메뉴이며, 실제 페이지에는 표시되지 않습니다.
1단계, 빈 메뉴 추가하기
상단 메뉴 오른쪽 끝 ⨁를 클릭해 새로운 빈 메뉴를 추가합니다.
메뉴명을 입력하고 확인을 클릭합니다. (예시 메뉴명 : SHOP 숨김)
2단계, 메뉴 숨기기
설정 창 하단 옵션 항목에서 메뉴 숨김를 체크합니다.
3단계, 쇼핑 위젯 추가 및 설정 열기
4단계, 위젯 설정하기
쇼핑 위젯에 상품 카테고리를 연동하고 주요 설정 요소들을 수정합니다.
*주의 : 이곳에서 지정한 비율이 상품 상세페이지 이미지에도 적용됩니다.
Hover 효과를 지정합니다. *예 : 상품명, 가격 표시
5단계, 글로벌 메뉴 확인하기
글로벌 메뉴에 상품 상세페이지, 장바구니, 마이페이지 메뉴가 생성 되었는지 확인합니다. *쇼핑 위젯 추가 시 자동 생성
PART 2. 상품 카테고리 메뉴 디자인
상품 카테고리 수만큼 메뉴를 만들고, 추가한 메뉴에 쇼핑 기획전 위젯 외 기타 위젯들을 사용해 페이지를 디자인하고 상품을 진열하는 방법을 알아봅니다.
1단계, 메뉴 추가하기
상품 카테고리 메뉴로 사용할 메뉴를 추가(4개) 합니다. *상품 카테고리 수에 따라 메뉴 개수는 달라질 수 있습니다.
2단계, 메뉴 그룹화 및 메뉴명 수정하기
메뉴를 다음 그림처럼 그룹 메뉴로 구성합니다.
3단계, 상위 메뉴 디자인 및 상품 진열하기
SHOP(상위 메뉴)에 상품을 진열하고 페이지를 디자인합니다.
표시 대상 항목에서 표시할 상품 카테고리를 선택합니다.
4단계, 하위 메뉴 디자인 및 상품 진열하기
표시 대상 항목에서 표시할 상품 카테고리를 선택합니다.
나머지 Cup, Equipment 메뉴도 위 절차에 따라 제작합니다.
5단계, 사이트 미리보기 및 게시하기
미리보기를 클릭해 작업한 내용을 확인하고 게시하기를 클릭해 방문자가 보고 구매할 수 있도록 적용합니다.
위젯 설정하기
위젯 설정을 열어 각 위젯이 가진 고유의 설정을 변경할 수 있습니다.
위젯 설정 열기
마우스 오른쪽 버튼을 클릭합니다.
참고 : 위 그림은 이미지 위젯에 마우스 오른쪽 버튼을 클릭한 장면입니다.
참고 : 위젯에 따라 설정 앞 이름이 달라집니다.
이미지 위젯
위젯 소개
페이지에 이미지를 삽입할 때 사용합니다.
위젯 설정하기
기본 이미지와 롤오버 이미지
롤오버 이미지란 마우스 커서가 이미지에 올라갔을 때 발동되는 효과 또는 이미지 전환을 말합니다. 롤오버 이미지 설정이 비어있으면 마우스를 올려도 변화가 생기지 않습니다. 예를 들어 롤오버 이미지 항목에서 '흑백 이미지'를 체크하게 되면 마우스를 올렸을 때 흑백 이미지로 표현됩니다.
상품 카테고리별 다른 디자인 적용하기
PART 1. 숨김 쇼핑 메뉴 만들기
쇼핑 위젯이 삽입된 숨김 메뉴를 제작합니다. 본 숨김 메뉴는 쇼핑몰 자동 구성을 위한 메뉴이며, 실제 페이지에는 표시되지 않습니다.
1단계, 빈 메뉴 추가하기
상단 메뉴 오른쪽 끝 ⨁를 클릭해 새로운 빈 메뉴를 추가합니다.
메뉴명을 입력하고 확인을 클릭합니다. (예시 메뉴명 : SHOP 숨김)
2단계, 메뉴 숨기기
설정 창 하단 옵션 항목에서 메뉴 숨김를 체크합니다.
3단계, 쇼핑 위젯 추가 및 설정 열기
4단계, 위젯 설정하기
쇼핑 위젯에 상품 카테고리를 연동하고 주요 설정 요소들을 수정합니다.
*참조 : 일부 설정 값들은 쇼핑 위젯 및 쇼핑 기획전 위젯 디자인에 영향을 줄 수 있습니다.
*주의 : 이곳에서 지정한 비율이 상품 상세페이지 이미지에도 적용됩니다.
Hover 효과를 지정합니다. *예 : 상품명, 가격 표시
5단계, 글로벌 메뉴 확인하기
글로벌 메뉴에 상품 상세페이지, 장바구니, 마이페이지 메뉴가 생성 되었는지 확인합니다. *쇼핑 위젯 추가 시 자동 생성
PART 2. 상품 카테고리 메뉴 디자인
상품 카테고리 수만큼 메뉴를 만들고, 추가한 메뉴에 쇼핑 기획전 위젯 외 기타 위젯들을 사용해 페이지를 디자인하고 상품을 진열하는 방법을 알아봅니다.
1단계, 메뉴 추가하기
상품 카테고리 메뉴로 사용할 메뉴를 추가(4개) 합니다. *상품 카테고리 수에 따라 메뉴 개수는 달라질 수 있습니다.
2단계, 메뉴 그룹화 및 메뉴명 수정하기
메뉴를 다음 그림처럼 그룹 메뉴로 구성합니다.
3단계, 상위 메뉴 디자인 및 상품 진열하기
SHOP(상위 메뉴)에 상품을 진열하고 페이지를 디자인합니다.
참고 : SHOP 메뉴 클릭 시 바로 아래 하위 메뉴(Beans)로 이동하게 하려면 다음 도움말을 참조하세요.
표시 대상 항목에서 표시할 상품 카테고리를 선택합니다.
4단계, 하위 메뉴 디자인 및 상품 진열하기
표시 대상 항목에서 표시할 상품 카테고리를 선택합니다.
나머지 Cup, Equipment 메뉴도 위 절차에 따라 제작합니다.
5단계, 사이트 미리보기 및 게시하기
미리보기를 클릭해 작업한 내용을 확인하고 게시하기를 클릭해 방문자가 보고 구매할 수 있도록 적용합니다.