Easy Guid

위멘토 사용가이드

포토샵을 못해도 코딩을 못해도

쉽고 간편하게 관리 해보세요

위멘토 사용가이드

포토샵을 못해도 코딩을 못해도 쉽고 간편하게 관리 해보세요

가이드 304

Google 검색 결과에서 특정 페이지나 이미지가 노출되지 않도록 URL을 차단하고 삭제할 수 있습니다.

주의: 모든 검색엔진에서 페이지가 삭제될 때까지 시간이 소요될 수 있습니다.


Google 검색 결과에서 페이지 삭제하기


특정 페이지가 Google 검색 결과에서 노출되지 않게 차단하고 삭제하는 방법은 세 가지가 있습니다.


방법1: 디자인편집모드 에서 페이지 검색 차단하기


이 방법은 사용자에게 가장 쉽고 간편하게 검색엔진 노출을 차단하는 방법입니다. Google을 비롯해 기타 모든 검색엔진에서 해당 페이지의 검색결과 표시를 영구히 노출되지 않게 차단할 수 있습니다.

  1. 디자인 모드에 접속합니다.
  2. 왼쪽 상단의 메뉴 관리 ≡ 아이콘을 클릭합니다.
  3. 검색결과에서 제외할 메뉴명의 오른쪽 끝 ⓘ 아이콘을 클릭합니다.
  4. 메뉴 설정 창이 켜지면 옵션 항목에서 이 페이지를 검색엔진 차단 옵션을 선택합니다.


  5. 메뉴 설정 창 바깥 영역을 클릭해 설정을 완료합니다.
  6. 오른쪽 상단 게시하기 버튼을 클릭해 적용합니다.

    참고: 작업완료 후에는 검색엔진 로봇(Robot)이 해당 페이지를 재방문해야 페이지 검색엔진 차단이 적용됩니다. 일반적으로 1~2일 이내에 반영되지만, 계속해서 검색결과에 노출되는 경우 위에서 설명한 Google 웹마스터 도구에서 URL 삭제 방법을 수행해 보시기 바랍니다.



방법2: Google 웹마스터 도구에서 일시적으로 삭제하기


Google 검색 결과에서 일시적으로 페이지가 노출되지 않도록 Google에 URL 삭제를 요청할 수 있습니다.

Google 웹마스터 도구에서 URL 삭제를 요청하면 약 6개월 동안 Google 검색에서 해당 페이지가 차단됩니다. 삭제 요청은 언제든 취소할 수 있습니다.

  1. Google 웹마스터 도구에 접속합니다.
  2. (선택 사항) Google에 등록한 사이트가 여러 개라면 일시적으로 삭제할 URL이 포함된 사이트로 변경해 주세요. 왼쪽 상단에 도메인 주소가 표시된 속성 목록을 클릭 후 원하는 사이트로 변경할 수 있습니다.

  3. 왼쪽 메뉴에서 [Google 색인 > 삭제]를 클릭해 이동합니다.
  4. 임시 삭제 항목 탭에서 새 요청 버튼을 클릭합니다.

  5. 새 요청 창이 나오면 아래 그림과 설명을 참고해 URL 삭제를 요청합니다.

    1. Google 검색 결과에서 삭제하려는 웹 페이지의 URL 을 작성합니다.

      참고: 검색 결과에서 삭제할 페이지 URL을 모르겠다면 메뉴 주소(URL) 변경하기 도움말을 참고해 보세요.
    2. 이 URL만 삭제 옵션을 선택합니다.

      참고: 검색 결과에서 삭제할 페이지가 많다면 이 접두어가 포함된 모든 URL 삭제 옵션을 선택할 수 있습니다. 단, 해당 옵션을 정확히 이해하고 사용하실 것을 권장합니다.
    3. 다음 버튼을 클릭합니다.
  6. URL 삭제 확인 창이 나오면 삭제 요청할 URL 과 주의사항을 다시 한 번 확인하고, 요청 제출 을 클릭합니다.
  7. URL 삭제 요청이 완료되었습니다. 이제 Google에서 약 48시간 내에 URL 삭제 요청을 확인하고, 검색 결과에서 일시적으로 페이지를 숨겨줍니다.


방법3: 모든 검색엔진 차단하기


