Zendeskのブランドロゴとファビコンをカスタマイズする方法

Stevia Putri
Written by

Stevia Putri

Reviewed by

Stanley Nicholas

Last edited 2026 2月 27

Expert Verified

Zendeskのブランドロゴとファビコンをカスタマイズする方法のバナー画像

「Zendesk(ゼンデスク)のブランドロゴとファビコン」を検索すると、ダウンロードする公式のZendeskブランドアセットを探しているか、Zendeskヘルプセンターに独自のブランディングを追加する方法を探しているかのどちらかでしょう。このガイドでは、両方について説明します。

プレスリリース用にZendeskの公式ロゴが必要な場合でも、会社のブランディングでヘルプセンターをカスタマイズしたい場合でも、知っておくべきことはすべてここにあります。

必要なもの

Zendeskのブランディングをカスタマイズする前に、次のアイテムを集めてください。

  • Zendeskアカウントへの管理者アクセス(SupportまたはGuideの管理者権限)
  • PNG、JPG、またはSVG形式の会社ロゴ
  • ファビコンファイル(ICOまたはPNG、正方形形式)
  • ブランドカラーの16進数コード
  • セットアップを完了するための約15〜20分

Zendeskのブランディング設定に必要なアイテムのチェックリスト
Zendeskのブランディング設定に必要なアイテムのチェックリスト

Zendeskのブランドロゴとファビコンをカスタマイズする方法

ステップ1:ブランディング設定にアクセスする

ブランディング設定の場所は、カスタマイズするものによって異なります。

ヘルプセンター(顧客向けのナレッジベース)の場合:

  1. Guide管理に移動します(歯車アイコンをクリック)。
  2. サイドバーでデザインをカスタマイズを選択します。
  3. 編集するテーマのカスタマイズをクリックします。
  4. 設定パネルでブランドセクションを選択します。

Supportインターフェース(エージェントワークスペース)の場合:

  1. 管理センターに移動します。
  2. サイドバーでアカウントをクリックします。
  3. 外観 > ブランディングを選択します。

簡単に言うと、ヘルプセンターのブランディングは顧客に見えるものに影響し、Supportインターフェースのブランディングはより制限されており、主にエージェントがブラウザータブに表示されるファビコンを制御します。

ブランディングのカスタマイズオプションを備えたZendesk管理設定パネル
ブランディングのカスタマイズオプションを備えたZendesk管理設定パネル

ステップ2:ロゴをアップロードする

ブランディング設定に入ったら、ロゴのアップロードは簡単です。

ロゴセクションの置換をクリックし、画像ファイルを選択します。システムはアスペクト比を維持しながら画像を自動的に拡大縮小しますが、適切な寸法から始めるのに役立ちます。

推奨されるロゴの仕様:

仕様
推奨サイズ200px x 50px
最大高さ(コペンハーゲンテーマ)37px
背景透明またはヘッダーの色と一致
サポートされている形式PNG、JPG、SVG

ロゴが推奨サイズを超える場合、Zendeskは自動的に縮小します。画像の背景は、最もクリーンな外観にするために、透明にするか、ヘッダーの背景色と一致させる必要があります。

結論は?透明な背景を持つ水平方向のロゴが最適です。

ステップ3:ファビコンを追加する

ファビコンは、ブラウザータブ、ブックマーク、検索結果に表示される小さなアイコンです。ヘルプセンターをよりプロフェッショナルに見せる小さなディテールです。

重要な制限事項:Zendeskは、ファビコンとして.icoおよび.jpg形式のみをサポートしています。SVGファイルはファビコンではサポートされていません。

ファビコンを追加するには:

  1. ファビコンセクションで、置換をクリックします。
  2. ファビコンファイルを選択します。
  3. ファビコンは正方形の画像である必要があります。

推奨されるファビコンの仕様:

仕様
サポートされている形式.ico、.jpg
サポートされていません.svg
推奨される形状正方形
例のサイズ20x20または32x32ピクセル

