how to display "author Bio" on author's page ?

Topics: Themes
Sep 6, 2013 at 9:13 PM
Right now by default in BE 2.8, when anyone clicks on author name, it navigate the user to the page with a list of all the blog posts by that specific author.

I just want to add "Author Bio" section on top and below that all the blog posts can be displayed.

How to do that ? The author bio information will come from the profile field as we already have this option for users. So I just need to display that bio from database to a page.

How to do that ?

Please help with code ?
Sep 6, 2013 at 11:14 PM
If you still have the code for the standard theme PostView and code behind file from our discussion a few weeks ago, then this might help.

It's just a quick hack, but works - a starter for ten if you like. Once you suss it, you can always tidy it up and add whatever fields you want.

You can reuse the GetAuthorDetails function with minor modification as a masthead author summary.

In code behind PostView.ascx.cs, add the modified function below
public string GetAuthorDetailsHeader(int width, int height, bool includeSummary)
    {
        if (Request.RawUrl.ToLowerInvariant().Contains("author/"))
        {
            string authorName = System.Web.HttpContext.Current.Request["name"];
            if (!string.IsNullOrEmpty(authorName))
            {
                AuthorProfile ap = AuthorProfile.GetProfile(authorName);
                if (ap != null)
                {
                    string authorBio = string.Empty;
                    string email = HasValidEntry(ap.EmailAddress) ? ap.EmailAddress : GetEmailAddress(ap.UserName);

                    var avatar = Avatar.GetAvatar(email);
                    var imgSrc = avatar.Url.ToString();
                    string authorImage = string.Format(
                        "<img class='authorImage' width='{0}' height='{1}' src='{2}' alt='{3}' />",
                        width,
                        height,
                        imgSrc,
                        ap.DisplayName
                    );

                    if (HasValidEntry(ap.UserName))
                    {
                        var blog = Post.GetBlogByAuthor(ap.UserName);
                        string blogName = blog.IsPrimary ? "" : blog.Name + "/";
                        string href = string.Format("{0}{1}author/{2}{3}", Utils.ApplicationRelativeWebRoot, blogName, ap.UserName, BlogConfig.FileExtension);
                        string imageLink = string.Format(
                            "<a href='{0}' class='authorImageLink' >{1} <span class='authorName'>{2}</span></a>",
                            href,
                            authorImage,
                            ap.DisplayName
                        );
                        authorImage = imageLink;
                    }


                    if (HasValidEntry(ap.AboutMe))
                    {
                        authorBio = "<p class=\"authorBio\">" + ap.AboutMe + "</p>";
                    }

                    return includeSummary ? authorImage + authorBio : authorImage;
                }
            }
        }
        return string.Empty;
    }
Then in your PostView.ascx, right at the top:
<%@ Control Language="C#" AutoEventWireup="true" EnableViewState="false"  CodeFile="PostView.ascx.cs" Inherits="PostView" %>

<% This is the bit you are interested in %>

<% if (Location == BlogEngine.Core.ServingLocation.PostList && Index == 0)
{ %> 
    <div class="authorSummary">
        <%=GetAuthorDetailsHeader(75, 75, true)%>           
    </div>
<%} %>

<% end interested bit %>
 
 
<div class="post PostPad xfolkentry" id="post<%=Index %>">    

    <h2 class="PostTitle">
        <a href="<%=Post.RelativeOrAbsoluteLink %>" class="taggedlink"><%=Server.HtmlEncode(Post.Title) %></a>
    </h2>  

    <div class="PostInfo Clear">
        <span class="PubDate"><%=Post.DateCreated.ToString("d. MMMM yyyy HH:mm") %></span>
        <span> / </span>
        <span><a href="<%=BlogEngine.Core.Utils.AbsoluteWebRoot + "author/" + BlogEngine.Core.Utils.RemoveIllegalCharacters(Post.Author) + BlogEngine.Core.BlogConfig.FileExtension %>"><%=Post.AuthorProfile != null ? Post.AuthorProfile.DisplayName : Post.Author %></a></span>
        <span> / </span>
        <span class="CatPost"><%=CategoryLinks(" . ") %></span>
        <a rel="nofollow" class="Right" href="<%=Post.RelativeOrAbsoluteLink %>#comment"><%=Resources.labels.comments %> (<%=Post.ApprovedComments.Count %>)</a>
        <div class="Clearer"></div>
    </div>
    <div class="PostBody text">
        <% if (Location == BlogEngine.Core.ServingLocation.PostList)
           { %> 
        <span class="postListAuthorImage">
            <%=GetAuthorDetails(45, 45, false)%>           
        </span>
        <%} %>  
        <asp:PlaceHolder ID="BodyContent" runat="server" />
        <% if (Location == BlogEngine.Core.ServingLocation.SinglePost)
        { %> 
            <div class="authorSummary">
                <%=GetAuthorDetails(75, 75, true)%>           
            </div>
        <%} %>  
    </div>
    <div class="PostRating">
        <%=Rating %>
    </div>
    <div class="PostTags">
        <%=Resources.labels.tags %> : <%=TagLinks(" . ") %>
    </div>
    <%=AdminLinks %>
