How to: Include image thumbs in Search & Tag Filter Results

This post has 1 verified answer | 18 Replies | 9 Followers

Suggest an Answer

davelee

247 Posts

Points 3,005

Contact

By: davelee

Posted: Mon, Jul 17 2006 10:15 PM

When a search result includes a title or description of an image.. wouldn't it be appropriate to include an image thumbnail in that result item?

It'd be great if this were built-in. But, has anyone modded to do this?

David

Filed under: Gallery, thumbnail, search |
Post Points: 35 |

Verified Answers

davelee

247 Posts

Points 3,005

rated by 0 users

Contact

By: davelee

Posted: Tue, Dec 5 2006 6:01 PM In reply to

Alrighty- I did some tweaking in my source and now Gallery Post items have thumbs in both Search results and Tag Filter results... like this:

search thumbs preview

This requires SDK/source modification and recompilation... here's what I did:

Add the "CS:Href.." to Skin-SearchResults.ascx and Skin-TagPostResults.ascx as follows:

<%-- DOL- added hyperlink/thumb to search results for gallery posts--%>

<CS:Href runat="server" ID="thumb" CssClass="aSearchThumb" Visible="false" />

<%# DataBinder.Eval(Container.DataItem, "BestMatch").ToString().Length > 0 ? DataBinder.Eval(Container.DataItem, "BestMatch") : Formatter.GetBodySummary(DataBinder.Eval(Container.DataItem, "Body").ToString(),350, SearchTextTop.Text, System.Drawing.Color.Black, System.Drawing.Color.Yellow) %>

</div>

<%-- DOL- added "clear:left" to class CommonSearchResultDetails in common.css --%>

<div class="CommonSearchResultDetails">...

The "clear:left" added to the CommonSearchResultDetails class is req in common.css

In each respective codefiles- \Controls\Search\SearchResults.cs and \Controls\Utility\TagPostResults.cs- add to ItemDataBound per following:

case ListItemType.AlternatingItem:

//DOL- added thumb/hyperlink to search results for gallery posts

if (post.ApplicationType == ApplicationType.Gallery)

{

HyperLink thumb = e.Item.FindControl("thumb") as HyperLink;if (thumb != null)

{

thumb.Visible = true;

thumb.NavigateUrl = post.Url;

thumb.Text = "<img src='" + post.ThumbURL + "' alt='' class='imgSearchThumb' />";

}

//end DOL

HyperLink SectionUrl = e.Item.FindControl("SectionUrl") as HyperLink;

In \Components\Search\IndexPost.cs add the private and public properties:

//DOL- added ThumbURL properties to IndexPost.cs .. to display thumbs in search results that are gallery posts

private string _thumbURL;public string ThumbURL

{

get { return _thumbURL; }

set { _thumbURL = value; }

}

And then, finally, in \CommunityServerSearchBarrel\GalleryBarrelItem.cs , add code to set ThumbURL property:

public override void Format(IndexPost post)

{

Gallery gal = Galleries.Galleries.GetGallery(post.SectionID, true);if (gal != null)

{

//DOL- added thumbnail url src to GalleryBarrelItem.cs.. to display thumbs in search results that are gallery posts, in search and tag search.

post.Url = GalleryUrls.Instance().PictureUrl(gal.ApplicationKey, post.PostID);if (GalleryUrls.Instance().ThumbnailURL(gal.ApplicationKey, post.PostID) != null)

{

post.ThumbURL = GalleryUrls.Instance().ThumbnailURL(gal.ApplicationKey, post.PostID);

}

//end DOL

}

post.ApplicationUrl = GalleryUrls.Instance().Home;

}

Style as you wish in common.css... for example:

.imgSearchThumb{border-width: 1px;}

.aSearchThumb{float: left; padding: 5px;}

and don't forget the clear:left...

.CommonSearchResultDetails