コンテンツ検索

HubSpotのCMSには、探しているコンテンツを訪問者が簡単に見つけられるように、サイト検索機能が組み込まれています。貴社の全てのHubSpotコンテンツはHubSpotの検索エンジンによって自動的にインデックス登録されるため、ウェブサイト向けにサードパーティー検索ツールを設定する労力はなくなります。

コンテンツの検索

検索エンジンには、/contentsearch/v2/search APIからアクセスできます。このAPIは、高度にカスタマイズされた検索機能をウェブサイト上で提供するための多数のフィルタリングオプションをサポートしています。例えば、ブログに検索機能を組み込む場合は、type=BLOG_POSTを問い合わせるとブログ記事のみが返されます。また、ウェブサイトのスペイン語バージョンに検索を組み込む場合は、language=esを問い合わせるとスペイン語のページのみが返されます。

このAPIではJavaScriptで解析しやすいJSONが返されるので、ウェブサイトに結果を表示できます。全てのコンテンツタイプから、ページドメイン、タイトル、URL、言語が返されます。説明として返されるのは、検索語に最も一致するコンテンツのテキストのサンプルです。完全一致テキストを囲む<span class="hs-search-highlight hs-highlight-html">要素では、CSSを使用して一致テキストを強調表示できます。 

検索対象のコンテンツのタイプによって返される結果の情報は多少異なるため、コンテンツタイプに応じて結果の表示を変えることができます。例えばブログ記事では、記事に付けられているタグ、執筆者、公開日の情報が返されます。

// json { "total": 850, "offset": 0, "limit": 10, "results": [ { "id": 3761238962, "score": 0.30858153, "type": "SITE_PAGE", "domain": "designers.hubspot.com", "url": "https://developers.hubspot.com/docs/cms/search", "language": "en", "title": "Content Search", "description": "Using HubSpot’s native search engine, content search, to implement <span class="hs-search-highlight hs-highlight-html">search on your website</span>" }, { "id": 3254581958, "score": 0.30858153, "type": "BLOG_POST", "domain": "designers.hubspot.com", "url": "https://designers.hubspot.com/blog/getting-started-with-local-development", "featuredImageUrl":"https://designers.hubspot.com/hubfs/local-development.jpg" "title": "Getting Started with Local Development", "description":"The beta Local Development Tooling connects your local workflow to HubSpot, allowing you to utilize <span class="hs-search-highlight hs-highlight-html">version control</span>, your favorite text editor and various web development technologies when developing on the HubSpot CMS." "authorFullName": "William Spiro", "tags": [ "Website Development", "Local Development" ], "publishedDate": 1447938000000 } }

クエリーと結果パラメーターに関する包括的な説明は、/contentsearch/v2/searchのドキュメントを参照してください。

ウェブサイトへの検索の実装

/contentsearch/v2/search APIを使用して、ウェブサイトに検索を簡単に実装できるようにする2つの既定モジュールがあります。 

サイト検索入力

訪問者が検索語を入力するフィールド。このモジュールは、ウェブサイト上の任意の場所に配置できます。このモジュールは、{% module "search_input" path="@hubspot/search_input" %}と指定してテンプレートに組み込むことができます。

{% module "search_input" path="@hubspot/search_input" %}

サイト検索結果

検索語に基づいてコンテンツのリストを返します。このモジュールは、ウェブサイト上の任意の場所に配置できます。このモジュールは、次のようにテンプレートに含めることができます。

{% module "search_results" path="@hubspot/search_results" %}

このようなモジュールの機能が、自分のウェブサイトに必要な検索機能と合わない場合は、独自の検索モジュールまたは機能を開発できます。既定の検索モジュールは、検索ニーズに応じて拡張できるように設計されています。こうしたモジュールは、ファインダーで名前を検索してデザインマネージャー上で表示および複製したり、CMS CLI上でhs fetch @hubspot/search_input.moduleまたはhs fetch @hubspot/search_results.moduleを実行してローカル環境に取り込むことができます。

既定の検索モジュール

検索結果テンプレート

全てのドメインには、既定で固有の検索結果ページがあります。このページのテンプレートとパスは、特定のドメインの［システムページ］タブにある［設定］>［ウェブサイト］>［ページ］で設定します。CMSテーマボイラープレートの検索結果テンプレートを例として参照してください。検索結果ページに設定されたドメインは、自動的に既定の検索モジュールに接続されます。ただし、ウェブサイト上の任意のページに/contentsearch/v2/search APIを使用した検索を構築できます。

検索優先順位の決定方法

検索結果の順位は、訪問者の検索語に対して重み付けられたページコンテンツの比較によって決まります。ページコンテンツは、ページのHTML内でのコンテンツの位置に基づいて、さまざまな重みの比較フィールドとして分類されます。比較フィールドは重みの順にグループ化されます。

  1. HTMLタイトル
  2. メタディスクリプション
  3. H1 HTML要素
  4. H2 HTML要素
  5. H3 HTML要素
  6. その他のHTML要素

このリストは変更される場合があります。ご注意ください。 

ページ上の特定の要素の重みを高めるようインデクサーに指示するには、該当するコンテンツをhs-search-keywordクラスで囲みます。

開発中のインデックスの制御

新しいサイトを開発中は、Google などの検索エンジンによってサイトがインデックス登録されることを心配することなく、サイト検索をテストできると便利です。

robots.txtでは、全てをクローリングするようHubSpotに指定しながら、他のボットをブロックすることが可能です。

# Block all bots User-agent: * Disallow: / # Allow HubSpot Site Search Indexing User-agent: HubSpotContentSearchBot Allow: /

登録しないことを示すメタタグがあるページは、robots.txtで許可されていてもインデックス登録されません。

また、サイトを公開する前にrobots.txtを確認して、全てのインデックス登録が意図したとおりに設定されていることを確かめてください。

既定のインデックス登録動作

CMSでは特定のタイプのページの意図が認識されるため、コンテンツ検索によってコンテンツタイプのページが適切に登録されるように、インデックス登録が安全に制御されます。コンテンツタイプのページの例：

  • サイトページ
  • ランディングページ
  • ナレッジ記事
  • ブログ記事

システムページとパスワード保護ページはインデックス登録されません。CMSアクセス制限ページは、該当するページにサインインしてアクセスできるユーザーのHubSpotコンテンツ検索にのみ表示されます。

ページが検索結果で返されないように除外するには？

ウェブサイトのrobots.txtファイルまたはmetaタグを使用して検索エンジンへの登録をブロックしたページは、サイト検索のためのインデックス登録が行われません。 

robots.txtにdisallowを追加します。

# Block all bots User-agent: * Disallow: /path-to-page # Block just HubSpot Site Search Indexing User-agent: HubSpotContentSearchBot Disallow: /path-to-page

ページまたはテンプレートの<head>にNOINDEX, NOFOLLOWメタタグを追加することもできます。

<meta name="ROBOTS" content="NOINDEX, NOFOLLOW">

robots.txtとメタタグの両方を使用してロボットをブロックする必要はありません。後でページのインデックス登録を許可することにした場合に混乱が生じる可能性があるからです。

ページの一部を検索によるインデックス登録から除外する方法

ページによっては、検索結果として返される必要がない領域が含まれています。例えば、ヘッダー、フッター、サイドバーなどのコンテンツです。このような領域のHTMLにはhs-search-hiddenクラスを追加すると、領域内のコンテンツが検索によって無視されます。
参考になりましたか？
こちらのフォームではドキュメントに関するご意見をご提供ください。HubSpotがご提供しているヘルプはこちらでご確認ください。