구글, 네이버, 다음(Daum) 등 모든 검색엔진에서 사이트가 검색되지 않도록 검색엔진 수집을 차단할 수 있습니다. 단, 이 방법을 사용하면 모든 검색엔진에서 사이트가 노출되지 않기 때문에 주의가 필요합니다.

  1. 내 사이트 관리자 페이지에 접속합니다. 접속방법
  2. 왼쪽 메뉴에서 [환경설정 > SEO(검색엔진최적화)]를 클릭해 이동합니다.
  3. '검색엔진에서 이 사이트가 검색되지 않도록 합니다.'를 선택합니다.

  4. 저장 버튼을 클릭해 적용합니다.


묶음배송 설정하기


묶음배송이란, 구매자가 서로 다른 배송비가 적용된 상품을 함께 구매할 때, 한번의 배송비 결제로 주문할 수 있는 기능을 말합니다.

묶음배송은 구매자의 배송비 부담은 줄이고, 구매율을 높일 수 있기 때문에 여러 쇼핑몰에서 이용하고 있습니다.

단, 각 상품의 출고지가 다르거나 상품 부피가 커서 1개의 박스에 담을 수 없다면 묶음배송이 불가하기 때문에, 판매 중인 상품을 고려해 묶음배송을 설정해 주세요.


시작에 앞서


무게별, 수량별, 구매 금액별 차등 배송비 사용 시 다른 배송방법과 묶음배송이 적용되지 않습니다. 최종 주문 상품들의 무게, 수량 합산으로 배송비를 책정합니다.

  • 같은 배송 템플릿을 적용한 상품만 묶음배송 설정이 동작합니다.
  • 배송비 부과방식을 무게별, 수량별, 구매 금액별 차등 배송비로 설정하면 묶음배송이 적용되지 않습니다.(최종 주문 상품들의 무게, 수량 합산으로 배송비를 책정)
    • 묶음 가능 상품: 고정배송비, 무료배송, 조건부 무료배송, 기본 배송비를 따르는 무게별/수량별 배송비
    • 묶음 불가 상품: 묶음배송 가능이 해제된 상품, 상품 개별 설정된 무게별/수량별 배송비


설정방법


1단계: 묶음배송 설정하기

상품별로 묶음배송이 가능한 상품을 설정합니다.

  1. 내 사이트 관리자 페이지에 접속합니다. 접속방법
  2. 왼쪽 메뉴에서 [쇼핑 > 상품]을 클릭해 이동합니다.
  3. 묶음배송을 설정할 상품명을 클릭합니다.

    ※참고: 새 상품을 추가하려면 오른쪽 상단의 상품 추가 버튼을 클릭해 상품 상세 정보 입력 화면으로 진입하세요.

  4. 마우스 휠을 움직여 배송 및 택배 항목으로 이동합니다.
  5. 배송 템플릿 선택 항목에서 기본 템플릿을 따름 을 선택해제합니다.

  6. 배송 템플릿을 선택합니다.

    ※ 참고: 배송 템플릿은 배송 템플릿 설정하기 도움말을 참고하여 설정하실 수 있습니다.

  7. 배송설정 수정 버튼을 클릭합니다.

  8. 묶음배송 및 기타 항목의 묶음배송 가능을 선택합니다.

  9. 수정 버튼을 클릭해 배송 및 택배 설정을 적용합니다.
  10. 저장 버튼을 클릭합니다.
  11. (선택 사항) 위 3번~10번 과정을 반복하여 묶음배송 설정이 필요한 특정 상품들의 묶음배송 옵션을 변경합니다.



2단계: 미리보기 및 확인하기

테스트 구매를 시도하여 묶음배송 설정이 정상적으로 동작하는지 확인합니다.

  1. 관리자 페이지 왼쪽 상단의 사이트 이름을 클릭해 내 사이트에 접속합니다.
  2. 상품 상세페이지로 이동해 장바구니 버튼을 클릭합니다
  3. 이전 상품과 배송비가 다른 상품의 상세페이지로 이동해 장바구니 버튼을 클릭합니다.
  4. 장바구니로 이동해 주문하기 버튼을 클릭합니다.
  5. 결제 페이지 오른쪽의 배송비가 묶음배송비 설정대로 책정된 것을 확인할 수 있습니다.


