Retrieving post author details (avatar, nickname, etc) in blog post templates?
I'm trying to modify the blog post list + detail templates to pull in the post author's nickname and profile picture that is set in their Sitefinity user profile. I've trawled the forums and found no specific way to do it, so if anyone is able to look at my template code below and give me some hints/solution, I'd be most grateful...
<%@ Control Language="C#" AutoEventWireup="true" Inherits="SitefinityWebApp.SfCtrlPresentation.OpenAccessDataProvider_a0a350ca5ca446d4985fcf70f892e660" CodeFile="OpenAccessDataProvider,a0a350ca5ca446d4985fcf70f892e660.ascx.cs" %><%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.ContentUI" Assembly="Telerik.Sitefinity" %><%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.Comments" Assembly="Telerik.Sitefinity" %><%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI" Assembly="Telerik.Sitefinity" %><%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.PublicControls.BrowseAndEdit" Assembly="Telerik.Sitefinity" %><%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %><%@ Import Namespace="Telerik.Sitefinity" %><telerik:RadListView ID="Repeater" ItemPlaceholderID="ItemsContainer" runat="server" EnableEmbeddedSkins="false" EnableEmbeddedBaseStylesheet="false"> <LayoutTemplate> <div class="postList"> <asp:PlaceHolder ID="ItemsContainer" runat="server" /> </div> </LayoutTemplate> <ItemTemplate> <div class="postItem row"> <div class="postSide span1 hidden-phone"> <div class="postAvatar"> <img src="<%# Eval('AuthorAvatarUrl') %>" /> </div> <div class="postDate"> <span class="postDay"><%# Eval("PublicationDate", "0:dd") %></span> <span class="postMonth"><%# Eval("PublicationDate", "0:MMM") %></span> <span class="postYear"><%# Eval("PublicationDate", "0:yyy") %></span> </div> </div><!-- /postSide --> <div class="postMain span8"> <div class="postMeta clearfix"> <div class="postMetaAuthor pull-left"> <span class="postMetaAuthorName"><sf:PersonProfileView runat="server" /></span> <span class="postMetaAuthorNickname"><asp:Literal runat="server" ID="AuthorNickname" /></span> </div> <div class="postMetaCategory pull-right"> <sitefinity:HierarchicalTaxonField ID="HierarchicalFieldControl" runat="server" TaxonomyId="E5CD6D69-1543-427b-AD62-688A99F5E7D4" DisplayMode="Read" WebServiceUrl="~/Sitefinity/Services/Taxonomies/HierarchicalTaxon.svc" Expanded="false" TaxonomyMetafieldName="Category" ExpandText="ClickToAddCategories" BindOnServer="true" /> </div> <div class="clear"></div> </div><!-- /postMeta --> <div class="postArea"> <h2 class="postTitle"><sf:DetailsViewHyperLink TextDataField="Title" ToolTipDataField="Description" runat="server" /></h2> <div class="postContent"> <sf:FieldListView ID="PostContent" runat="server" Text="0" Properties="Content" WrapperTagName="div" WrapperTagCssClass="sfpostContent" /> </div> </div><!-- /postArea --> </div><!-- /postMain --> </div><!-- /postItem --> </ItemTemplate></telerik:RadListView><sf:Pager id="pager" runat="server"></sf:Pager>using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Web.UI;using System.Web.UI.WebControls;using Telerik.Sitefinity.Web.UI;using Telerik.Web.UI;using Telerik.Sitefinity;using Telerik.Sitefinity.Blogs.Model;using Telerik.Sitefinity.Model;namespace SitefinityWebApp.SfCtrlPresentation public partial class OpenAccessDataProvider_a0a350ca5ca446d4985fcf70f892e660 : System.Web.UI.UserControl protected void Page_Load(object sender, EventArgs e) protected override void OnInit(EventArgs e) var repeater = (RadListView)this.FindControl("Repeater"); repeater.ItemDataBound += new EventHandler<RadListViewItemEventArgs>(repeater_ItemDataBound); void repeater_ItemDataBound(object sender, RadListViewItemEventArgs e) if (e.Item is RadListViewDataItem) var strAuthor = "Business Manager"; // this code doesn't work, but this is the general idea of what i want to do // var post = ((RadListViewDataItem)(e.Item)).DataItem as BlogPost; // var owner = post.GetValue("Owner").ToString(); // strAuthor = owner; var AuthorNicknameCtrl = (Literal)e.Item.FindControl("AuthorNickname"); AuthorNicknameCtrl.Text = strAuthor; Hi Michael,
Here is a code snippet that achieves the following. I have created it as an ascx control and defined it as a template through the controls advanced properties in Home >ControlDefinition >Views >DetailBlogPostsFrontend. Of course you can also use the ViewMap approach if you wanted to tackle this globally
You got the right idea in your previous code sample and generally what was missing is the proper API calls to get the item and then get the proper profile for it. The Avatar is a bit tricky because the Avatar field in a profile is a ContentLink to an Image and you can see below how I got that image.
ascx code:
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="BlogWithAuthor.ascx.cs" Inherits="SitefinityWebApp.WidgetTemplates.BlogWithAuthor" %><%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.ContentUI" Assembly="Telerik.Sitefinity" %><%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.Comments" Assembly="Telerik.Sitefinity" %><%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI" Assembly="Telerik.Sitefinity" %><%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.PublicControls.BrowseAndEdit" Assembly="Telerik.Sitefinity" %><%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %><%@ Import Namespace="Telerik.Sitefinity" %> <telerik:RadListView ID="Repeater" ItemPlaceholderID="ItemsContainer" runat="server" EnableEmbeddedSkins="false" EnableEmbeddedBaseStylesheet="false"> <LayoutTemplate> <sf:ContentBrowseAndEditToolbar ID="MainBrowseAndEditToolbar" runat="server" Mode="Add"></sf:ContentBrowseAndEditToolbar> <ul class="sfpostsList sfpostListTitleDateSummary"> <asp:PlaceHolder ID="ItemsContainer" runat="server" /> </ul> </LayoutTemplate> <ItemTemplate> <li class="sfpostListItem"> <h2 class="sfpostTitle"> <sf:DetailsViewHyperLink ID="DetailsViewHyperLink1" TextDataField="Title" ToolTipDataField="Description" runat="server" /> </h2> <asp:image runat="server" ID="AuthorImage" style="width: 120px; margin-right:7px; border-radius: 10px; float:left; background-color: #666;box-shadow: 0 0 25px #111;" /> <div class="sfpostAuthorAndDate"> <asp:Literal ID="Literal2" Text="<%$ Resources:Labels, By %>" runat="server" /> <sf:PersonProfileView ID="PersonProfileView1" runat="server" /> <sf:FieldListView ID="PostDate" runat="server" Format=" | PublicationDate.ToLocal():MMM dd, yyyy" /> </div> <sf:FieldListView ID="PostContent" runat="server" Text="0" Properties="Summary" WrapperTagName="div" WrapperTagCssClass="sfpostSummary" /> <sf:DetailsViewHyperLink ID="FullStory" Text="Full story" runat="server" CssClass="sfpostFullStory" /> <sf:ContentBrowseAndEditToolbar ID="BrowseAndEditToolbar" runat="server" Mode="Edit,Delete,Unpublish"></sf:ContentBrowseAndEditToolbar> </li> </ItemTemplate></telerik:RadListView><sf:Pager id="pager" runat="server"></sf:Pager><asp:PlaceHolder ID="socialOptionsContainer" runat="server" />The code behind
using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Web.UI;using System.Web.UI.WebControls;using Telerik.Sitefinity;using Telerik.Sitefinity.Security;using Telerik.Sitefinity.Blogs.Model;using Telerik.Sitefinity.Security.Model;using Telerik.Sitefinity.Model;using Telerik.Sitefinity.Data.ContentLinks;using Telerik.Web.UI;using Telerik.Sitefinity.Security.Claims;using Telerik.Sitefinity.Modules.Libraries;namespace SitefinityWebApp.WidgetTemplates public partial class BlogWithAuthor : System.Web.UI.UserControl protected void Page_Load(object sender, EventArgs e) Repeater.ItemDataBound += new EventHandler<Telerik.Web.UI.RadListViewItemEventArgs>(Repeater_ItemDataBound); void Repeater_ItemDataBound(object sender, Telerik.Web.UI.RadListViewItemEventArgs e) RadListViewDataItem dataItem = (RadListViewDataItem)e.Item; if (e.Item.ItemType == RadListViewItemType.DataItem || e.Item.ItemType == RadListViewItemType.AlternatingItem) var imageControl = e.Item.FindControl("AuthorImage") as System.Web.UI.WebControls.Image; if (imageControl != null) UserManager manager = UserManager.GetManager(); UserProfileManager pManager = UserProfileManager.GetManager(); BlogPost post = (BlogPost)dataItem.DataItem; User owner = manager.GetUser(post.Owner); SitefinityProfile profile = pManager.GetUserProfile<SitefinityProfile>(owner); LibrariesManager lmanager = LibrariesManager.GetManager(); Telerik.Sitefinity.Libraries.Model.Image image = lmanager.GetImage(profile.Avatar.ChildItemId); imageControl.ImageUrl = image.ThumbnailUrl; Hi Svetla,
I noticed this code will cause an error if there is no Avatar. Is there a simple way to show the Blank Avatar (like the Sitefinity User Page) when there is no Avatar?
Thanks.
Hi David,
You can use conditional control similar like proposed here:
http://www.sitefinity.com/developer-network/forums/developing-with-sitefinity-/if-statement-in-widget-template#gnns3BPXL0WrM2tBoO8Kzw
and render different markup in case there is no Avatar evaluated.
Regards,
Svetoslav Manchev
Telerik
Thanks Svetoslav,
I added a check in the code behind for null Avatar and then set a Blank Avatar to BlankAvatar.ThumbnailUrl = "/SFRes/images/Telerik.Sitefinity.Resources/Images.DefaultPhoto.png";
Which seems to work OK.
I also want the Avatar to show in the Blog Post itself as well as the Blog Post List Template. Could you provide the template and code behind for this?
Hello David,
There is a property 'Owner' that returns the Id of the owner which you can use to retrieve the requested information.
You can check this similar functionality creating a custom control described in that blog post:
http://www.sitefinity.com/blogs/svetoslavmanchev/posts/svetoslav-manchevs-blog/2013/11/21/displaying-additional-user-information-in-a-sitefinity-forum-post
I hope this helps.
Regards,
Svetoslav Manchev
Telerik
This seems a lot of effort to replace a template with code behind for the list, and then amend another with a custom field for Avatar for the blog post itself. Could I raise a request that this is implemented as standard? We should be able to drag and drop the Avatar field along with other detailed information about the post author - into blog posts/news items, etc.. Thanks.
Hi David,
The issue is logged in our feedback portal here:
http://feedback.telerik.com/Project/153/Feedback/Details/196578-add-more-details-about-the-author-in-content-list-and-details-templates, where you can vote to increase its popularity.
Regards,
Svetoslav Manchev
Telerik by Progress