I have created a display template which is a hover panel. I am wanting to add the page preview thing but at the moment it is not working. I added from a default display template that works but for some reason it just shows a blank box.
Here is my code:
<html xmlns:mso="urn:schemas-microsoft-com:office:office" xmlns:msdt="uuid:C2F41010-65B3-11d1-A29F-00AA00C14882">
<head>
<title>News Article Hover Panel</title>
<!--[if gte mso 9]><xml>
<mso:CustomDocumentProperties>
<mso:TemplateHidden msdt:dt="string">0</mso:TemplateHidden>
<mso:MasterPageDescription msdt:dt="string">Displays a result hover panel tailored for a web page.</mso:MasterPageDescription>
<mso:ContentTypeId msdt:dt="string">0x0101002039C03B61C64EC4A04F5361F385106603</mso:ContentTypeId>
<mso:TargetControlType msdt:dt="string">;#SearchHoverPanel;#</mso:TargetControlType>
<mso:HtmlDesignAssociated msdt:dt="string">1</mso:HtmlDesignAssociated>
<mso:ManagedPropertyMapping msdt:dt="string">'Title':'Title','Path':'Path','PublishingPageContentOWSHTML':'PublishingPageContentOWSHTML','EditorOWSUSER':'EditorOWSUSER','LastModifiedTime':'LastModifiedTime','CollapsingStatus':'CollapsingStatus','DocId':'DocId','HitHighlightedSummary':'HitHighlightedSummary','HitHighlightedProperties':'HitHighlightedProperties','FileExtension':'FileExtension','ViewsLifeTime':'ViewsLifeTime','ParentLink':'ParentLink','FileType':'FileType','IsContainer':'IsContainer','SecondaryFileExtension':'SecondaryFileExtension','DisplayAuthor':'DisplayAuthor'</mso:ManagedPropertyMapping>
<mso:HtmlDesignStatusAndPreview msdt:dt="string">/_catalogs/masterpage/Display Templates/Search/NBSNewsArticle_HoverPanel.html, Conversion successful.</mso:HtmlDesignStatusAndPreview>
<mso:HtmlDesignConversionSucceeded msdt:dt="string">True</mso:HtmlDesignConversionSucceeded>
</mso:CustomDocumentProperties>
</xml><![endif]-->
</head>
<body>
<div id="Item_WebPage_HoverPanel">
<!--#_
var i = 0;
var id = ctx.CurrentItem.csr_id;
var loadSiteFrame = false;
ctx.CurrentItem.csr_ShowFollowLink = true;
ctx.CurrentItem.csr_ShowViewLibrary = false;
ctx.CurrentItem.csr_ShowLastModifiedTime = false;
ctx.CurrentItem.csr_ShowAuthors = false;
var line1 = $getItemValue(ctx, "PublishingPageContentOWSHTML");
if(line1.toString().length > 500)
{
line1 = line1.toString().substring(0,500)+"...";
}
_#-->
<div class="ms-srch-hover-innerContainer ms-srch-hover-standardSize" id="_#= $htmlEncode(id + HP.ids.inner) =#_">
<div class="ms-srch-hover-arrowBorder" id="_#= $htmlEncode(id + HP.ids.arrowBorder) =#_"></div>
<div class="ms-srch-hover-arrow" id="_#= $htmlEncode(id + HP.ids.arrow) =#_"></div>
<div class="ms-srch-hover-content" id="_#= $htmlEncode(id + HP.ids.content) =#_" data-displaytemplate="WebPageHoverPanel">
<div id="_#= $htmlEncode(id + HP.ids.header) =#_" class="ms-srch-hover-header">
_#= ctx.RenderHeader(ctx) =#_
</div>
<div id="_#= $htmlEncode(id + HP.ids.body) =#_" class="ms-srch-hover-body">
<!--#_
if(true) {
// ctx.CurrentItem.csr_DataShown = true;
//loadSiteFrame = true;
var idViewerEncoded = $htmlEncode(id + HP.ids.viewer);
var idGlassViewerEncoded = "glass_" + idViewerEncoded;
_#-->
<div class="ms-srch-hover-viewerContainer ms-srch-hover-siteViewerContainer">
<div id="_#= idGlassViewerEncoded =#_" class="ms-srch-hover-glass-siteViewer"></div>
<iframe id="_#=idViewerEncoded=#_" src="_#= $urlHtmlEncode(ctx.CurrentItem.csr_Path) =#_" scrolling="no" frameborder="0px" class="ms-srch-hover-siteViewer">
</iframe>
</div>
<!--#_
}
_#-->
<div> Description: _#= line1 =#_ </div>
<!--#_
var path = !Srch.U.w(ctx.CurrentItem.ParentLink) ? ctx.CurrentItem.ParentLink : ctx.CurrentItem.SiteName;
if(!Srch.U.w(path))
{
var siteResultsId = id + "_siteSearchResults";
_#-->
<div id="_#= $htmlEncode(siteResultsId) =#_">
</div>
<!--#_
AddPostRenderCallback(ctx, function()
{
var query = "";
var dataProvider = ctx.ClientControl.get_dataProvider();
if (dataProvider) {
var states = dataProvider.get_currentQueryState()
if (states) {
query = states.k;
}
}
Srch.SiteSearchUtil.populateSiteSearchResults(path, siteResultsId, query, id + HP.ids.noData);
});
}
_#-->
_#= ctx.RenderBody(ctx) =#_
</div>
<div id="_#= $htmlEncode(id + HP.ids.actions) =#_" class="ms-srch-hover-actions">
_#= ctx.RenderFooter(ctx) =#_
</div>
</div>
<!--#_
if(loadSiteFrame){
AddPostRenderCallback(ctx, function(){
HP.loadSiteViewer(ctx.CurrentItem.id, ctx.CurrentItem.id + HP.ids.inner, id + HP.ids.viewer, ctx.CurrentItem.csr_Path, "glass_" + id + HP.ids.viewer);
});
}
_#-->
</div>
</div>
</body>
</html>