로컬에서 테마 변경 내용 미리 보기

Guide에서 테마의 파일을 내보내고 오프라인에서 선호하는 편집기로 파일에 작업을 수행할 수 있습니다. 변경 내용을 미리 보고 싶을 때마다 파일을 압축하여 Guide에 가져오지 않으려면, Zendesk 앱 툴(ZAT)을 사용하여 로컬에서 웹 브라우저로 각 변경 내용을 미리 볼 수 있습니다. 변경 내용을 미리 보려면 데스크톱 편집기에 테마 파일을 저장하고 브라우저에서 페이지를 새로 고치기만 하면 됩니다. 예:

ZAT는 개발자 툴 모음으로 사용자 컴퓨터에서 로컬로 실행되는 웹 서버인 Sinatra를 포함합니다. 미리 보기 모드를 시작하면 백그라운에서 프로세스가 실행됩니다. 이미지 아래쪽에서 명령줄 인터페이스를 볼 수 있습니다.

이 문서에서 다루는 주제는 다음과 같습니다.

• 로컬 테마 미리 보기 설정하기
• 로컬 테마 미리 보기 시작하기
• 변경 내용 미리 보기

로컬 테마 미리 보기 설정하기

로컬 테마 미리 보기를 설정하려면 다음과 같이 하세요.

1. 관리 > 채널 > API로 이동하여 Zendesk Support 계정에서 API 액세스를 사용 설정합니다.
2. Zendesk 앱 툴(ZAT)을 설치합니다.

   개발 헬프 센터에서 Zendesk 앱 툴 설치하기 및 사용하기를 참조하세요.

3. 이전에 Zendesk 앱을 만들기 위해 ZAT를 설치했다면 명령줄 인터페이스에 다음 명령을 실행하여 ZAT를 업데이트합니다.

   $ gem update zendesk_apps_tools

ZAT를 설치하고 사용하려면 명령줄 인터페이스(CLI)가 필요합니다. macOS에서는 애플리케이션/유틸리티 폴더에 있는 터미널을 사용하면 됩니다. Windows에서는 명령 프롬프트 또는 Powershell을 사용하면 됩니다. Windows 10 사용자의 경우 개발자 친화적인 CLI인 Bash shell을 설치하고 사용할 수 있습니다. Windows 10에서 Bash shell 설정하기를 참조하세요.

로컬 테마 미리 보기 시작하기

컴퓨터에서 테마 파일 작업을 시작하기 전에 로컬 테마 미리 보기를 시작해야 합니다.

로컬 테마 미리 보기를 시작하려면 다음과 같이 하세요.

1. 명령줄 인터페이스에서 내보내고 압축을 푼 테마 파일이 포함된 폴더를 찾습니다.

   cd 명령어(디렉토리 변경용)를 사용하여 하위 폴더로 이동합니다. 예:

   $ cd guide_themes/newlook_theme

   디렉토리 하나 위로 돌아가려면 cd 뒤에 공백과 두 개의 마침표가 있는 명령어를 사용합니다. 예:

   cd ..

2. 다음 명령을 실행합니다.

   $ zat theme preview 

3. 요청에 따라 Zendesk Support 하위 도메인, Zendesk Guide에 로그인할 때 사용하는 이메일 및 비밀번호를 입력합니다.

   

   다음에 미리 보기 모드를 시작할 때에는 비밀번호만 입력하면 되도록 하위 도메인과 이메일은 테마의 폴더에 있는 .zat라는 이름의 텍스트 파일에 저장됩니다. 사용자 이름 또는 비밀번호를 입력할 때 실수한 경우 .zat 파일을 삭제하고 다시 시작합니다. macOS에서는 기본적으로 마침표가 앞에 붙는 파일을 숨깁니다. osxdaily.com 웹사이트에서 Mac OS X에서 숨겨진 파일 보기를 참조하세요.

   통합 인증(SSO)을 사용하여 Guide에 로그인하는 경우(Google 또는 Microsoft 자격 증명을 사용하는 것처럼) Support 관리자 인터페이스에서 가져올 수 있는 API 토큰을 사용하여 로그인할 수 있습니다. REST API 문서에서 API 토큰을 참조하세요. ZAT에서 로그인 요청을 하면 사용자 이름으로 {your_email}/token을 입력합니다. 여기서 "/token"은 글자 그대로 "/token"이라고 입력하면 됩니다. 실제 API 토큰을 비밀번호로 사용합니다. 예:

   Enter your username: [e-mail]/token
   Enter your password: e8Pvy0pvGzE8meUQxWgjIYkjr

   성공적으로 로그인하면 미리 보기 모드가 시작되고 백그라운드에서 실행됩니다.

   

4. “Ready”로 출력된 URL을 복사하여 브라우저에 붙여넣습니다.

   이 예에서 URL은 https://nadosolutions.zendesk.com/hc/admin/local_preview/start입니다.

   로그인한 후에는 서식이 없는 페이지가 로드됩니다. 최신 브라우저의 경우 특정 로컬 파일(혼합 콘텐츠라고도 함)을 페이지에 로드하지 못하게 차단하는 보안 기능이 있습니다. 다음 단계에 따라 Chrome 및 Firefox에서 이 기능을 사용 중지할 수 있습니다.

5. Chrome 또는 Firefox의 주소 표시줄에서 방패 아이콘을 클릭한 후, 안전하지 않은 스크립트 로드(Chrome) 또는 페이지 보호 사용 중지(Firefox)에 동의합니다. Firefox의 경우 주소 표시줄 왼쪽에 방패 아이콘이 있습니다.

   

   참고: Safari에는 보호 사용 중지 옵션이 없습니다. 미리 보기를 위해서는 Chrome 또는 Firefox를 사용해야 합니다.

   형식이 올바른 페이지를 자동으로 불러옵니다. 편집기에서 테마 파일 편집을 시작하고 로컬 브라우저에서 변경 내용을 미리 볼 수 있습니다.

변경 내용 미리 보기

테마 미리 보기 모드를 시작하면 선호하는 편집기에서 테마 파일 작업을 수행할 수 있습니다. 반복 작업을 통해 테마를 개발하고 테스트합니다. 예를 들어 JavaScript에서 일부를 변경하고, 변경 내용을 저장한 후, 브라우저 페이지를 새로 고쳐서 테스트하는 작업을 반복합니다.

변경 내용을 미리 보려면 다음과 같이 하세요.

1. 편집기에서 편집한 파일을 저장합니다.
2. 브라우저에서 페이지를 새로 고칩니다.

그날의 작업을 마치려면, 다음 방법 중 하나를 사용하여 미리 보기 모드를 중단할 수 있습니다.

• 브라우저에서 미리 보기 페이지 맨 위의 "여기를 클릭하여 종료하기" 링크를 클릭합니다.
• 명령줄 인터페이스로 가서 Control+C 키를 누릅니다.