Note
Access to this page requires authorization. You can try signing in or changing directories.
Access to this page requires authorization. You can try changing directories.
こんにちは、SharePoint サポートの佐伯です。
今回の投稿では、検索結果 Web パーツで検索結果が 0 件の場合の表示をカスタマイズする方法をご紹介します。
検索結果 Web パーツでは、一致する検索結果が得られない場合に既定で以下のようなメッセージが表示されます。
この表示はコントロール表示テンプレートに定義されています。
参考) 本投稿を読み進める前に、下記の記事で表示テンプレートの概要を説明しておりますので、ご参照いただけますと幸いです。
SharePoint 2013 検索結果の表示を制御する表示テンプレート
検索結果 Web パーツに既定で設定されているコントロール表示テンプレートは Control_SearchResults です。Control_SearchResults 内の下記のコードにより、検索結果が 0 件の場合の表示が定義されています。これを編集することで、表示するメッセージやデザインを変更することができます。
<!--#_if(ctx.ClientControl.get_shouldShowNoResultMessage()){_#--><div id="NoResult"><!--#_var emptyMessage = ctx.ClientControl.get_emptyMessage();if ($isEmptyString(emptyMessage)){_#--><div class="ms-textLarge ms-srch-result-noResultsTitle">_#= $htmlEncode(Srch.Res.rs_NoResultsTitle) =#_</div><div>_#= $htmlEncode(Srch.Res.rs_NoResultsSuggestions) =#_</div><ul><li>_#= $htmlEncode(Srch.Res.rs_NoResultsSpelling) =#_</li><li>_#= $htmlEncode(Srch.Res.rs_NoResultsDifferentTerms) =#_</li><li>_#= $htmlEncode(Srch.Res.rs_NoResultsGeneralTerms) =#_</li><li>_#= $htmlEncode(Srch.Res.rs_NoResultsFewerTerms) =#_</li><!--#_if(ctx.DataProvider.get_currentQueryState().r){_#--><li>_#= $htmlEncode(Srch.Res.rs_NoResultsRefiners) =#_</li><!--#_}var searchTipsUrl = "javascript:HelpWindowKey(\"WSSEndUser_SearchTips\")";var searchTipsLink = "<a href=" + searchTipsUrl + ">" + $htmlEncode(Srch.Res.rs_NoResultsTips_Link) + "</a>";_#--><li>_#= String.format($htmlEncode(Srch.Res.rs_NoResultsTips), searchTipsLink) =#_</li></ul><!--#_}else{_#-->_#= $htmlEncode(emptyMessage) =#_<!--#_}_#--></div><!--#_}_#--> |
実際に、コントロール表示テンプレートを編集して、一致する検索結果が得られない場合のメッセージを変更してみましょう。
例) 検索結果が 0 件の場合のメッセージを変更する
一致する検索結果が得られない場合のメッセージを、以下のように「<検索キーワード> の検索結果が見つかりませんでした。」という文言に変更してみましょう。
- 手順
1. [サイトの設定] – [Web デザイナー ギャラリー] – [マスター ページ] をクリックし、マスター ページ ギャラリーを開きます。
2. [Display Templates]、[Search] の順にフォルダを展開し、Control_SearchResults.html ファイルのコピーをダウンロードします。
3. ダウンロードした Control_SearchResults.html ファイルをメモ帳等のエディタで開き、以下のように変更します。(<div id="NoResult"> ~ </div> 内の既存のコードを削除し、紫で記述しているコードを追加します。)
<!--#_
if(ctx.ClientControl.get_shouldShowNoResultMessage()){
_#-->
<div id="NoResult">
<!--#_
var sq = Srch.U.getTableProperty(ctx.ClientControl.get_currentResultTableCollection(), "SerializedQuery");
var oParser = new DOMParser();
var oDocument = oParser.parseFromString(sq, "text/xml");
var nodes = oDocument.getElementsByTagName('Query');
var node = nodes[0];
var queryText = node.getAttribute("QueryText");
_#-->
_#= queryText =#_ の検索結果が見つかりませんでした
</div>
<!--#_
}
_#-->
4. 編集後、Control_SearchResults.html ファイルを保存します。
5. Control_SearchResults.html ファイルをマスター ページ ギャラリーの [Display Templates] – [Search] フォルダに上書きアップロードします。以上で完了です。
補足 :
検索結果 Web パーツは検索ボックスと組み合わせて使用することが多いですが、決まった検索条件を設定しておき、検索結果 Web パーツのみで使用するという方法もあります。例えば、検索結果 Web パーツを使用して、最新のアイテムを取得する検索条件を設定しておくことで、新着情報の表示を実現することができます。
その場合、該当のアイテムが得られない時に、検索結果 Web パーツでは「検索に一致するものがありません」というメッセージが表示されます。
新着情報に最適なメッセージとして、「新着情報はありません」という文言に変更する際は、既存のコントロール表示テンプレートを編集するか、または新しくコントロール表示テンプレートを作成して、検索結果 Web パーツに適用します。
このように、検索結果 Web パーツの使用目的に合わせて特別なメッセージを表示したい場合は、コントロール表示テンプレートをカスタマイズしてください。
今回の投稿は以上です。
検索の設定やカスタマイズに関する投稿をまとめておりますので、ご参考にしていただけますと幸いです。
SharePoint 2013 検索の設定やカスタマイズに関する投稿まとめ