覚えておくべき重要なことは、シンプルさです。ファビコンは非常に小さいサイズで表示されるため、シンプルで認識しやすいものを選択してください。ロゴの簡略化されたバージョン、またはブランドのイニシャルのみがうまく機能します。

ステップ4:色とフォントをカスタマイズする

Zendeskでは、ブランドに合わせて5つの色のカテゴリをカスタマイズできます。

  1. ブランドカラー - 主要なアクセントカラー
  2. ブランドテキストカラー - ブランドカラーに表示されるテキスト
  3. テキストカラー - 一般的な本文
  4. リンクカラー - 全体のハイパーリンクの色
  5. 背景色 - ページの背景

フォントの場合、Zendeskの組み込みフォントライブラリから見出しと本文に個別の書体を選択できます。カスタムフォントが必要な場合は、テーマのコードを直接編集する必要があります(すべてのプランで利用できるわけではありません)。

**プロのヒント:**カラーピッカーを使用して、視覚的に一致させるのではなく、正確なブランドの16進数コードを入力します。これにより、他のブランド資料との一貫性が確保されます。

ステップ5:変更を公開する

ロゴ、ファビコンをアップロードし、色を設定したら:

  1. 公開をクリックして、変更をライブヘルプセンターに適用します。
  2. 戻るをクリックして、テーマページに戻ります。
  3. ブラウザでヘルプセンターを表示して、ブランディングをテストします。

変更は通常すぐに表示されますが、更新を表示するには、ブラウザのキャッシュをクリアするか、シークレットウィンドウを試す必要がある場合があります。

形式ガイド:適切なファイルタイプを選択する

どのファイル形式を使用すればよいかわからない場合は、簡単な比較を次に示します。

ロゴファイル形式

形式最適長所短所
SVGWeb、スケーラブルなグラフィックス無限のスケーリング、小さなファイルサイズファビコンではサポートされていません
PNG透明度のあるデジタル透明度のサポート、幅広い互換性SVGよりもファイルサイズが大きい
JPG写真、透明度不要小さなファイルサイズ、普遍的なサポート透明度なし

ファビコンの推奨事項

ユースケース推奨される形式サイズ
ブラウザータブ.icoまたは.png16x16、32x32
Retinaディスプレイ.png64x64
iOSホーム画面.png180x180
Android.png192x192

ほとんどのZendeskユーザーにとって、透明な背景を持つPNGロゴとICOまたはPNGファビコンは、すべての基本をカバーしています。

一般的な問題のトラブルシューティング

明確な指示があっても、物事が計画どおりに進むとは限りません。一般的なブランディングの問題に対する解決策を次に示します。

ファビコンが表示されない

  • ブラウザのキャッシュをクリアします(Ctrl + Shift + RまたはCmd + Shift + R)。
  • シークレット/プライベートウィンドウで表示してみてください。
  • ファビコンが.icoまたは.jpg形式(SVGではない)であることを確認してください。

ロゴがぼやけていたり、引き伸ばされて表示される

  • より高い解像度の画像(少なくとも幅400px)から始めます。
  • ロゴの背景が透明であることを確認してください。
  • 元の画像がすでに圧縮されているか、低品質ではないことを確認してください。

色の変更が適用されない

  • 変更を加えた後、公開をクリックしたことを確認してください。
  • 一部の色は特定のテーマ要素にのみ影響します。
  • ブラウザのキャッシュを更新してみてください。

モバイル表示の問題

  • ブラウザのサイズ変更だけでなく、実際のモバイルデバイスでテストします。
  • ロゴが小さいサイズで読みやすいことを確認してください。
  • 色がさまざまな画面タイプでどのように表示されるかを検討してください。

一般的なブランディングの問題のトラブルシューティングのための決定木
一般的なブランディングの問題のトラブルシューティングのための決定木

Zendeskのブランディングのベストプラクティス

Zendeskの実装が成功するために何が機能するかに基づいて:

  • **シンプルに保ちます。**ロゴは小さいサイズでも認識できる必要があります。
  • **一貫性を維持します。**メインWebサイトと同じ色、フォント、スタイルを使用します。
  • **どこでもテストします。**デスクトップ、モバイル、およびさまざまなブラウザーでブランディングを確認します。
  • **アクセシビリティを考慮します。**テキストと背景色の間に十分なコントラストがあることを確認します。
  • **ダークモードを計画します。**顧客がダークモードブラウザーを使用している場合は、ブランディングがどのように表示されるかをテストします。

