HOW TO: Open Content Query Web Part links in a new IE window

First published on TECHNET on Jul 24, 2012

This post is a contribution from Charls Tom Jacob, an engineer with the SharePoint Developer Support team.

Content Query Web Part is a nice way to query and display data from multiple lists.  By default, when you click on a link displayed in the Content Query Web Part, it opens up in the same IE browser window.  This can be annoying at times if users want to stay on the main page and view the items in a different IE browser window.

In this post, I’ll describe how to extend the out of the box Content Query Web Part and the styles such that links open in new IE window.

Step1: Extend out of the box XSL

1. Download the out of the box ItemStyle.xsl from Style Library (go to Site Actions –> View all site content –> Style Library –> XSL Style Sheets).
2. Rename the file to ItemStyleExtended.xsl.
3. Open the file in NOTEPAD, locate the <DIV> element that acts as a container for links displayed in the web part:

<div class=”link-item”>

1. Modify the following anchor tag to open the links in a new window:

<a href="{$SafeLinkUrl}" title="{@LinkToolTip}">

As

<a href="{$SafeLinkUrl}" title="{@LinkToolTip}" target="_blank">

1. Comment out the XSL that performs an additional check for links to documents or other file types, as below:

<!--<xsl:if test="$ItemsHaveStreams = 'True'">
<xsl:attribute name="onclick">
<xsl:value-of select="@OnClickForWebRendering"/>
</xsl:attribute>
</xsl:if>
<xsl:if test="$ItemsHaveStreams != 'True' and @OpenInNewWindow = 'True'">
<xsl:attribute name="onclick">
<xsl:value-of disable-output-escaping="yes" select="$OnClickTargetAttribute"/>
</xsl:attribute>
</xsl:if>-->

1. Upload the new file to Style Library.

Step2:  Extending the Content Query Web Part

1. Open the Web Part page that contains the Content Query Web Part.
2. Export the web part, save it as “Extented_Content_Query.webpart”.
3. Open the web part file in NOTEPAD, modify the following:

a. Set the title property to "Extended Content Query"
<property name="Title" type="string">Extended Content Query</property>
b. Set the XSLItemLink to the uploaded XSL style sheet file:
<property name="ItemXslLink" type="string">/Style%20Library/XSL%20Style%20Sheets/ItemStyleExtended.xsl</property>

1. Upload the extended Content Query Web Part to web part gallery.
2. Add the extended Content Query Web Part to the web part page.
3. Point the web part source to a document library in the site.
4. Click on a link to verify that it opens in a new IE window.

Hope this helps!