Edit Search WebPart
In this articles I'll explain how to create the formatted image search results
There are three steps to perform this operation at MOSS
1. Create an Image scope at the SharePoint Search.
2. Create New Rules for SharePoint Search.
3. Edit Search Web part.
Edit Search WebPart
Now at your page that you create (picturesResults.aspx)
Go to Edit page-> Core Results WebPart -> Modify Shared Web Part -> Xsl Editor
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" >
<xsl:param name="ResultsBy" />
<xsl:param name="ViewByUrl" />
<xsl:param name="ViewByValue" />
<xsl:param name="IsNoKeyword" />
<xsl:param name="IsFixedQuery" />
<xsl:param name="ShowActionLinks" />
<xsl:param name="MoreResultsText" />
<xsl:param name="MoreResultsLink" />
<xsl:param name="CollapsingStatusLink" />
<xsl:param name="CollapseDuplicatesText" />
<xsl:param name="AlertMeLink" />
<xsl:param name="AlertMeText" />
<xsl:param name="SrchRSSText" />
<xsl:param name="SrchRSSLink" />
<xsl:param name="ShowMessage" />
<xsl:param name="IsThisListScope" />
<xsl:param name="DisplayDiscoveredDefinition" select="True" />
<xsl:param name="NoFixedQuery" />
<xsl:param name="NoKeyword" />
<xsl:param name="NoResults" />
<xsl:param name="NoResults1" />
<xsl:param name="NoResults2" />
<xsl:param name="NoResults3" />
<xsl:param name="NoResults4" />
<xsl:param name="DefinitionIntro" />
<!-- When there is keywory to issue the search -->
<xsl:template name="dvt_1.noKeyword">
<span class="srch-description">
<xsl:choose>
<xsl:when test="$IsFixedQuery">
<xsl:value-of select="$NoFixedQuery" />
</xsl:when>
<xsl:otherwise>
<xsl:value-of select="$NoKeyword" />
</xsl:otherwise>
</xsl:choose>
</span>
</xsl:template>
<!-- When empty result set is returned from search -->
<xsl:template name="dvt_1.empty">
<div class="srch-sort">
<xsl:if test="$AlertMeLink and $ShowActionLinks">
<span class="srch-alertme" > <a href ="{$AlertMeLink}" id="CSR_AM1" title="{$AlertMeText}"><img style="vertical-align: middle;" src="/_layouts/images/bell.gif" alt="" border="0"/><xsl:text disable-output-escaping="yes">&nbsp;</xsl:text><xsl:value-of select="$AlertMeText" /></a>
</span>
</xsl:if>
<xsl:if test="string-length($SrchRSSLink) > 0 and $ShowActionLinks">
<xsl:if test="$AlertMeLink">
|
</xsl:if>
<a type="application/rss+xml" href ="{$SrchRSSLink}" title="{$SrchRSSText}" id="SRCHRSSL"><img style="vertical-align: middle;" border="0" src="/_layouts/images/rss.gif" alt=""/><xsl:text disable-output-escaping="yes">&nbsp;</xsl:text><xsl:value-of select="$SrchRSSText"/></a>
</xsl:if>
</div>
<br/> <br/>
<span class="srch-description" id="CSR_NO_RESULTS">
<xsl:value-of select="$NoResults" />
<ol>
<li><xsl:value-of select="$NoResults1" /></li>
<li><xsl:value-of select="$NoResults2" /></li>
<li><xsl:value-of select="$NoResults3" /></li>
<li><xsl:value-of select="$NoResults4" /></li>
</ol>
</span>
</xsl:template>
<!-- Main body template. Sets the Results view (Relevance or date) options -->
<xsl:template name="dvt_1.body">
<div class="srch-results">
<xsl:if test="$ShowActionLinks">
<div class="srch-sort"> <xsl:value-of select="$ResultsBy" />
<xsl:if test="$ViewByUrl">
|
<a href ="{$ViewByUrl}" id="CSR_RV" title="{$ViewByValue}">
<xsl:value-of select="$ViewByValue" />
</a>
</xsl:if>
<xsl:if test="$AlertMeLink">
|
<span class="srch-alertme" > <a href ="{$AlertMeLink}" id="CSR_AM2" title="{$AlertMeText}"><img style="vertical-align: middle;" src="/_layouts/images/bell.gif" alt="" border="0"/><xsl:text disable-output-escaping="yes">&nbsp;</xsl:text><xsl:value-of select="$AlertMeText" /></a>
</span>
</xsl:if>
<xsl:if test="string-length($SrchRSSLink) > 0">
|
<a type="application/rss+xml" href ="{$SrchRSSLink}" title="{$SrchRSSText}" id="SRCHRSSL"><img style="vertical-align: middle;" border="0" src="/_layouts/images/rss.gif" alt=""/><xsl:text disable-output-escaping="yes">&nbsp;</xsl:text><xsl:value-of select="$SrchRSSText"/></a>
</xsl:if>
</div>
<br /><br />
</xsl:if>
<xsl:apply-templates />
</div>
<xsl:call-template name="DisplayMoreResultsAnchor" />
</xsl:template><!-- This template is called for each result -->
<xsl:template match="Result">
<xsl:variable name="url" select="url"/>
<div id="result{id}" class="result" dir="rtl">
<div id="image{id}" class="picture" >
<xsl:choose>
<xsl:when test="string-length(picturethumbnailurl)>0">
<xsl:call-template name="DisplayThumbnail">
<xsl:with-param name="str" select="picturethumbnailurl"/>
<xsl:with-param name="height" select="pictureheight" />
<xsl:with-param name="width" select="picturewidth" />
</xsl:call-template>
</xsl:when>
<xsl:otherwise>
<xsl:call-template name="DisplayThumbnail">
<xsl:with-param name="str" select="url"/>
<xsl:with-param name="height" select="pictureheight" />
<xsl:with-param name="width" select="picturewidth" />
</xsl:call-template>
</xsl:otherwise>
</xsl:choose>
</div>
<div id="props{id}" class="properties">
<xsl:call-template name="DisplaySite">
<xsl:with-param name="title" select="title"/>
<xsl:with-param name="url" select="url" /><!-- sitename-->
<xsl:with-param name="isdocument" select="isdocument"/>
</xsl:call-template>
<xsl:call-template name="DisplayTitle">
<xsl:with-param name="str" select="title"/>
<xsl:with-param name="url" select="url"/>
</xsl:call-template>
<xsl:call-template name="DisplayDim">
<xsl:with-param name="height" select="pictureheight" />
<xsl:with-param name="width" select="picturewidth" />
</xsl:call-template>
<xsl:call-template name="DisplaySize">
<xsl:with-param name="size" select="size" />
</xsl:call-template>
</div>
</div>
</xsl:template>
<xsl:template name="DisplayThumbnail">
<xsl:param name="str" />
<xsl:param name="height" />
<xsl:param name="width" />
<xsl:if test='string-length($str) > 0'>
<a>
<xsl:attribute name="href"><xsl:value-of select="$str" /></xsl:attribute>
<img>
<xsl:attribute name="src">
<xsl:value-of select="$str" />
</xsl:attribute>
<xsl:choose>
<xsl:when test="string-length($height) = 0">
<xsl:attribute name="height">
125px
</xsl:attribute>
<xsl:attribute name="width">
150px
</xsl:attribute>
</xsl:when>
<xsl:when test="$width > 150 and $width >= $height">
<xsl:attribute name="width">
<xsl:value-of select="(150 div $width) * $width" />px
</xsl:attribute>
<xsl:attribute name="height">
<xsl:value-of select="(150 div $width) * $height" />px
</xsl:attribute>
</xsl:when>
<xsl:when test="$height > 150 and $width < $height">
<xsl:attribute name="width">
<xsl:value-of select="(150 div $height) * $width" />
</xsl:attribute>
<xsl:attribute name="height">
<xsl:value-of select="(150 div $height) * $height" />
</xsl:attribute>
</xsl:when>
</xsl:choose>
</img></a>
</xsl:if>
</xsl:template>
<xsl:template name="DisplaySite">
<xsl:param name="title"/>
<xsl:param name="url" />
<xsl:param name="isdocument" />
<xsl:if test='$isdocument = 1'>
<xsl:if test='string-length($url) > 0'>
<xsl:choose>
<xsl:when test="starts-with($url, 'file://')">
<a href="{$url}" ><img src="/_layouts/images/folder.gif" alt="פתח" style="border:none; vertical-align:bottom;"/></a>
<!-- <xsl:element name="a">
<xsl:attribute name="href">
<xsl:call-template name="strip">
<xsl:with-param name="relfile"><xsl:value-of select="url"/></xsl:with-param>
</xsl:call-template>
</xsl:attribute>
<img src="/_layouts/images/folder.gif" alt="פתח" style="border:none; vertical-align:bottom;"/>
</xsl:element> -->
</xsl:when>
<xsl:when test="starts-with($url, 'http://')">
<a href="{$url}" ><img src="/_layouts/images/cat.gif" alt="Open file location" style="border:none; vertical-align:bottom;"/></a>
<!-- <xsl:element name="a">
<xsl:attribute name="href">
<xsl:call-template name="strip">
<xsl:with-param name="relfile"><xsl:value-of select="url"/></xsl:with-param>
</xsl:call-template>
</xsl:attribute>
<xsl:attribute name="target">blank</xsl:attribute><img src="/_layouts/images/cat.gif" alt="Open file location" style="border:none; vertical-align:bottom;"/></xsl:element>
--> </xsl:when>
</xsl:choose>
 
