LogoLogo
NHN커머스 메인개발자센터
  • 운영 가이드
    • 고도몰 시작하기
      • 관리자 화면 이해하기
      • 쇼핑몰 기본정보 입력하기
      • 도메인 등록 및 연결하기
      • 결제수단 연결하기
      • 배송비 조건 등록
      • 회원에 대한 조건 입력하기
      • 쇼핑몰 약관, 이용안내 입력하기
    • 기본 디자인 알아보기
      • 쇼핑몰 기본 꾸미기
        • 스킨 꾸미기
          • 메인 꾸미기
          • 상품 페이지 꾸미기
          • 검색 페이지 꾸미기
      • 디자인 관리
        • PC
        • 모바일
      • 배너 및 팝업창 관리
        • PC
        • 모바일
      • 쇼핑몰에 영상 추가하기
        • 앱 신청하기
        • 영상 업로드하기
        • 영상 추가하기
          • 메인 비쥬얼
          • 배너
      • 디자인 향상시키기
      • 무료스킨 디자인 수정 가이드
        • 🆙마이그릭(Mygreek)
          • 🖥️Mygreek_PC 스킨 가이드
          • 📱Mygreek_Mobile 스킨 가이드
        • 🆙바람숲(BaRamSoop)
          • 🖥️BaRamSoop_PC 스킨 가이드
          • 📱BaRamSoop_Mobile 스킨 가이드
        • 🆙위유위(Weyouwe)
          • 🖥️Weyouwe_PC 스킨 가이드
          • 📱Weyouwe_Mobile 스킨 가이드
        • 🆙소나루(Sonaru)
          • 🖥️Sonaru_PC 스킨 가이드
          • 📱Sonaru_Mobile 스킨 가이드
        • 🆙메이트앤코(Mate&Co)
          • 🖥️Mate&Co_PC 스킨 가이드
          • 📱Mate&Co_Mobile 스킨 가이드
        • 🆙퍼피레드(Puppyred)
          • 🖥️Puppyred_PC 스킨 가이드
          • 📱Puppyred_Mobile 스킨 가이드
        • 🆙글랜스(Glance)
          • 🖥️Glance_PC 스킨 가이드
          • 📱Glance_Mobile 스킨 가이드
        • 🆙케이스(Case)
          • 🖥️Case_PC 스킨 가이드
          • 📱Case_Mobile 스킨 가이드
        • 🆙아뜰리에(Atelier)
          • 🖥️Atelier_PC 스킨 가이드
          • 📱Atelier_Mobile 스킨 가이드
        • 🆙매치포인트(Matchpoint)
          • 🖥️Matchpoint_PC 스킨 가이드
          • 📱Matchpoint_Mobile 스킨 가이드
        • 🆙홍삶(Honglife)
          • 🖥️Honglife_PC 스킨 가이드
          • 📱Honglife_Mobile 스킨 가이드
        • 🆙베르데(Verde)
          • 🖥️Verde_PC 스킨 가이드
          • 📱Verde_Mobile 스킨 가이드
        • 🆙뽀끼(Bbokki)
          • 🖥️Bbokki_PC 스킨 가이드
          • 📱Bbokki_Mobile 스킨 가이드
        • 🆙쉐프초이스(Chef's Choice)
          • 🖥️Chef's Choice_PC 스킨 가이드
          • 📱Chef's Choice_Mobile 스킨 가이드
        • 🆙마카룸(Macaroom)
          • 🖥️Macaroom_PC 스킨 가이드
          • 📱Macaroom_Mobile 스킨 가이드
        • 🆙블리스(Bliss)
          • 🖥️Bliss_PC 스킨 가이드
          • 📱Bliss_Mobile 스킨 가이드
        • 🆙로스트리브(Roastrive)
          • 🖥️Roastrive_PC 스킨 가이드
          • 📱Roastrive_Mobile 스킨 가이드
        • 🆙띵(tting)
          • 🖥️tting_PC 스킨 가이드
          • 📱tting_Mobile 스킨 가이드
        • 🆙비키(Biki)
          • 🖥️Biki_PC 스킨 가이드
          • 📱Biki_Mobile 스킨 가이드
        • 🆙하나노떼(Hahanotte)
          • 🖥️Hahanotte_PC 스킨 가이드
          • 📱Hahanotte_Mobile 스킨 가이드
        • 🆙밥도둑
        • 🆙마이 플랜트(My Plant)
        • 🆙어반(URBAN)
        • 🆙어라운드(AROUND)
        • 럭스(Luxe)
        • 벤세르(VENCER)
        • 트렌디(TRENDY)
        • 해피애니멀(Happy Animall)
        • 니모(NIMO)
        • 클레마티스(clematis)
        • 어썸(Awesome)
        • 마임(MIME)
          • 🖥️MIME_PC 스킨 가이드
          • 📱MIME_Mobile 스킨 가이드
        • 투에이엠(2AM)
          • 🖥️2AM_PC 스킨 가이드
          • 📱2AM_Mobile 스킨 가이드
        • 해피키즈(Happy Kids)
          • 🖥️Happy Kids_PC 스킨 가이드
          • 📱Happy Kids_Mobile 스킨 가이드
        • 더 리빙(THE LIVING)
          • 🖥️THE LIVING_PC 스킨 가이드
          • 📱THE LIVING_Mobile 스킨 가이드
        • 퓨어(PURE)
          • 🖥️PURE_PC 스킨 가이드
          • 📱PURE_Mobile 스킨 가이드
        • 프레쉬(FRESH#)
          • 🖥️Fresh#_PC 스킨 가이드
          • 📱Fresh#_Mobile 스킨 가이드
        • 모먼트(Moment)
          • 🖥️Moment_PC 스킨 가이드
          • 📱Moment_Mobile 스킨 가이드
        • 스토리지(Storyg)
          • 🖥️Storyg_PC 스킨 가이드
          • 📱Storyg_Mobile 스킨 가이드
    • 상품 기본 관리
      • 상품 등록하기
      • 상품 진열하기
    • 주문/배송처리 알아보기
      • 주문/배송처리 과정 및 정책
    • 검색엔진 등록하기
      • 네이버 사이트 등록하기
      • 구글 사이트 등록하기
  • FAQ
    • 쇼핑몰 운영
      • 쇼핑몰 연장/복구
      • 쇼핑몰 해지
      • 소유권 이전
      • 트래픽
      • 디스크(스토리지) 용량 추가
      • 도메인 관리
        • 네임 서버
      • 패치&업그레이드
        • [23.12.06] 에디터 보안패치 이슈 케이스
        • [24.02.21] 상품등록/수정 성능(속도) 개선 건 패치 범위 안내
          • 자주 묻는 질문(FAQ)
      • 전자결제서비스
      • 이벤트 모니터링
      • 디자인센터
      • 튜닝센터
      • 쇼핑몰 기본정보
      • 부가서비스
    • 어드민 기능
      • 기본설정
        • 기본정책
        • 관리정책
        • 배송정책
        • 주문정책
        • 결제정책
        • 본인확인 인증서비스
        • 해외상점
        • 보안서버 관리
      • 상품관리
        • 상품 분류 관리
        • 상품 노출 형태 관리
      • 주문/배송
        • 주문관리
        • 취소/교환/반품/환불
        • 현금영수증
        • 세금계산서
        • 택배연동 서비스
        • 자동입금확인 서비스
      • 회원
        • 회원관리
        • 마일리지/예치금
        • 메일관리
        • SMS 관리
        • 간편로그인
          • 페이코 로그인 설정
          • 네이버 로그인 설정
          • 카카오 로그인 설정
          • 위메프 로그인 설정
        • 카카오 알림톡
        • CRM 그룹 관리
      • 게시판
      • 프로모션
        • 쿠폰관리
        • 페이퍼 쿠폰관리
        • 타임세일
        • SNS 관리
      • 디자인
        • 디자인 설정
        • 배너 관리
        • 팝업창 관리
      • 공급사
    • 신규창업
    • 쇼핑몰 이전
    • 커머스 회원/결제
  • 고도몰 성장 지원
  • 클래스
  • 고도몰 매뉴얼
  • NHN커머스 도움말
Powered by GitBook
LogoLogo

NHN COMMERCE

  • 공지사항
  • 회사소개

Partners

  • 서비스 제휴문의
  • 셀러어드민
  • 디자인 파트너

Developers

  • 스토어

©NHN COMMERCE Corp. All rights reserved.

On this page
  • Step 1. 디자인 스킨 및 디자인 관리 구성
  • 1-1. 사용중 디자인 스킨 or 작업중 디자인 스킨 확인
  • 1-2. 디자인 페이지 수정
  • Step 2. 무료 스킨 추가하기
  • 2-1. 무료스킨 추가 방법
  • Step 3. 디자인 스킨 레이아웃 이해 및 편집하기
  • 3-1. 레이아웃 설정과 디자인 페이지 설정

Was this helpful?

  1. 운영 가이드
  2. 기본 디자인 알아보기
  3. 디자인 관리

PC

Previous디자인 관리Next모바일

Last updated 6 months ago

Was this helpful?

Step 1. 디자인 스킨 및 디자인 관리 구성

  • 위치 : 디자인 > 디자인 설정 > 디자인 스킨 리스트

  • 기능설명 : 현재 쇼핑몰 화면에 적용 중인 디자인 스킨과 보유스킨 확인 및 적용스킨과 작업스킨을 설정할 수 있습니다.

1-1. 사용중 디자인 스킨 or 작업중 디자인 스킨 확인

  1. 고도몰의 경우, 여러 개의 다양한 디자인 스킨을 보유할 수 있으며, 그 중 원하는 스킨을 선택하여 쇼핑몰 디자인으로 적용할 수 있습니다.

    • 사용중인 스킨으로 설정된 스킨이 쇼핑몰 화면에서 실제 고객들에게 노출되고 있는 디자인 스킨입니다.

  2. 보유하고 있는 스킨 중, 디자인 작업을 할 수 있는 스킨을 선택할 수 있습니다.

    • 현재 사용 중인 스킨이 아닌 다른 스킨을 작업 스킨으로 설정하면, 쇼핑몰에 노출되지 않고 디자인 작업을 진행할 수 있습니다.

1-2. 디자인 페이지 수정

  1. 현재 작업중인 스킨에 대하여 모든 페이지를 수정할 수 있습니다.

    • 수정하고자 하는 페이지를 선택하여 페이지내 HTML를 직접 수정하실 수 있습니다.

    • 삭제시에는 복구가 불가능하며, 반드시 사용중인 스킨이 아닌 작업중인 스킨을 선택하여 작업하시기 바랍니다.

  2. 기존 페이지 외에 새로운 페이지를 추가하여 작업하실 수 있습니다.

  3. 쇼핑몰에서 사용하는 이미지들에 대한 FTP 접근이 가능합니다.


Step 2. 무료 스킨 추가하기

2-1. 무료스킨 추가 방법

  1. 디자인 스킨 리스트 화면에서의 정가운데 무료스킨 배너를 클릭하면 무료 스킨 제공화면으로 이동됩니다.

    • PC 용과 모바일용 스킨으로 분리되어 있으므로, 모바일용 스킨을 원하실 경우에는 모바일샵용 스킨을 선택하세요.

  2. 무료스킨 제공화면에서 추가를 한 스킨은 보유 스킨 리스트에서 확인이 가능합니다.


Step 3. 디자인 스킨 레이아웃 이해 및 편집하기

  • 위치 : 디자인 > 디자인 설정 > 디자인 스킨 레이아웃 설정

  • 기능설명 : 현재 쇼핑몰 화면에 적용 중인 디자인 스킨과 보유스킨 확인 및 적용스킨과 작업스킨을 설정할 수 있습니다.

3-1. 레이아웃 설정과 디자인 페이지 설정

  1. 쇼핑몰 레이아웃에 따라 상단 레이아웃 / 상단 / 측면 / 본문 / 하단 / 스크롤 / 하단 레이아웃 영역으로 구성되어 있으며, 각 디자인 영역에 대한 편집이 가능합니다.

    • 상단 및 측면, 하단 디자인의 경우, 디자인 페이지를 다수 구성할 수 있으며 셀렉트박스를 선택하여 편집이 가능합니다.

  2. 측면디자인의 위치를 본문을 기준으로 왼쪽 혹은 오른쪽으로 변경 가능합니다.

  3. 쇼핑몰 화면의 배경 색상과 배경이미지를 적용할 수 있습니다.

위치 : 디자인 > 디자인 설정 > 디자인 스킨 리스트 &

제공화면으로 이동한 후, 고도몰을 지원하는 마음에 드는 스킨을 추가하시면 됩니다.

무료스킨 리스트
무료스킨
디자인 > 디자인 설정 > 디자인 스킨 리스트
디자인 > 디자인 설정 > 디자인 스킨 리스트
디자인 > 디자인 설정 > 디자인 스킨 리스트
디자인 > 디자인 설정 > 디자인 스킨 레이아웃 설정