Knowledge Base

ナレッジベーステンプレートをカスタマイズする

更新日時 2020年 10月 19日

対象製品

Service Hub  Professional, Enterprise

ナレッジベースのデザインをカスタマイズするには、テンプレートを選択してカスタマイズします。

詳しくは、ナレッジベースの設定をカスタマイズする方法についての説明を参照してください。  

  • HubSpotアカウントにて、[サービス] > [ナレッジベース]の順に進みます。
  • 右上にある[テンプレートをカスタマイズ]をクリックします。
  • ナレッジベースのレイアウトのテンプレートを選択します。テンプレートをプレビューするには、そのテンプレートの上にカーソルを置いて[プレビュー]をクリックします。

コンテンツ

左側のパネルの[コンテンツ]タブでは、ナレッジベースのナビゲーションバー、フッター、ヘッダーの画像とテキストをカスタマイズできます。ナレッジベースのホームページに表示されるカテゴリも設定できます。

ナビゲーションバー

ナレッジベースのナビゲーションバーには、ロゴ、名前、ナビゲーションリンク、サポートフォームが含まれています。ナレッジベースの上部ナビゲーションのコンテンツを編集するには。[ナビゲーションバー]をクリックします。ここではテンプレートにサポートフォームを追加することもできます。

  • ナビゲーションバーのテキストリンクの色を設定するには、カラーピッカーをクリックします。カラーグラデーションをクリックして色を選択するか、または手動で16進数値を入力します。
  • 既存のロゴを変更するには、ロゴの上にカーソルを置いて[X]をクリックします。新しい画像をアップロードするには[アップロード]をクリックします。ファイルマネージャーから画像を選択して使用するには、[画像を参照]をクリックします。
  • ナレッジベースに名前を指定するには、左上隅に表示するテキストを入力します。
  • ナレッジベースの右上隅に表示する会社ウェブサイトのハイパーリンクの「テキスト」を入力します。
  • ナレッジベースの右上隅に表示する会社ウェブサイトの「URL」を入力します。
  • 上部のバーに既存のサポートフォームリンクを追加するには、[サポートフォーム]スイッチをクリックしてオンに切り替えます。サポートフォームをまだ設定していない場合は、コミュニケーション設定から新しいサポートフォームを作成できます

    navigation-bar-settings
  • 左上隅にある[コンテンツ]をクリックして戻り、残りのテンプレートコンテンツをカスタマイズします。

フッター

ナレッジベースのフッターには、会社ロゴとソーシャルネットワークリンクが含まれています。ナレッジベースのフッターを編集するには、左側のパネルの[コンテンツ]タブの[フッター]をクリックします。

  • 既存のロゴを変更するには、ロゴの上にカーソルを置いて[X]をクリックします。新しい画像をアップロードするには[アップロード]をクリックします。ファイルマネージャーから画像を選択して使用するには、[画像を参照]をクリックします。
  • すべてのナレッジベース記事のフッターに表示するテキストを入力します。たとえば会社名などです。
  • [+追加]をクリックして、ソーシャルネットワークページへのリンクのボタンを追加します。
  • 追加するすべてのソーシャルネットワークボタンに適用されるアイコンスタイルを選択します。

footer-content

  • 左上隅にある[コンテンツ]をクリックして戻り、残りのテンプレートコンテンツをカスタマイズします。

ヘッダー

ナレッジベースのヘッダーには、歓迎メッセージとヘッダーの背景が含まれています。ナレッジベースのヘッダーを編集するには、[ホームページ]セクションで[ヘッダー]をクリックします。

  • ナレッジベースホームページで検索バーの上に表示するテキストを入力します。
  • 歓迎メッセージの色を設定するには、カラーピッカーをクリックします。カラーグラデーションをクリックして色を選択するか、または手動で16進数値を入力します。
  • ヘッダーの検索バーの背景の色または画像を設定するには、背景モジュールの上にカーソルを置いて[背景を変更]をクリックします。
    • ヘッダーの背景として画像を設定するには、[アップロード]をクリックして新しい画像をアップロードするか、または[画像を参照]をクリックしてファイルマネージャーから画像を選択します。
    • 背景色を設定するには、カラーピッカーをクリックします。カラーグラデーションをクリックして色を選択するか、または手動で16進数値を入力します。テクスチャヘッダーのパターンを選択することもできます。
      knowledge-base-header
  • 左上隅にある[コンテンツ]をクリックして戻り、残りのテンプレートコンテンツをカスタマイズします。


カテゴリ

  • ナレッジベースホームページに表示される記事カテゴリを編集するには、[ホームページ]セクションで[カテゴリ]をクリックします。
    • [カテゴリを作成]をクリックして、ナレッジベースに新しい記事カテゴリを追加します。 
    • [カテゴリを整理]:記事カテゴリの表示順序を変更する場合は、[カテゴリを整理]をクリックします。
    • [カテゴリをホームページに追加]:ナレッジベースのホームページに表示されるカテゴリを有効または無効にするには、クリックしてカテゴリスイッチのオン/オフを切り替えます。記事がないカテゴリは、既定ではオフになります。カテゴリをクリックして、そのカテゴリの詳細を編集します。

knowledge-base-categories

注:「コンテンツリッチ」または「クラシック」テンプレートを使用している場合には、各カテゴリに表示される記事を手動で選択する必要があります。このためには、テンプレートをカスタマイズし、[ホームページ]>[カテゴリ]に移動します。

  • 左上隅にある[コンテンツ]をクリックして戻り、残りのテンプレートコンテンツをカスタマイズします。

デザイン

左側のパネルの[デザイン]タブでは、ナレッジベースの要素の既定のスタイルをカスタマイズできます。

  • 以下の要素に使用する色を設定するには、対応するカラーピッカーを選択します。カラーグラデーションをクリックして色を選択するか、または手動で16進数値を入力します。
    • [サイトのテキストリンク]:フッターと記事のハイパーリンクの色。
    • [ナビゲーションのテキストリンク]:上部ナビゲーションバーのテキストリンクの色。
    • [モバイルナビゲーションメニューの背景]:モバイルナビゲーションメニューの背景色。
  • 記事の見出し、説明、テキストリンクに使用するフォントを選択するには、ドロップダウンメニューをクリックして特定のフォントを選択します。
  • 記事のテキストに使用するフォントを選択するには、ドロップダウンメニューをクリックして特定のフォントを選択します。
  • [テンプレート]の下に現在のテンプレートが表示されます。別のテンプレートを選択するには、[テンプレートを変更]をクリックします。