외부 팝업 기능(코드앤버터) 활용하기

코드앤버터를 통하여 확장된 팝업 기능을 활용해 보세요.

1. 코드앤버터는?

코드앤버터(CODE N BUTTER) 서비스를 이용하여 상점 내 다양한 템플릿의 팝업을 쉽게 설정할 수 있습니다.

코드앤버터의 장점

팝업을 노출할 페이지를 선택할 수 있습니다.
팝업 창을 2개 이상 노출할 수 있습니다.
모바일과 데스크탑에 노출할 팝업을 따로 설정할 수 있습니다.
팝업 디자인 템플릿이 제공되어 쉽게 디자인할 수 있습니다.

2. 코드앤버터 이용하기

코드앤버터 서비스 이용에 대한 자세한 사항은 코드앤버터로 문의해 주시기 바랍니다.

2-1. 코드앤버터로 팝업 만들기

Step 1. 코드앤버터 가입 후 웹사이트를 추가해 주세요.

Step 2. [팝업 만들기]를 클릭하고 마음에 드는 템플릿 선택해 주세요.

Step 3. 모바일/데스크톱 버전의 디자인을 자유롭게 수정해 주세요.

Step 4. [공개 설정]을 클릭하여 미리 보기 후 공개해 주세요.

공개 후 스크립트 추가 안내 팝업이 노출되면 [연동하기]를 클릭하여 아래의 2-2. 코드앤버터 연동하기 과정을 이어서 진행해 주세요.

2-2. 코드앤버터 연동하기

Step 1. 스크립트 설치의 수동 설치 `HTML`의 코드를 복사해 주세요.

팝업을 통하여 스크립트 설치로 바로 이동하지 못하였다면 [코드앤버터 > 웹 사이트 설정 > 스크립트 설치]의 경로로 스크립트 확인이 가능합니다.

Step 2. [식스샵 > 애드온]에서 코드 삽입 애드온을 추가해 주세요.

Step 3. [식스샵 > 애드온 > 코드삽입] 공통 <head>영역에 복사한 스크립트를 붙여 넣고 저장하면 됩니다.

변경 사항을 저장하면 팝업 연동이 완료되며 상점 내 모든 페이지에 팝업이 노출됩니다. 상점 내 일부 페이지에서만 팝업을 노출하고 싶다면 아래의 2-3. 일부 페이지에만 팝업 노출하기 과정을 이어서 진행해 주세요.

2-3. 일부 페이지에만 팝업 노출하기

Step 1. [코드앤버터 > 추가한 팝업 선택 > 노출 페이지]를 클릭해 주세요.

Step 2. [일부 페이지] 클릭하고 팝업을 노출할 페이지의 하위 주소 입력 후 저장하면 됩니다.

대표 도메인 주소를 제외한 '/하위주소' 형태로만 입력해 주세요.

페이지별 하위 주소 확인하는 방법

대표 도메인으로 접속하여 팝업을 노출하고 싶은 페이지로 이동 후 인터넷 주소창에서 하위 주소를 확인할 수 있습니다.

하위 주소 없는 대표 도메인(홈) 접속 시에만 팝업 노출하는 방법

페이지 설정 우측 [+ 추가] 클릭 후 [홈]을 추가하신 후 일치로 설정하고 저장하면 됩니다.

코드앤버터 서비스 이용에 대한 자세한 사항은 코드앤버터로 문의해 주시기 바랍니다.

Previous외부 설문 기능(구글 폼) 활용하기 Next업데이트 뉴스

Last updated 6 months ago

외부 팝업 기능(코드앤버터) 활용하기

목차

1. 코드앤버터는?

코드앤버터의 장점

2. 코드앤버터 이용하기

2-1. 코드앤버터로 팝업 만들기

Step 1. 코드앤버터 가입 후 웹사이트를 추가해 주세요.

Step 2. [팝업 만들기]를 클릭하고 마음에 드는 템플릿 선택해 주세요.

Step 3. 모바일/데스크톱 버전의 디자인을 자유롭게 수정해 주세요.

Step 4. [공개 설정]을 클릭하여 미리 보기 후 공개해 주세요.

2-2. 코드앤버터 연동하기

Step 1. 스크립트 설치의 수동 설치 `HTML`의 코드를 복사해 주세요.

Step 2. [식스샵 > 애드온]에서 코드 삽입 애드온을 추가해 주세요.

