5

I have a task in which I have to customize the search display template for webpage ,am which I did successfully by copying webpage template and modifying it .

I am using search result webpart but the hover panel of the modified template is not showing the snapshot of the webpage, can you tell me what might be the issue because I have just modified this

<div id="_#= $htmlEncode(itemId) =#_" name="Item" data-displaytemplate="WebPageItem" class="ms-srch-item" onmouseover="_#= ctx.currentItem_ShowHoverPanelCallback =#_" onmouseout="_#= ctx.currentItem_HideHoverPanelCallback =#_">                         
                _#=ctx.RenderBody(ctx)=#_   
                <div id="_#= $htmlEncode(hoverId) =#_" class="ms-srch-hover-outerContainer"></div>
            </div>

by this

<table>
                <tr>
                     <td>
            <a href="_#=ctx.CurrentItem.Path=#_">   _#=ctx.CurrentItem.NewsTitleOWSTEXT=#_   </a>
                      </td>

                </tr>

                 <tr>
                     <td>
              _#=ctx.CurrentItem.NewsDescriptionOWSMTXT=#_   
                      </td>

                </tr>


                <tr>
                     <td>
           PublishingTime -_#=ctx.CurrentItem.NewsPublishingDateDatatype=#_  
                      </td>

                </tr>
            </table>

            <div id="_#= $htmlEncode(hoverId) =#_" class="ms-srch-hover-outerContainer">


            </div>
        </div>

what do I have to do to make the hover panel display the snapshot of webpage, or you could refer me to article that talks about this thing?

  • 1
    You're missing onmouseover and onmouseout attributes that set the callbacks. – user38627 Jan 13 '15 at 17:28
  • Can you provide the code sample for this? – Vikas Sharma Jun 22 '16 at 10:40
0

This should work:

<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>
<!--#_
            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);
            });
_#-->

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.