사이트 속도는 방문자들의 관심을 끌기 위한 중요한 요소입니다. 사이트 로드 시간이 오래 걸리면 많은 방문자들이 사이트를 읽기 전에 나갈 수도 있습니다. 사이트 로드 속도를 높이고 더 많은 사람의 관심을 끄는 데 도움이 되는 몇 가지 도움말 및 유용한 정보를 소개합니다.

이미지 및 미디어 최적화

사이트에 포함된 이미지, 동영상 및 기타 멀티미디어가 많을수록 사이트의 로드 시간은 오래 걸리게 됩니다. 하지만 이미지 및 기타 멀티미디어는 방문자의 관심을 끌 수 있는 중요한 요소이므로 이미지 및 멀티미디어의 로드 속도를 최적화 하는 것이 중요합니다. 미디어 로드 속도를 향상시키는 방법은 다음과 같습니다.

  • 이미지 파일 용량을 줄입니다. 같은 이미지라도 파일 형식이나 최적화 정도에 따라 용량 차이는 매우 클 수 있습니다. 온라인 이미지 최적화 도구를 사용하면 같은 파일이라도 50% 적은 용량으로 표시될 수 있습니다.
  • 한 페이지에서 동시에 표시되는 이미지나 멀티미디어의 수를 줄입니다.
  • 한 페이지에 표시할 이미지가 많다면 갤러리 위젯을 사용하실 것을 추천합니다.

타사 자바스크립트 및 링크

사이트 로드 속도를 최적화하려면 자바스크립트 및 링크를 사용하는 것이 좋습니다. 하지만 타사 자바스크립트 및 링크를 사용해야만 하는 경우 모든 자바스크립트를 사이트의 하단에 삽입하면 사용자의 체감 로드 속도가 훨씬 빨라집니다.

하단에 공통 스크립트 추가하기

  1. 내 사이트 관리자 페이지에 접속합니다. 접속방법
  2. 왼쪽 메뉴에서 [환경설정 > SEO(검색엔진최적화)]를 클릭합니다.
  3. 페이지 하단 Footer Code에 스크립트 및 기타 링크 코드를 추가합니다.
  4. 저장 버튼을 클릭해 적용합니다.
  5. 이제 디자인 모드에서 생성하는 모든 메뉴(페이지) 하단에 스크립트 및 링크가 자동으로 추가됩니다.

내 사이트의 로딩 속도가 궁금할 때 Google 크롬 브라우저 개발자도구를 사용해 간단하게 트래픽/속도를 측정할 수 있습니다. 일반적으로 한 개 페이지가 표시되는 데 필요한 데이터 용량은 5MB 미만을 권장합니다.

만약 제작하신 사이트가 느리다고 생각되는 경우, 다음 절차에 따라 크롬 개발자도구로 내 사이트의 한 개 페이지에서 얼마나 많은 데이터가 로드되고 있는지 확인해 보세요.



1단계: 크롬 개발자도구 열기

  1. Google 크롬 브라우저를 켭니다.
  2. 내 사이트에 접속합니다.
  3. 키보드 단축키 F12 (Mac: Option + Command +  I)를 누릅니다.
  4. 다음처럼 개발자도구가 화면 오른쪽에 나타납니다.

2단계: 개발자도구 내 'Network' 탭에서 기록 시작

  1. Network탭을 클릭합니다.

  2. 개발자도구 화면을 기준으로 왼쪽 상단 원형의 기록 아이콘을 클릭합니다. 또는 키보드 단축키 CTRL + E(Mac : Command + E)를 누릅니다.

  3. 기록이 시작됩니다.

3단계: '캐시 비우기 및 강력 새로고침'으로 사이트 다시 열기

  1. 브라우저 왼쪽 상단 새로고침 아이콘 위에 마우스 포인터를 올리고, 마우스 오른쪽 버튼을 클릭합니다.
  2. 캐시 비우기 및 강력 새로고침을 클릭합니다.

  3. 이제 해당 페이지의 트래픽/속도가 체크되어 리스트로 만들어집니다.
    주의: 반드시 캐시 비우기 및 강력 새로고침으로 페이지를 새로고침 해야 정확한 측정이 가능합니다.