</div>
Sep 9, 2013 at 2:54 PM
Hello Andy,

I do remember our old discussion in which you provided me the code.

I think I had this same question but I can't find if I posted somewhere or not - By default, even in the source code version, I don't see the code behind file PostView.ascx.cs ?

I only see PostView.ascx - where I will find the code behind file ? or do I need to add the code behind file myself and use the above code ?
Sep 9, 2013 at 3:59 PM
Andy,

I figured it out - thank you for the code.

any way to achieve this same thing in AllTut (blue) theme ? as it is written in razor cshtml ?
Sep 9, 2013 at 4:45 PM
Yes, for razor it will be different, I think you could probably add the necessary code to the PostView.cshtml inside a function block(or whatever it's officially called).
@functions
{
}

I'll try and get a look at that later, unless you figure it first.
Sep 9, 2013 at 5:18 PM
ok great thanks - I will give it a shot..
Sep 9, 2013 at 6:39 PM
Edited Sep 9, 2013 at 7:54 PM
This should be enough to get you started.
Add the following to @functions(pre existing code omitted for clarity):
@functions{

    public string GetAuthorDetailsHeader(int width, int height, bool includeSummary)
    {
        if (Request.RawUrl.ToLowerInvariant().Contains("author/"))
        {
            string authorName = System.Web.HttpContext.Current.Request["name"];

            if (!string.IsNullOrEmpty(authorName))
            {
                AuthorProfile ap = AuthorProfile.GetProfile(authorName);
                if (ap != null)
                {
                    string authorBio = string.Empty;
                    string email = HasValidEntry(ap.EmailAddress) ? ap.EmailAddress : GetEmailAddress(ap.UserName);

                    var avatar = Avatar.GetAvatar(email);
                    var imgSrc = avatar.Url.ToString();
                    string authorImage = string.Format(
                        "<img class='authorImage' width='{0}' height='{1}' src='{2}' alt='{3}' />",
                        width,
                        height,
                        imgSrc,
                        ap.DisplayName
                    );


                    string namedImage = string.Format(
                        "{0} <p class='authorName'>Posts by {1}</p>",
                        authorImage,
                        ap.DisplayName
                    );
                    authorImage = namedImage;


                    if (HasValidEntry(ap.AboutMe))
                    {
                        authorBio = "<p class='authorBio'>" + ap.AboutMe + "</p>";
                    }

                    string header = includeSummary ? authorImage + authorBio : authorImage;

                    return "<div class='authorSummary'>" + header + "</div>";
                }
            }
        }
        return string.Empty;
    }

    /// <summary>
    /// Checks the given string for null, spaces or literal null text.
    /// Useful for checking data entry fields.
    /// </summary>
    public static bool HasValidEntry(string s)
    {
        return s != null && s.Trim().Length > 0 && s != "null";
    }

    /// <summary>
    /// Get email address for a given user.   
    /// </summary>
    public static string GetEmailAddress(string userName)
    {
        if (!Utils.StringIsNullOrWhitespace(userName))
        {
            System.Web.Security.MembershipUser user = System.Web.Security.Membership.GetUser(userName);
            if (user != null)
            {
                return user.Email;
            }
        }
        return string.Empty;
    }
       
}
And before your post list HTML insert:
@if (Model.Location == BlogEngine.Core.ServingLocation.PostList && Model.Index == 0)
{   
    @Html.Raw(GetAuthorDetailsHeader(75, 75, true)) 
} 
Edit
Removed wrapper link from author image, redundant since user already in list of author posts.
Sep 11, 2013 at 3:40 PM
Thank you Andy, I will test the code and will post the results here