</xsl:if>
</xsl:if>
</xsl:template>
<xsl:template name="strip">
<xsl:param name="reldir"/>
<xsl:param name="relfile"/>
<xsl:choose>
<xsl:when test="contains($relfile, '/')">
<xsl:call-template name="strip">
<xsl:with-param name="relfile">
<xsl:value-of select="substring-after($relfile,'/')"/>
</xsl:with-param>
<xsl:with-param name="reldir">
<xsl:value-of select="concat($reldir, substring-before($relfile,'/'), '/')"/>
</xsl:with-param>
</xsl:call-template>
</xsl:when>
<xsl:otherwise>
<xsl:value-of select="$reldir"/>
</xsl:otherwise>
</xsl:choose>
</xsl:template>
<!-- Display the formated Dimensions of the image -->
<xsl:template name="DisplayDim">
<xsl:param name="height" />
<xsl:param name="width" />
<xsl:if test='string-length($height) > 0'>
<br/>גודל תמונה: <xsl:value-of select="$width" />x<xsl:value-of select="$height" />
</xsl:if>
</xsl:template>
<xsl:template name="DisplayTitle">
<xsl:param name="str" />
<xsl:param name="url" />
<xsl:if test='string-length($str) > 0'>
<span style="width=110px; height:1.5em; overflow:hidden;"><a href="{$url}" title="View: {$str}"><xsl:value-of select="$str" /></a></span>
</xsl:if>
</xsl:template>
<xsl:template name="HitHighlighting">
<xsl:param name="hh" />
<xsl:apply-templates select="$hh"/>
</xsl:template>
<xsl:template match="ddd">
…
</xsl:template>
<xsl:template match="c0">
<b><xsl:value-of select="."/></b>
</xsl:template>
<xsl:template match="c1">
<b><xsl:value-of select="."/></b>
</xsl:template>
<xsl:template match="c2">
<b><xsl:value-of select="."/></b>
</xsl:template>
<xsl:template match="c3">
<b><xsl:value-of select="."/></b>
</xsl:template>
<xsl:template match="c4">
<b><xsl:value-of select="."/></b>
</xsl:template>
<xsl:template match="c5">
<b><xsl:value-of select="."/></b>
</xsl:template>
<xsl:template match="c6">
<b><xsl:value-of select="."/></b>
</xsl:template>
<xsl:template match="c7">
<b><xsl:value-of select="."/></b>
</xsl:template>
<xsl:template match="c8">
<b><xsl:value-of select="."/></b>
</xsl:template>
<xsl:template match="c9">
<b><xsl:value-of select="."/></b>
</xsl:template>
<!-- The size attribute for each result is prepared here -->
<xsl:template name="DisplaySize">
<xsl:param name="size" />
<xsl:if test='string-length($size) > 0'>
<xsl:if test="number($size) > 0">
<br/>גודל קובץ:
<xsl:choose>
<xsl:when test="round($size div 1024) < 1"><xsl:value-of select="$size" /> Bytes</xsl:when>
<xsl:when test="round($size div (1024 *1024)) < 1"><xsl:value-of select="round($size div 1024)" />KB</xsl:when>
<xsl:otherwise><xsl:value-of select="round($size div (1024 * 1024))"/>MB</xsl:otherwise>
</xsl:choose>
</xsl:if>
</xsl:if>
</xsl:template>
<!-- A generic template to display string with non 0 string length (used for author and lastmodified time -->
<xsl:template name="DisplayString">
<xsl:param name="str" />
<xsl:if test='string-length($str) > 0'>
-
<xsl:value-of select="$str" />
</xsl:if>
</xsl:template>
<!-- document collapsing link setup -->
<xsl:template name="DisplayCollapsingStatusLink">
<xsl:param name="status"/>
<xsl:param name="urlEncoded"/>
<xsl:param name="id"/>
<xsl:if test="$CollapsingStatusLink">
<xsl:choose>
<xsl:when test="$status=1">
<br/>
<xsl:variable name="CollapsingStatusHref" select="concat(substring-before($CollapsingStatusLink, '$$COLLAPSE_PARAM$$'), 'duplicates:"', $urlEncoded, '"', substring-after($CollapsingStatusLink, '$$COLLAPSE_PARAM$$'))"/>
<span class="srch-dup">
[<a href="{$CollapsingStatusHref}" id="$id" title="{$CollapseDuplicatesText}">
<xsl:value-of select="$CollapseDuplicatesText"/>
</a>]
</span>
</xsl:when>
</xsl:choose>
</xsl:if>
</xsl:template><!-- The "view more results" for fixed query -->
<xsl:template name="DisplayMoreResultsAnchor">
<xsl:if test="$MoreResultsLink">
<a href="{$MoreResultsLink}" id="CSR_MRL">
<xsl:value-of select="$MoreResultsText"/>
</a>
</xsl:if>
</xsl:template>
<xsl:template match="All_Results/DiscoveredDefinitions">
<xsl:variable name="FoundIn" select="DDFoundIn" />
<xsl:variable name="DDSearchTerm" select="DDSearchTerm" />
<xsl:if test="$DisplayDiscoveredDefinition = 'True' and string-length($DDSearchTerm) > 0">
<script language="javascript">
function ToggleDefinitionSelection()
{
var selection = document.getElementById("definitionSelection");
if (selection.style.display == "none")
{
selection.style.display = "inline";
}
else
{
selection.style.display = "none";
}
}
</script>
<div>
<a href="#" onclick="ToggleDefinitionSelection(); return false;">
<xsl:value-of select="$DefinitionIntro" /><b><xsl:value-of select="$DDSearchTerm"/></b></a>
<div id="definitionSelection" class="srch-Description" style="display:none;">
<xsl:for-each select="DDefinitions/DDefinition">
<br/>
<xsl:variable name="DDUrl" select="DDUrl" />
<xsl:value-of select="DDStart"/>
<b>
<xsl:value-of select="DDBold"/>
</b>
<xsl:value-of select="DDEnd"/>
<br/>
<xsl:value-of select="$FoundIn"/>
<a href="{$DDUrl}">
<xsl:value-of select="DDTitle"/>
</a>
</xsl:for-each>
</div>
</div>
</xsl:if>
</xsl:template>
<!-- XSL transformation starts here -->
<xsl:template match="/">
<xsl:if test="$AlertMeLink">
<input type="hidden" name="P_Query" />
<input type="hidden" name="P_LastNotificationTime" />
</xsl:if>
<xsl:choose>
<xsl:when test="$IsNoKeyword = 'True'" >
<xsl:call-template name="dvt_1.noKeyword" />
</xsl:when>
<xsl:when test="$ShowMessage = 'True'">
<xsl:call-template name="dvt_1.empty" />
</xsl:when>
<xsl:otherwise>
<xsl:call-template name="dvt_1.body"/>
</xsl:otherwise>
</xsl:choose>
</xsl:template>
<!-- End of Stylesheet -->
</xsl:stylesheet>
<root xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
<Columns>
<Column Name="WorkId"/>
<Column Name="Rank"/>
<Column Name="Title"/>
<Column Name="Author"/>
<Column Name="Size"/>
<Column Name="Path"/>
<Column Name="Description"/>
<Column Name="Write"/>
<Column Name="SiteName"/>
<Column Name="CollapsingStatus"/>
<Column Name="HitHighlightedSummary"/>
<Column Name="HitHighlightedProperties"/>
<Column Name="ContentClass"/>
<Column Name="IsDocument"/>
<Column Name="PictureThumbnailURL"/>
<Column Name="ContentType"/>
<Column Name="FileExtension"/>
<Column Name="PictureWidth"/>
<Column Name="PictureHeight"/>
</Columns>
</root>
see more at
Create Images Search Result in SharePoint - Part 1
Create Images Search Result in SharePoint - Part 2
Thanks,
Roi
Posts
5 comments:
nice
Hi looking good blog
iam using Image with formatting and constraints for publishing in one of custom list .in which the user can upload his meta data and his picture using custom list form. i am doing search funtion on that list i have created search scope to that list i am getting data from that list like first name last name by creating some managed propertis .but i a unable get the images from list can any one provide information how to do. i should not use any code
To to get a image from a list I would use maybe SPServices. Take the image through JavaScript code. If you can take the name of the list or its ID - you can take a image.
If the search will crawl the images referenced on pages??? Who can answer?
You can read the second post in this article - "Create New Rules for SharePoint Search." In this article I explain the Search crawl
http://iwillsharemypoint.blogspot.co.il/2011/02/create-images-search-result-in_25.html
Post a Comment