4단계: 트래픽/속도 확인하기

다음의 설명을 참고해 속도를 저해하는 요소들을 확인할 수 있습니다. 여러 항목들이 있지만 주로 Name, Type, Size, Time을 통해 확인합니다. 각 항목은 마우스를 클릭해 높은 순 또는 낮은 순으로 정렬이 가능합니다.

  1. Name: 로드하는 파일의 이름이 표시됩니다. 마우스로 클릭해 이미지를 확인하거나 파일 내용을 확인할 수 있습니다.
  2. Type: 파일의 형식이 표시됩니다.
  3. Size: 파일의 크기가 표시됩니다.
  4. Time: 로드되기까지 시간이 표시됩니다.
  5. 사이트가 로드되기까지 걸리는 총 시간 및 트래픽이 표시됩니다.

위 항목들을 확인해 비정상적으로 과부하가 걸리는 이미지나 파일이 없는지 확인해 보세요. 사이트 로드 속도를 향상 시키는 여러 방법은 아래 관련 도움말을 통해 자세히 알아보실 수 있습니다.


네이버 아이디로 로그인(네아로)을 사용하기 위해선 심사가 필요하며, 심사 결과에 따라 이메일로 신청자에게 안내하고 있습니다. 네아로 측에서 보내준 메일을 자세히 검토하여 조치해 보시기 바랍니다.

다음은 심사가 거절되는 주요 유형과 대처 방법입니다.

불필요한 개인정보 요구 또는 불일치

네아로 측에서는 사이트에서 꼭 필요한 개인정보만 취급하는 것을 권장합니다. 특별한 경우가 아닌한 위 이미지처럼 이메일, 별명, 프로필 사진만 필수로 체크해 주세요.

설정위치

네이버 개발자센터 로그인 > Application > 내 애플리케이션 > 네아로 설정한 애플리케이션 클릭 > API 설정의 사용 API

주의: 필수로 체크(또는 추가)한 항목은 실제 사이트 회원가입 시 사용하고 있어야 합니다. 만약 회원가입 시 사용하지 않는 항목을 사용하고 있을 경우 체크를 해제해 주세요. 회원가입 항목 추가 및 편집 방법


네아로에서 제공하지 않는 정보를 심사요청 시 미입력

네아로에서 사이트에 제공할 수 있는 정보는 이름, 이메일, 별명, 프로필 사진, 성별, 생일, 연령대입니다. 이 중에서 생일과 연령대는 아임웹 형식과 맞지 않아 체크하여도 무의미합니다. 네아로에서 제공하는 생일은 생년이 제외된 정보이며, 아임웹은 생년월일 형식의 데이터만 받고 있습니다. 연령대의 경우에도 각 소셜 로그인 제공업체마다 구분이 달라 지원하지 않고 있습니다.

요컨대 이름, 이메일, 별명, 프로필 사진, 성별 외의 정보를 회원가입시 1개 이상 입력받고 있다면 그 사항을 검수 요청시 기재해야 합니다. (예: 상품 배송을 위해 주소정보 입력을 받는 경우)

1. 검수요청 방법

네이버 개발자 센터 로그인 > Application > 내 애플리케이션 > 네아로 설정한 애플리케이션 클릭 > 개발 상태 항목의 네아로 검수요청 버튼 클릭

2. 검수요청시 기재 위치

아래 이미지의 3번 항목


로그인, 가입 등 스크린샷 누락

네아로 검수 요청시 다음과 같은 사항을 필수적으로 제출해야 합니다.

1. 제출사항
  • 회원가입 페이지 스크린샷 예시보기
  • 회원가입시 정보입력화면 또는 회원정보수정 스크린샷 예시보기
  • 로그인 및 회원가입 프로세스 예시보기
2. 검수요청 방법 및 첨부파일 업로드 방법
  • 검수요청 방법: 네이버 개발자 센터 로그인 > Application > 내 애플리케이션 > 네아로 설정한 애플리케이션 클릭 > 개발 상태 항목의 네아로 검수요청 버튼 클릭.
  • 검수요청시 첨부파일 업로드: 첨부 파일 항목의 파일선택 버튼을 클릭해 파일 업로드. (파일이 여러개라면 여러번 파일 업로드)


