一般的なユースケースでは、コンテンツ・レイアウト内のリンクをクリックしたときに動的検索問合せを使用して検索ページに移動します。
たとえば、コンテンツ・レイアウト内の「More articles from this author」リンクをクリックしたときに、検索ペイロードを渡して、「Authors」という名前の検索ページに移動したいとします。 これを実現するには次のコードを使用します。 グローバル・オブジェクトSCS
とSCSRenderAPI
は、サイト・ページ内で実行しているときにコンテンツ・レイアウトで使用できることに注意してください。
$('.more-from-author').click($.proxy(function () {
var childrenPages = SCS.structureMap[SCS.navigationRoot].children;
if (!childrenPages) return; // No pages
// Find the Authors page
for (var i = 0; i < childrenPages.length; i++) {
var page = SCS.structureMap[childrenPages[i]];
if (page.name === 'Authors') {
var linkData = SCSRenderAPI.getPageLinkData(page.id);
if (linkData && linkData.href) {
var href = linkData.href,
searchPayload = content.author_id + '*',
contentType = "Starter-Blog-Post";
// if both the page URL and the search query exists, navigate to the page passing in the query
if (href && searchPayload) {
var queryStart = href.indexOf('?') === -1 ? '?' : '&';
// add in the contentType and search parameters
// contentType isn't a required URL parameter
// Payload contains search string only. No parameter name.
href += queryStart + (contentType ? 'contentType=' + contentType + '&' : '') + 'q=' + searchPayload;
// navigate to the search results page
window.location = href;
}
}
}
}
}, this));
同じページ内で同じコンテンツ・レイアウトを複数回使用する場合は、$('.more-from-author').click(…)
などのクラス・セレクタではなく、CSSセレクタで一意のIDを使用する方がよいでしょう。
たとえば:
template.html
<div id="{{navigateId}}">â¦.</div>
render.js
content.navigateId = this.scsData.id + 'detailTrigger';
$('#' + navigateId).click(â¦)