Step 3. [식스샵 > 애드온 > 코드삽입] 공통 <head>영역에 복사한 스크립트를 붙여 넣고 저장하면 됩니다.

2-3. 일부 페이지에만 팝업 노출하기

Step 1. [코드앤버터 > 추가한 팝업 선택 > 노출 페이지]를 클릭해 주세요.

Step 2. [일부 페이지] 클릭하고 팝업을 노출할 페이지의 하위 주소 입력 후 저장하면 됩니다.

목차

1. 코드앤버터는?

코드앤버터의 장점

2. 코드앤버터 이용하기

2-1. 코드앤버터로 팝업 만들기

Step 1. 코드앤버터 가입 후 웹사이트를 추가해 주세요.

Step 2. [팝업 만들기]를 클릭하고 마음에 드는 템플릿 선택해 주세요.

Step 3. 모바일/데스크톱 버전의 디자인을 자유롭게 수정해 주세요.

Step 4. [공개 설정]을 클릭하여 미리 보기 후 공개해 주세요.

2-2. 코드앤버터 연동하기

Step 1. 스크립트 설치의 수동 설치 `HTML`의 코드를 복사해 주세요.

Step 2. [식스샵 > 애드온]에서 코드 삽입 애드온을 추가해 주세요.

Step 3. [식스샵 > 애드온 > 코드삽입] 공통 <head>영역에 복사한 스크립트를 붙여 넣고 저장하면 됩니다.

2-3. 일부 페이지에만 팝업 노출하기

Step 1. [코드앤버터 > 추가한 팝업 선택 > 노출 페이지]를 클릭해 주세요.

Step 2. [일부 페이지] 클릭하고 팝업을 노출할 페이지의 하위 주소 입력 후 저장하면 됩니다.

목차

1. 코드앤버터는?

코드앤버터의 장점

2. 코드앤버터 이용하기

2-1. 코드앤버터로 팝업 만들기

Step 1. 코드앤버터 가입 후 웹사이트를 추가해 주세요.

Step 2. [팝업 만들기]를 클릭하고 마음에 드는 템플릿 선택해 주세요.

Step 3. 모바일/데스크톱 버전의 디자인을 자유롭게 수정해 주세요.

Step 4. [공개 설정]을 클릭하여 미리 보기 후 공개해 주세요.

2-2. 코드앤버터 연동하기

Step 1. 스크립트 설치의 수동 설치 HTML의 코드를 복사해 주세요.

Step 2. [식스샵 > 애드온]에서 코드 삽입 애드온을 추가해 주세요.

Step 3. [식스샵 > 애드온 > 코드삽입] 공통 <head>영역에 복사한 스크립트를 붙여 넣고 저장하면 됩니다.

2-3. 일부 페이지에만 팝업 노출하기

Step 1. [코드앤버터 > 추가한 팝업 선택 > 노출 페이지]를 클릭해 주세요.

Step 2. [일부 페이지] 클릭하고 팝업을 노출할 페이지의 하위 주소 입력 후 저장하면 됩니다.

목차

1. 코드앤버터는?

코드앤버터의 장점

2. 코드앤버터 이용하기

2-1. 코드앤버터로 팝업 만들기

Step 1. 코드앤버터 가입 후 웹사이트를 추가해 주세요.

Step 2. [팝업 만들기]를 클릭하고 마음에 드는 템플릿 선택해 주세요.

Step 3. 모바일/데스크톱 버전의 디자인을 자유롭게 수정해 주세요.

Step 4. [공개 설정]을 클릭하여 미리 보기 후 공개해 주세요.

2-2. 코드앤버터 연동하기

Step 1. 스크립트 설치의 수동 설치 HTML의 코드를 복사해 주세요.

Step 2. [식스샵 > 애드온]에서 코드 삽입 애드온을 추가해 주세요.

Step 3. [식스샵 > 애드온 > 코드삽입] 공통 <head>영역에 복사한 스크립트를 붙여 넣고 저장하면 됩니다.

2-3. 일부 페이지에만 팝업 노출하기

Step 1. [코드앤버터 > 추가한 팝업 선택 > 노출 페이지]를 클릭해 주세요.

Step 2. [일부 페이지] 클릭하고 팝업을 노출할 페이지의 하위 주소 입력 후 저장하면 됩니다.

Step 1. 스크립트 설치의 수동 설치 `HTML`의 코드를 복사해 주세요.

Step 1. 스크립트 설치의 수동 설치 `HTML`의 코드를 복사해 주세요.