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?

2
  • 1
    You're missing onmouseover and onmouseout attributes that set the callbacks.
    – user38627
    Jan 13, 2015 at 17:28
  • Can you provide the code sample for this? Jun 22, 2016 at 10:40

1 Answer 1

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 and acknowledge that you have read and understand our privacy policy and code of conduct.

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