Google 크롬, Microsoft 엣지, 파이어폭스(Firefox) 등 세계 주요 인터넷 브라우저에는 사용자의 웹 서핑 정보(인터넷 사용 기록, 쿠키 및 사이트 데이터 또는 양식 등)가 저장되지 않는 시크릿 모드라는 기능을 제공합니다.

시크릿 창을 켜면 모든 웹서비스가 로그아웃된 상태로 인터넷에 접속됩니다. 따라서 사이트 설정 변경 후 로그아웃할 필요 없이 시크릿 창만 켜서 간편하게 내 사이트의 로그인 전/후 상태를 확인할 수 있습니다.

참고: 일부 설정의 경우 게시하기 버튼을 클릭하지 않으면 시크릿 창에서 변경사항이 확인되지 않을 수 있습니다.

이 도움말에서는 Google 크롬에서 시크릿 창을 켜서 로그인 및 비로그인 상태에서의 사이트를 비교, 검토하는 방법을 소개합니다.

활용방법

  1. Google 크롬 브라우저가 없는 경우 다운로드 및 설치합니다.
  2. PC에 설치된 크롬 아이콘을 클릭해 브라우저를 켭니다.

  3. 오른쪽 상단에서 더보기 ⋮ 아이콘을 클릭합니다.
  4. 새 시크릿 창을 클릭합니다.
  5. 새 창이 나타납니다. 화면에  아이콘이 나오면 정상적으로 시크릿 창이 켜진 것입니다.참고: 운영체제 및 크롬 버전에 따라 창 모양이 일부 다를 수 있습니다.

  6. 사이트 주소(도메인)를 입력해 내 사이트에 접속합니다.
  7. 설정한 사항들이 비로그인 방문자의 화면에서 정상 작동하는지 확인합니다. 예를 들어 비로그인 상태에서 상품 가격이 보이지 않도록 설정한 경우 시크릿 창에서는 다음 그림처럼 가격이 표시되지 않습니다.

  8. (시크릿 창을 종료하려면) 시크릿 창은 새 창으로 열립니다. 사이트 확인 후 해당 시크릿 창만 종료해 주세요.


단축키로 시크릿 창 열기

PC에서 키보드 단축키로 시크릿 창을 열 수도 있습니다.

  • Windows(윈도우): Ctrl + Shift + N을 누릅니다.
  • Mac (맥): Command + Shift + N을 누릅니다.



관리자 페이지에서는 개인정보 보호를 위해 소유자 계정이 아닐 경우 개인정보 관련 항목들이 암호화 처리 되고 있습니다. 개인정보 접근 권한이 없을 경우 개인정보를 취급하는 페이지들의 편집 권한이 비활성화됩니다. 이 도움말은 운영진 그룹의 개인정보 암호화 처리 해제 방법을 안내합니다.


설정방법

  1. 내 사이트 관리자 페이지에 접속합니다. 접속방법
  2. 왼쪽 메뉴에서 [사용자 관리 > 운영진 설정]를 클릭해 이동합니다.
  3. 운영진 그룹명에 마우스 포인터를 올립니다.
  4. 톱니바퀴 아이콘이 나타나면 클릭합니다.
  5. 마우스 휠 스크롤을 움직여 세부 설정 항목으로 이동합니다.
  6. 개인정보 접근 권한(조회,검색) 옵션을 클릭합니다.

  7. 변경사항 저장 버튼을 클릭합니다.
  8. 이제 관리자 페이지 내 개인정보 마스킹이 해제된 것을 확인하실 수 있습니다.





페이지 접속 후 특정 시간이 지나면 숨어 있던 버튼이 나타나도록 제작할 수 있습니다. 이와 같은 타이머 버튼은 종종 마케팅에 활용되며, 방문자가 필수 콘텐츠를 보도록 유도하는데 사용될 수 있습니다.

이 버튼을 만들려면 코드를 사용해야 합니다. 아래 설명과 샘플 코드를 사용해 타이머 버튼을 제작해 보세요.

