0

Thank you for taking the time to read my question.

I'm customizing a SP2013 CQWP. I've exported and amended it to connect to CustomItemStyle.xsl, and reimported it. I can access all the fields I need.

Here's the customised xsl template:

   <xsl:template name="Report" match="Row[@Style='Report']" mode="itemstyle">
        <xsl:variable name="SafeImageUrl1">
            <xsl:call-template name="OuterTemplate.GetSafeStaticUrl">
                <xsl:with-param name="UrlColumnName" select="'ImageUrl'"/>
            </xsl:call-template>
        </xsl:variable>
        <xsl:variable name="SafeImageUrl2">
            <xsl:call-template name="OuterTemplate.GetSafeStaticUrl">
                <xsl:with-param name="UrlColumnName" select="'ImageUrl'"/>
            </xsl:call-template>
        </xsl:variable>
    <html>
    <table>
    <xsl:if test="count(preceding-sibling::*)=0">
    <tr>
        <td><div class="item"><b>Project name</b></div></td>
        <td><div class="item"><b>Report period</b></div></td>
        <td><div class="item"><b>Previous status</b></div></td>
        <td><div class="item"><b>Current status</b></div></td>
        <td><div class="item"><b>Last updated</b></div></td>
        <td><div class="item"><b>Link to full report</b></div></td>
    </tr>
    </xsl:if>
    <tr>
        <td><div class="item"><xsl:value-of select="@ProjectName" /></div></td>
        <td><div class="item"><xsl:value-of select="@Title" /></div></td>
        <td><div class="item"><img class="image" src="{$SafeImageUrl1}" title="{@ImageUrlAltText1}" /></div></td>
        <td><div class="item"><img class="image" src="{$SafeImageUrl2}" title="{@ImageUrlAltText2}" /></div></td>
        <td><div class="item"><xsl:value-of select="@Modified"/></div></td>
        <td><div class="item"><a href="{@ReportLink}"><xsl:value-of select="substring-after(@ReportLink,',')"/></a></div></td>
    </tr>
    </table>
    </html>
  </xsl:template>

I have two issues:

Date format: The date formatting is incorrect. I've tried replacing the Modified date with this:

<xsl:value-of select="ddwrt:FormatDate(string(@Modified),2057,5)" />

but it breaks the web part. Any ideas?

Multiple images

As you can see I'm attempting to pull in two different images and display them in two table cells side by side.

What's actually being displayed is this:

CQWP showing same image twice with different alt text

The picture above shows that the CQWP displays the Previous status image under both the Previous and Current status columns, but the Alt Text is correct. In the above picture the Alt Text for the Current Status column is correct (Amber) but the image is wrong.

I can see why this is happening. If I edit the web part I see this in the presentation section:

enter image description here

What I am expecting to see is two image fields, perhaps called Image1 and Image2. I would use Image 1 to display the Previous status image, and image 2 to display the Current status image. Instead I see only one, which displays the selected image in both the Previous and Current status columns.

How do I amend the code so that I can select two image fields? You can see in my code what I've tried and isn't working. When I try something new I break it. So I am stuck and hoping someone can help.

Thank you for your time.

1 Answer 1

0

Regarding your date formatting issue, which I think is your biggest issue: Include this line in the element within the XSLT of the editable webpart:

xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime"

If there is another xmlns:ddwrt entry in the <stylesheet> element, delete it and paste the one above into your file.

As for your issue with the images: Your second screen shot is incomplete. So I cannot render an opinion. Please update your post with both expected and unexpected results. The field list image needs to be replaced with a more fully informational screenshot.

2
  • Thank you for the tip on the date formatting - it is now sorted and I cannot tell you how grateful I am!
    – NCCadm
    Jan 6, 2022 at 10:47
  • I've updated the question to provide the further information your requested and a clearer screen shot.
    – NCCadm
    Jan 6, 2022 at 10:56

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.