専門家の助けが必要ですか?Dizianaは、ロゴとファビコンの実装、カラースキーム、および90日間のサポートを含むZendeskブランディングサービスを提供しています

公式のZendeskブランドアセットの入手先

プレスリリース、パートナーシップ発表、または統合リストにZendeskの公式ロゴが必要な場合:

  • Brandfetchは、公式のロゴをSVG、PNG、およびベクター形式で、公式のブランドカラー情報とともに提供します。
  • **Wikimedia Commons**は、パブリックドメインで使用するためのZendeskロゴSVGファイルをホストしています。
  • Icon-Iconsのようなアイコンリポジトリは、ダウンロード可能なファビコンファイルを提供しています。

Zendeskの公式ブランドカラーは次のとおりです。

16進数コード
Sulu(プライマリーグリーン)#CAEC6C
Green Kelp#213423
White#FFFFFF
Black#000000

公式ブランドカラーのZendeskランディングページ
公式ブランドカラーのZendeskランディングページ

AIでサポートエクスペリエンスを向上させる

Zendeskのブランドロゴとファビコンをカスタマイズすることは、まとまりのあるサポートエクスペリエンスを作成するためのほんの始まりにすぎません。ブランディングは認識に役立ちますが、顧客ロイヤルティを構築するのはサポートインタラクションの質です。

AIでZendeskサポートを強化したい場合は、お手伝いできます。当社のZendesk統合は、ブランド化されたヘルプセンターと連携して、顧客の質問に即座に正確な回答を提供します。既存のヘルプセンターの記事、過去のチケット、ドキュメントから学習し、ブランドの声で質問に答えます。

基本的なチャットボットとは異なり、複雑なクエリを処理し、必要に応じてエスカレーションし、すべてのインタラクションから継続的に改善します。その結果、顧客の解決が迅速になり、チームの反復作業が少なくなります。

自動化率を備えたZendesk統合用のeesel AIシミュレーションダッシュボード
自動化率を備えたZendesk統合用のeesel AIシミュレーションダッシュボード

Zendesk用のAIエージェントの詳細またはAIトリアージが受信チケットを自動的にルーティングおよび優先順位付けする方法をご覧ください。

ノーコードインターフェースを備えたメインAIエージェントを構成するためのeesel AIダッシュボード
ノーコードインターフェースを備えたメインAIエージェントを構成するためのeesel AIダッシュボード

よくある質問

ロゴには、透明度のあるPNGまたはスケーラビリティのためのSVGを使用してください。ファビコンの場合、Zendeskは.icoと.jpg形式のみをサポートしており、SVGはサポートしていません。
サポートインターフェースには、限られたブランディングオプションがあります。ファビコンを追加できますが、ロゴのカスタマイズは主にヘルプセンター(顧客向けのナレッジベース)用です。
ブラウザのキャッシュをクリアするか、シークレットウィンドウで表示してみてください。変更はすぐに公開されますが、キャッシュされたファイルが更新の表示を妨げる可能性があります。
ロゴの場合、200px x 50px(コペンハーゲンテーマの場合は最大高さ37px)を目指してください。ファビコンの場合、20x20または32x32ピクセル前後の正方形の画像を使用してください。
はい、Zendeskの組み込みフォントライブラリから見出しと本文のフォントを選択できます。カスタムフォントを使用するには、テーマのコードを直接編集する必要があります。
公式ブランドアセットは、Brandfetch(brandfetch.com/zendesk.com)とWikimedia Commonsを通じて入手できます。これらは、SVG、PNG、およびその他の形式でロゴを提供します。

この記事を共有

Stevia undefined

Article by

Stevia Putri

Stevia Putri is a marketing generalist at eesel AI, where she helps turn powerful AI tools into stories that resonate. She’s driven by curiosity, clarity, and the human side of technology.