구현방법

  1. 디자인 모드에 접속합니다. 접속방법
  2. 왼쪽 상단의 메뉴 관리 ≡ 아이콘을 클릭해, 버튼을 삽입할 메뉴로 이동하거나 새로운 메뉴를 생성합니다. 메뉴 추가하기
  3. 왼쪽 상단의 위젯 추가 + 아이콘을 클릭하고, 코드 위젯을 추가합니다.
  4. 코드 위젯 위에 마우스 포인터를 올리고, 마우스 오른쪽 버튼을 클릭합니다.
  5. 컨텍스트 메뉴가 나오면 코드 설정을 클릭합니다.
  6. 코드 입력 칸에 아래의 코드를 복사하여 붙여넣습니다.

     <style> .hiddenBlock { display: none; }
    </style>
    <p class="hiddenBlock" style="text-align: 정렬;"> <a style="font-weight: 텍스트 두께; font-size: 텍스트 크기;" class="btn btn-primary btn-lg" href="링크 주소">버튼명</a> </p>
    <script type="text/javascript">$(document).ready(function(){setTimeout(function(){$('.hiddenBlock').show()},시간)});</script>

  7. 아래 그림과 설명을 참조하여 코드를 수정합니다.

    • 정렬: 버튼을 정렬시킬 수 있습니다. left, center, right 3가지 중 하나를 입력합니다.
    • 텍스트 두께: 버튼 텍스트의 두께를 정할 수 있습니다. normal로 바꾸면 기본으로 돌아갑니다.
    • 텍스트 크기: 버튼 텍스트의 두께를 지정합니다. bold 라고 입력하면 두껍게 작성되며, normal로 입력하면 기본으로 돌아갑니다.
    • 링크 주소: 버튼을 클릭하면 이동할 주소(URL)를 입력합니다. 예) https://wemento.kr
    • 버튼명: 버튼에 표시될 버튼 이름을 입력합니다.
    • 시간: 1000당 1초라고 생각하시면 되겠습니다. 3초 후 버튼이 나오게 하려면 3000을 입력합니다.
  8. 저장 버튼을 클릭해 코드 입력을 완료합니다.
  9. 디자인 모드 오른쪽 상단의 미리보기 아이콘을 클릭합니다.
  10. 지정한 시간이 지나면 버튼이 표시되는지 확인합니다.

  11. 문제가 없다면 디자인 모드로 돌아가 게시하기 버튼을 클릭해 적용합니다.

알림 메세지 보내기



알림 메세지를 발송하여 회원들에게 중요한 소식을 무료로 전달할 수 있습니다. 모바일 App을 설치한 사용자는 알림 메세지를 푸시 알림(Push Notification) 형식으로 실시간으로 수신할 수 있으며, 비회원도 수신이 가능합니다.

발송방법

  1. 내 사이트 관리자 페이지에 접속합니다. 
  2. 왼쪽 메뉴에서 [사용자 관리 > 메세지 보내기]를 클릭해 이동합니다.
  3. 메세지 발송 방식으로 알림을 선택합니다.

  4. 아래 그림과 설명을 참고해 메세지를 작성합니다.

    1. 발송할 회원그룹을 선택합니다.

      참고: 특정 회원에게만 알림 메세지를 발송하려면 사용자 관리 > 사용자 목록 에서 회원을 선택하고, 상단의 메세지 > 알림 을 클릭하여 개별 발송하세요.

    2. 알림 제목을 작성합니다.
    3. 알림 내용을 입력합니다.
    4. (선택 사항) 클릭 시 이동할 URL(주소)을 추가합니다.
    5. (선택 사항) 푸시 알림에 표시할 이미지를 추가합니다.
    6. (선택 사항) 발송예약 시간을 지정합니다.
  5. 보내기 버튼을 클릭해 발송합니다. *발송 후에는 취소가 불가합니다.

상품 상세페이지에서 이미지 간격 없애기 (코드, 초급)


상품 상세설명에 삽입한 이미지의 구분을 위해 약간의 간격을 두게끔 설정되어 있습니다.


하지만 연관된 이미지를 연속으로 배치하는 경우, 이 간격이 문제가 될 수 있습니다. 

이 도움말에서는 간단한 CSS 스타일 속성을 사용해 상품 상세설명에 삽입한 이미지간의 간격을 없애는 방법을 설명합니다.


적용방법

