現在のプランを確認

Suite Growth以上のプランで利用可能すべてのGuideプランで利用可能

任意のコードエディタでローカルにテーマを作成し、Webブラウザで変更の結果をリアルタイムでプレビューすることができます。変更の結果をプレビューするために、毎回ファイルをGuideにアップロードする必要はありません。ファイルをローカルに保存するたびに、コンピュータのバックグラウンド処理で変更がアップロードされます。

以下に例を示します。

この記事では、次のトピックについて説明します。

  • テーマのローカルプレビューを設定する
  • テーマのローカルプレビューを開始する
  • 変更結果をプレビューする

テーマのローカルプレビューを設定する

ローカルテーマのプレビューを設定するには、テーマファイルをダウンロードし、アカウントでAPIアクセスを有効にし、、Zendesk Command Line Interface（ZCLI）をコンピュータにインストールします。ZCLIを使用すると、ローカルテーマのプレビューが可能になります。

テーマのローカルプレビューを設定するには

  1. Guideからテーマファイルをダウンロードし、作業フォルダに解凍します。

    詳しくは「ヘルプセンターのテーマをダウンロードする」を参照してください。

  2. ZendeskアカウントでAPIアクセスを有効にしてください（有効にしていない場合）。

    管理センターで、サイドバーの「 アプリおよびインテグレーション」をクリックし、「API」>「Zendesk API」を選択します。

  3. ZCLIをインストールします。手順については、Zendeskの開発者ドキュメントの「Installing and updating ZCLI」を参照してください。

テーマのローカルプレビューを開始する

コンピュータ上でテーマファイルの編集を開始する前に、テーマのローカルプレビューを開始する必要があります。

テーマのローカルプレビューを開始するには

  1. コンピューターのコマンドラインターミナルで、ダウンロードして解凍したテーマファイルが格納されているフォルダに移動します。以下に例を示します。
    cd guide_themes/newlook_theme
  2. テーマをダウンロードしたZendeskアカウントにサインインします。
    zcli login -i

    プロンプトが表示されたら、サブドメイン、メールアドレス、パスワードを入力します。

    アカウントの標準のZendeskサブドメインを使用してサインインします。ホストマッピング済みのサブドメインは使用しないでください。

    Zendeskへのサインインにシングルサインオン（SSO）を使用している場合は、APIトークンを使用してサインインすることができます。ユーザー名に「your_email/token」と入力します。ここで「/token」はそのまま「/token」と入力してください。パスワードにはAPIトークンを指定します。以下に例を示します。
    Email: jdoe@example.com/token
Password: e8Pvy0pvGzE8meUQxWgjIYkjr
  3. ローカルプレビューのバックグラウンド処理を開始します。
    zcli themes:preview

    このZCLIコマンドにより、ローカルプレビューが開始され、プレビューモードのローカルテーマがヘルプセンターにアップロードされます。ローカルでファイルに加えた変更は、プレビューモードでテーマに反映されます。

  4. ReadyのURLをコピーし、ChromeやFirefoxなどのWebブラウザに貼り付けます。

    ブラウザで、HTTPとHTTPSの混在コンテンツが許容されている必要があります。Safariは混在コンテンツをサポートしていないため、ローカルでテーマをプレビューすることはできません。

    ReadyのURLは、「https://yoursubdomain.zendesk.com/hc/admin/local_preview/start」のように表示されます。

ZCLIのpreviewコマンドの詳細については、GitHubのzcli themesを参照してください。

変更結果をプレビューする

ZCLIでテーマをプレビューモードでヘルプセンターにアップロードした後、お気に入りのコードエディタでローカルにテーマファイルを操作し、ブラウザで変更をプレビューすることができます。テーマの開発とテストは、繰り返しの作業です。たとえば、ファイルに変更を加えたら、そのファイルを保存し、ブラウザで変更を確認します。変更した内容に問題が見つかったら、他の変更を加える前に、その問題を修正します。

変更結果をプレビューするには

  1. 編集したファイルをコードエディタで保存します。
  2. テーマに加えた変更をブラウザのプレビューモードで確認します。

ファイルをローカルに保存すると、テーマはブラウザで自動的に再読み込みされます。ページを更新する必要はありません。

この自動再読み込みを無効にするZCLLオプションがあります。詳しくは、GitHubのzcli themesを参照してください。

1日の作業が終わったら、次のいずれかの方法でプレビューモードを停止できます。

  • ZCLIを実行しているターミナルセッションで、Ctrl+Cキーを押します。
  • ブラウザで「https://yoursubdomain.zendesk.com/hc/admin/local_preview/stop」を開きます。yoursubdomeinには実際のサブドメインを入力します。
  • ブラウザのテーマプレビューページの上部にある、「プレビューを閉じる」リンクをクリックします。
Powered by Zendesk