|
|
Hello all. newbie devloper here. I am converting a statis template to a blogengine site and I am using the 960 grid system. When I have the "front page" of the blog teh css styling is one way but I click on the link for the actual
post the css styling and layout is different. How would I accomplish this with blogengine? Any pointers in the rights direction would be accpreciated.
|
|
Coordinator
Jun 13, 2012 at 2:28 AM
|
If you trying to change layout on post detail, you can take a look at another theme that does it, for example JQ-Mobile. In its postview.asxc.cs it uses code like this:
if (this.Location == ServingLocation.SinglePost)
{
AddPostHeader();
}
|
|
|
|
Thanks a lot. So this snippet of code along with my CSS and everything else is all I would need?
|
|
Coordinator
Jun 19, 2012 at 6:06 PM
Edited Jun 19, 2012 at 6:10 PM
|
No, it is just example how to manipulate layout making it different for post list and single post.
Probably even simpler, you could use directly in aspx or master page:
<% if (this.Location == ServingLocation.SinglePost){ %>
<div>Will only show up on single post</div>
<% } else { %>
<div>Will show up on post list</div>
<% } %>
Not sure if "this" will work in this case though, but it is same idea as example above: you check post location and fill in your layout. "AddPostHeader()" is a function you'd have to replace with your own, doing what you need it to do.
|
|
|
|
Ok, I've down your advice and went into postview.ascx and put in the following:
<%@ Import Namespace="BlogEngine.Core" %>
<%@ Control Language="C#" AutoEventWireup="true" EnableViewState="false" CodeFile="PostView.ascx.cs" Inherits="PostView" %>
<% if (Location == ServingLocation.PostList) { %>
<!-- post -->
<article class="post">
<!-- post header -->
<header>
<div class="seven columns omega">
<h1><a href="<%=Post.RelativeOrAbsoluteLink %>" class="taggedlink"><%=Server.HtmlEncode(Post.Title) %></a></h1>
<!-- post meta -->
<div class="post-meta">
<div class="three columns alpha">
<p class="post-category"><%=CategoryLinks(" | ") %></p>
</div>
<div class="four columns omega far-edge">
by <a href="<%=VirtualPathUtility.ToAbsolute("~/") + "author/" + BlogEngine.Core.Utils.RemoveIllegalCharacters(Post.Author) %>.aspx" class="post-author"><%=Post.AuthorProfile != null ? Post.AuthorProfile.DisplayName : Post.Author %></a> on
<time datetime="" class="post-date"><%=Post.DateCreated.ToString("d. MMMM yyyy HH:mm") %></time>
</div>
</div>
<!-- end .post-meta -->
</div>
</header>
<!-- post content -->
<div class="seven columns omega">
<!-- post excerpt -->
<div class="post-excerpt">
<asp:PlaceHolder ID="BodyContent" runat="server" />
</div>
<!-- end .post-excerpt -->
<!-- post footer -->
<footer>
<% if (BlogEngine.Core.BlogSettings.Instance.ModerationType == BlogEngine.Core.BlogSettings.Moderation.Disqus)
{ %>
<a rel="nofollow" href="<%=Post.PermaLink %>#disqus_thread"><%=Resources.labels.comments %></a>
<%}
else
{ %>
<span class="post-tags tooltip-container"><a href="#" class="icon tag-icon tooltip-anchor"></a><span class="tooltip"><%=TagLinks(", ") %></span></span>
<span class="post-comments tooltip-container"><a href="<%=Post.RelativeOrAbsoluteLink %>#comments" class="icon comments-icon tooltip-anchor"></a><span class="tooltip"><%=Resources.labels.comments %> (<%=Post.ApprovedComments.Count %>)</span></span>
<span class="post-permalink tooltip-container"><a href="<%=Post.PermaLink %>" title="<%=Server.HtmlEncode(Post.Title) %>" class="icon permalink-icon tooltip-anchor"></a><span class="tooltip">Permalink</span></span>
<%} %>
<%=AdminLinks %>
</footer>
<!-- post footer -->
</div>
<div class="clear"></div>
</article>
<!-- end .post -->
<% } else { %>
<!-- Single Post -->
<article class="post single">
<header>
<h1 class="page-title" ><%=Server.HtmlEncode(Post.Title) %></h1>
<div class="post-meta">
<div class="five columns alpha">
<p class="post-category"><%=CategoryLinks(" | ") %></p>
</div>
<div class="six columns omega far-edge">
by <a href="<%=VirtualPathUtility.ToAbsolute("~/") + "author/" + BlogEngine.Core.Utils.RemoveIllegalCharacters(Post.Author) %>.aspx" class="post-author"><%=Post.AuthorProfile != null ? Post.AuthorProfile.DisplayName : Post.Author %></a> on
<time datetime="" class="post-date"><%=Post.DateCreated.ToString("d. MMMM yyyy HH:mm") %></time>
</div>
</div>
</header>
<div class="post-content">
<asp:PlaceHolder ID="BodyContent" runat="server" />
</div>
<!-- post footer -->
<footer>
<% if (BlogEngine.Core.BlogSettings.Instance.ModerationType == BlogEngine.Core.BlogSettings.Moderation.Disqus)
{ %>
<a rel="nofollow" href="<%=Post.PermaLink %>#disqus_thread"><%=Resources.labels.comments %></a>
<%}
else
{ %>
<span class="post-tags tooltip-container"><a href="#" class="icon tag-icon tooltip-anchor"></a><span class="tooltip"><%=TagLinks(", ") %></span></span>
<span class="post-permalink tooltip-container"><a href="<%=Post.PermaLink %>" class="icon permalink-icon tooltip-anchor"></a><span class="tooltip">Permalink</span></span>
<%} %>
<%=AdminLinks %>
</footer>
<!-- post footer -->
</article>
<!-- end .post -->
<% } %>
It all seems to work ok but there is a couple of issues. I can't have the asp place holder there the ID="BodyContent" twice. What should I do to change it? If I try to name it something else no text shows up so the "BodyContent" ID must be referenced somewhere.
|
|
Coordinator
Jun 22, 2012 at 6:38 PM
|
You might need to create 2 sub-postviews and then load one based on conditions. If you look at
arthemia theme I believe it uses this technique. I has several controls and load them dynamically based on conditions using "LoadControl(path)". Also
this might help.
|
|