Adding Vizit Buttons and Instant Previews to a Content Query Web Part

Hooking Vizit up to a Content Query Web Part involves modifying some XSLT. These instructions walk you through creating and using a template that will place buttons and Instant Previews next to each returned item that is of a supported content type.

  1. Insert the text below in the file called "ItemStyle.xsl". The template must be added as a sibling of any of the other <xsl:template /> elements. This is located in the "Style Library" Document Library in the "XSL Style Sheets" folder. The "Style Library" is located in the SharePoint Site where your Content Query Web Part is being displayed (eg: http://server/path_to_site/Style%20Library/). Since this library is hidden, it must be navigated to directly. Download the file, make your changes, and upload the new version:

    <xsl:template name="Vizit" match="Row[@Style='Vizit']" mode="itemstyle">
    <xsl:variable name="DisplayTitle">
    <xsl:call-template name="OuterTemplate.GetTitle">
    <xsl:with-param name="Title" select="''" /> 
    <xsl:with-param name="UrlColumnName" select="'LinkUrl'" />
    <script type="text/javascript">
      (function() {
    var docRef = {"list":"<xsl:value-of select="@ListId" />", "item":"<xsl:value-of select="@ID" />"};
    Vizit.Write(docRef, {
    contentTypeId: '<xsl:value-of select="@ContentType" />',
    text: '<xsl:value-of select="$DisplayTitle" />'
  2. Edit the CQWP and in the Styles Section, go to the "ItemStyle" drop down and select Vizit.
  3. Under the "Fields to display:" enter "Content Type ID" in the Content ID field. Enter "URL Path" in the Link field.
  4. Hit OK and save the the page.
Have more questions? Submit a request


Article is closed for comments.
Powered by Zendesk