1단계: 상품 상세페이지에 코드 추가하기

  1. 디자인 모드에 접속합니다. 
  2. 왼쪽 상단의 메뉴 관리 ≡ 아이콘을 클릭합니다.
  3. 글로벌 메뉴 항목에서 상품 상세페이지 메뉴를 클릭해 이동합니다.

    중요: 쇼핑 기능을 사용 설정해 주세요. 쇼핑 기능을 활성화하지 않으면 상품 상세페이지, 마이페이지, 장바구니 메뉴가 노출되지 않습니다. 쇼핑 및 예약 사용 설정하기

  4. 왼쪽 상단의 위젯 추가 + 아이콘을 클릭합니다.
  5. 코드 위젯을 클릭합니다. (코드 위젯은 실제 방문자는 볼 수 없기 때문에 어느 곳에 있어도 무방합니다.)
  6. 코드 위젯에 마우스 포인터를 올리고, 마우스 오른쪽 버튼을 클릭합니다.
  7. 컨텍스트 메뉴가 나오면 코드 설정을 클릭합니다.

  8. 아래의 코드를 복사합니다. (단축키: CTRL + C)

    <style> .fr-view img.fr-dib {margin: 0 auto;} .fr-view img.fr-dii {margin: 0;} img.fr-dib {margin: 0;} </style>                         
  9. 코드 설정 빈 칸에 붙여넣습니다. (단축키: CTRL + V)

  10. 저장 버튼을 클릭합니다.



2단계: 상세설명 이미지 삽입하고 CSS 추가하기

  1. 내 사이트 관리자 페이지에 접속합니다. 
  2. 왼쪽 메뉴에서 [쇼핑 > 상품관리]를 클릭해 이동합니다.
  3. 상품 목록이 나오면 편집할 상품을 마우스로 클릭합니다.
  4. 상세설명 항목에서 이미지 첨부 아이콘을 클릭합니다.

    참고: 기존에 삽입한 이미지가 있다면 모두 삭제하고 다시 삽입하는 걸 추천합니다.

  5. 내 PC에서 이미지 파일을 선택해 올려줍니다.
  6. 모든 이미지가 삽입되면 텍스트 도구에서 코드보기 </> 아이콘을 클릭합니다.

  7. 이미지마다 <p> 와 </p> 태그로 감싸진 걸 확인할 수 있습니다. 첫 번째 <p> 태그의 <p  와 > 사이에 아래의 CSS 스타일 속성을 추가해 주세요.

    style="margin: 0;"

  8. <p> 태그마다 margin CSS 스타일 속성을 추가하면 아래의 그림과 같이 작성됩니다.

    참고: 상품 상세설명에 첨부한 이미지의 개수에 따라 입력해야 할 CSS 스타일 속성 개수는 달라집니다. 아래 그림은 3개 이미지에 대하여 CSS 스타일 속성을 추가한 화면입니다.

  9. 텍스트 도구에서 코드보기 </> 아이콘을 다시 클릭해 편집한 코드를 적용합니다.

    중요: 반드시 코드보기 </> 아이콘을 다시 클릭해 주세요. 다시 클릭하지 않으면 모든 코드가 편집 전으로 초기화됩니다.
  10. 문제가 없다면 저장 버튼을 클릭하고 작업을 완료합니다.


3단계: 이미지 간격 설정여부 확인하기

  1. 관리자 페이지 왼쪽 상단에 사이트 바로가기를 클릭합니다.
  2. 편집한 상품 상세페이지로 이동합니다.
  3. 상세설명에 모든 이미지가 여백 없이 표시되는지 확인합니다.


Address

서울특별시 강서구 공항대로212(퀸즈파크11), B동404

Email 

sales@wemento.kr

TEL 

1800-2142

(주)위멘토 l 506-87-00931 l 대표자 김성진 

개인정보책임 김성진 ㅣ 개인정보처리방침

통신판매업 제2022-서울강서-1096

Address          서울특별시 강서구 공항대로212(퀸즈파크11), B동404

Email               sales@wemento.kr

TEL                  1800-2142

(주)위멘토 l 506-87-00931 l 대표자 김성진 l 개인정보책임 김성진 l 개인정보처리방침

통신판매업 제2022-서울강서-1096