Add fixed image to announcement Content Query Web part with modal dialog on open

I needed to have a bulleted list of announcements from across the site collection.
I created a new Content Type – GlobalAnnouncements
Applied the Content Type it to a list.
Added some items.
Edited SiteCollection/StyleLibrary/XSL Style Sheets/ItemStyle.xsl
Added a new template called GlobalAnnouncement:

<xsl:template name=”GlobalAnnouncement” match=”Row[@Style=’GlobalAnnouncement’]” mode=”itemstyle”>
<xsl:variable name=”SafeLinkUrl”>
<xsl:call-template name=”OuterTemplate.GetSafeLink”>
<xsl:with-param name=”UrlColumnName” select=”‘LinkUrl'”/>
</xsl:call-template>
</xsl:variable>
<xsl:variable name=”SafeImageUrl”>
<xsl:call-template name=”OuterTemplate.GetSafeStaticUrl”>
<xsl:with-param name=”UrlColumnName” select=”‘ImageUrl'”/>
</xsl:call-template>
</xsl:variable>
<xsl:variable name=”DisplayTitle”>
<xsl:call-template name=”OuterTemplate.GetTitle”>
<xsl:with-param name=”Title” select=”@Title”/>
<xsl:with-param name=”UrlColumnName” select=”‘LinkUrl'”/>
</xsl:call-template>
</xsl:variable>
<div style=”padding-right:0px;padding-left:10px;padding-top:0px;padding-botton:5px;”>
<xsl:if test=”string-length($SafeImageUrl) != 0″>
<div>
<a href=”{$SafeLinkUrl}”>
<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>
<img src=”{$SafeImageUrl}” title=”{@ImageUrlAltText}”>
<xsl:if test=”$ImageWidth != ””>
<xsl:attribute name=”width”>
<xsl:value-of select=”$ImageWidth” />
</xsl:attribute>
</xsl:if>
<xsl:if test=”$ImageHeight != ””>
<xsl:attribute name=”height”>
<xsl:value-of select=”$ImageHeight” />
</xsl:attribute>
</xsl:if>
</img>
</a>
</div>
</xsl:if>
<div>
<xsl:call-template name=”OuterTemplate.CallPresenceStatusIconTemplate”/>

<a onclick=”javascript:SP.UI.ModalDialog.ShowPopupDialog(‘{$SafeLinkUrl}’); return false;” onmouseover=”javascript:this.style.cursor=’hand’;” title=”{@LinkToolTip}”>
<img src=’/PublishingImages/News Button.jpg’ width=”25px” height=”25px”  align=”middle” style=”padding-right:5px;”></img>

<xsl:value-of select=”$DisplayTitle”/>
</a>
<div>
<xsl:value-of select=”@Description” />
</div>
</div>
</div>
</xsl:template>

 

And it all worked out fine. I need to add my styles to the sites css. But this is working nicely.