BeeCMS

YES - Startpage / HompageURL filtered by Label for Blogger.com

2010-01-11T14:32:00.001-08:00

BeeCMS -095e-templateforbloggercom.xml (46 KB)

As Blake Matheny remarked in his post in 2007, most Blogger Help Forum entries and responses for requests to filter the default hompage list of posts by a Label state it there is no solution. But Blake has found and described a solution, which we applied line-by-line, with a little twist: we just left the original Google code section about the rendering of posts as it is, including the now standard lines for the eventual inclusion of Google ads. And it works, we haven't found an issue yet, cross fingers :-)

So here is the former BeeCMS code (which had already been modified from the original code, see previous posts).

<b:includable id='main' var='top'>

<b:include data='posts' name='breadcrumb'/>

<data:defaultAdStart/>

<ol class='hfeed' id='posts-list'>

<b:loop values='data:posts' var='post'>

<li><article class='hentry'>

<b:include data='post' name='post'/>

<b:if cond='data:blog.pageType == "static_page"'>

<b:include data='post' name='comments'/>

</b:if>

<b:if cond='data:blog.pageType == "item"'>

<section>

<b:include data='post' name='comments'/>

</section>

</b:if>

<b:if cond='data:post.includeAd'>

<b:if cond='data:post.isFirstPost'>

<data:defaultAdEnd/>

<b:else/>

<data:adEnd/>

</b:if>

<div class='inline-ad'>

<data:adCode/>

</div>

<data:adStart/>

</b:if>

<b:if cond='data:post.trackLatency'>

<data:post.latencyJs/>

</b:if>

</article></li>

</b:loop>

</ol>

<data:adEnd/>

And here is the new revised code including our version of Blake's hack. The main difference is as mentioned above the tags for Google Ads, and the positioning of the "includable", Although we intially pasted it somewhere else Google / Blogger, seemed to re-adjust the location of that code.

So here is the new code:

First the Includable 'printPosts' which can be found between the "post-feed links" section and the includable "feedLinksBody". The formel within the includable printposts is the default Google call to list posts and individual posts (items) with or without comments.

<b:includable id='printPosts' var='post'>

<li><article class='hentry'>

<b:include data='post' name='post'/>

<b:if cond='data:blog.pageType == "static_page"'>

<b:include data='post' name='comments'/>

</b:if>

<b:if cond='data:blog.pageType == "item"'>

<section>

<b:include data='post' name='comments'/>

</section>

</b:if>

<b:if cond='data:post.includeAd'>

<b:if cond='data:post.isFirstPost'>

<data:defaultAdEnd/>

<b:else/>

<data:adEnd/>

</b:if>

<div class='inline-ad'>

<data:adCode/>

</div>

<data:adStart/>

</b:if>

<b:if cond='data:post.trackLatency'>

<data:post.latencyJs/>

</b:if>

</article></li>

</b:includable>

And here is the original hack by Blake:

<b:includable id='main' var='top'>

<b:include data='posts' name='breadcrumb'/>

<data:defaultAdStart/>

<ol class='hfeed' id='posts-list'>

<b:loop values='data:posts' var='post'>

<b:if cond='data:blog.url == data:blog.homepageUrl'>

<b:if cond='data:post.labels'>

<b:loop values='data:post.labels' var='label'>

<b:if cond='data:label.name == "home"'>

<b:include data='post' name='printPosts'/>

</b:if>

</b:loop>

</b:if>

<b:else/>

<b:include data='post' name='printPosts'/>

</b:if>

</b:loop>

</ol>

<data:adEnd/>

...

It worked: the default 'homepage' is now filtering the posts using the label "home" (I hope after posting this article, the 'home' in the code remains bold and red :-) ). Thanks Blake.

If you want to publish an article on the first page / start page, just add the label "home" to that post. And don't forget, Blogger doesn't display the post, if you spelled the tag "Home" or "HOME" instead of "home". Yeah, it is a bit nick-picking of Blogger to make such a distinction for labels...

So all remained for us was now to remove the #featured section, the Javascripts etc, which had become obsolete. Also we don't need the original hack anylonger, which wrapped an "if else /if" around "featured" and the "main" sections of the template.

So only major todo which remains is the bottom of the page, where we would like to update the "bio" section to make it expandable / collapsible . Don't know whether to use AJAX / Javascript, maybe using an invisible tabbed box (where the initial tab is empty, thereby "collapsed", or whether to us DHTML... We'll see, for now the biggest roadworks to adapt Nexus 5 to a more classic website style use with CMS-like publishing capabilities. Stay tuned :-)

Posted via email from BeeCMS

Switching from "Featured" to "homeurl" filtered by a Label

2010-01-11T04:03:00.001-08:00

As described in a previous post, we want to have a "homepage" or "startpage" which lists only selected posts.

In our current version, we use the #featured functionality of Amanda's Nexus 5. We have modified it a little bit and removed all the text length limitations and therefore we have suppressed the "continue reading" link. But the layout limitations remain.

We then have the If else hack, which basically says, if it's the "homeURL", then show the #featured section, else show main.

It is of course possible to get rid of all the layout limitations - by using the normal "posts" call of blogger. And we found Blake Matheny's way to include labels as filters for the homeURL.

So in this part we want to prepare BeeCMS code to be able to then integrate Blake's hack.

Revisiting the Nexus code we found that Amanda merged the Smashing Magazine suggestions with Blogger.com calls by introducing a new "if". Smashing's Enrique Ramirez suggest using the "ol" tag when listing the posts.

The blogger call for listing posts is however wrapped in a "Includable". in Nexus 5 Amanda simply used the default Blogger code by wrapping it in an if script, which basically says, if the page is not an "item", then use we use the default html code with an "ol"-tag, if it is a single post then use the normal div-tag.

The only difference is that in the CSS the ol tag has a few definitions for margins, so for now we decided to simplify things.

We just use the ol-tag whether it is the type "item" (or single post) or not.

Once everything is ok, we'll try to integrate Blake's code.

So here's the Nexus original code:

<b:includable id='main' var='top'>

<b:include data='posts' name='breadcrumb'/>

<data:defaultAdStart/>

<b:if cond='data:blog.pageType != "item"'>

<ol class='hfeed' id='posts-list'>

<b:loop values='data:posts' var='post'>

<li><article class='hentry'>

<b:include data='post' name='post'/>

<b:if cond='data:blog.pageType == "static_page"'>

<b:include data='post' name='comments'/>

</b:if>

<b:if cond='data:blog.pageType == "item"'>

<section>

<b:include data='post' name='comments'/>

</section>

</b:if>

<b:if cond='data:post.includeAd'>

<b:if cond='data:post.isFirstPost'>

<data:defaultAdEnd/>

<b:else/>

<data:adEnd/>

</b:if>

<div class='inline-ad'>

<data:adCode/>

</div>

<data:adStart/>

</b:if>

<b:if cond='data:post.trackLatency'>

<data:post.latencyJs/>

</b:if>

</article></li>

</b:loop>

</ol>

<b:else/>

<div class='hfeed' id='posts-list-item'>

<b:loop values='data:posts' var='post'>

<article class='hentry'>

<b:include data='post' name='post'/>

<b:if cond='data:blog.pageType == "static_page"'>

<b:include data='post' name='comments'/>

</b:if>

<b:if cond='data:blog.pageType == "item"'>

<b:include data='post' name='comments'/>

</b:if>

<b:if cond='data:post.includeAd'>

<b:if cond='data:post.isFirstPost'>

<data:defaultAdEnd/>

<b:else/>

<data:adEnd/>

</b:if>

<div class='inline-ad'>

<data:adCode/>

</div>

<data:adStart/>

</b:if>

<b:if cond='data:post.trackLatency'>

<data:post.latencyJs/>

</b:if>

</article>

</b:loop>

</div>

</b:if>

And here is our new (old) replacement, whereby we simply always use the ol-tag:

<b:includable id='main' var='top'>

<b:include data='posts' name='breadcrumb'/>

<data:defaultAdStart/>

<ol class='hfeed' id='posts-list'>

<b:loop values='data:posts' var='post'>

<li><article class='hentry'>

<b:include data='post' name='post'/>

<b:if cond='data:blog.pageType == "static_page"'>

<b:include data='post' name='comments'/>

</b:if>

<b:if cond='data:blog.pageType == "item"'>

<section>

<b:include data='post' name='comments'/>

</section>

</b:if>

<b:if cond='data:post.includeAd'>

<b:if cond='data:post.isFirstPost'>

<data:defaultAdEnd/>

<b:else/>

<data:adEnd/>

</b:if>

<div class='inline-ad'>

<data:adCode/>

</div>

<data:adStart/>

</b:if>

<b:if cond='data:post.trackLatency'>

<data:post.latencyJs/>

</b:if>

</article></li>

</b:loop>

</ol>

<data:adEnd/>

We have subsequently removed all "posts-list-item" CSS declarations. the less declarations, the better :-)

Now remains the last part, the merging with Blake's code... can't wait, but I have to :-(

Posted via email from BeeCMS

Removed the post summaries

2010-01-11T00:25:00.001-08:00

Download now or preview on posterous

BeeCMS-v09c-templateforblogger.xml (50 KB)

Following our quest to debloggedize the BeeCMS template based we removed this blocj of code, which Amanda used to list the post summaries.

<b:if cond='data:blog.pageType != "item"'>

<div expr:id='"summary" + data:post.id'>

<data:post.body/>

</div>

<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");

</script>

<span class='rmlink' style='float:right; margin-right: 1px;'> Continue reading »</span>

<div style='clear: both;'/>

</b:if>

<b:if cond='data:blog.pageType == "item"'>

<div class='post-body entry-content'>

<data:post.body/>

<div style='clear: both;'/>

</div>

</b:if>

We replaced it with the standard Blogger way to handle post lists. As we use the lists only to generate dynamic content for the labelled navigation menu items, we prefer the direct full version of the post:

<div class='post-body entry-content'>

<data:post.body/>

<div style='clear: both;'/>

</div>

Posted via email from BeeCMS

Revisiting the homepage issue with Blogger.com

2010-01-09T21:22:00.001-08:00

We have been debating how to achieve the goal to produce a homepage like first page of blogger. And there are a variety of solutions, trickes and hacks:

First trick - The Easy Peasy Way with Flaws

Reduce the number of posts to 1 (or very few) in the Layouts section of Blogger, the editing the Blog posts box. Then in order to have one post permanetly there, like a sticky thread or entry in a forum, just change the date stamp to some far away date in the future AFTER having already published the article. Nice but hhmmm.

Feasible without coding using just about any Blogger.com template, including the 3rd party ones

Second solution - Neat and tidy, though a little too constrained for the user

The next trick which we are using at the moment I am writing this is the "Featured" hack that Amanda's Nexus 5 is using. We have morphed Nexus 5 into BeeCMS and with a clever if then else hack, the posts simply disappear from the homepage, only the Feutured section (renamed "Welcome") can now bee seen when using this new template.

There is a catch though, the article uses a javascript, which "reads" out the post with such a label, but... all the layout options get parsed - just the text remains. For a "Welcome" message this may work fine if it weren't for another restriction: pictures need to be declared as well, ie, only one photo will be shown as a kind of preview.

So we though about removing most of the text and layout restriction restrictions, but it is still not enough.

Trying to filter the hompage posts with a label

This is now on our todo list. Most posts and Blogger forums / groups findings say, nay, forget it. Use a workaround. Then I struck gold. I haven't yet tested the hack, but it looks good,

We have another major re-design to do, we don't want to use the "read more" feature of post listings by deafult. Blogger has recently introduced the option to manually split the post using a button in the editor. And for a CMS-like website, this makes much more sense than listing summaries.

So we will reintroduce the normal Blogger code for the main posts, removing all the featured and post summary scripts... and then we'll try to test this hack by Blake Matheny. Or... maybe we'll find more hacks :-) Can't wait.

So as a reminder here are Blake's hacks:

First, search for the line that starts with <b:includable id='main' var='top'>. You are going to remove everything in that function between <b:loop values='data:posts' var='post'> and the closing tag with the following:

<b:if cond='data:blog.url == data:blog.homepageUrl'>

<b:if cond='data:post.labels'>

<b:loop values='data:post.labels' var='label'>

<b:if cond='data:label.name == "main"'>

<b:include data='post' name='printPosts'/>

</b:if>

</b:loop>

</b:if>

<b:else/>

<b:include data='post' name='printPosts'/>

</b:if>

The above change essentially says the following: if you are on the homepage, and a post has labels, and the post has the "main" label, then call printPosts. Or, if you are not on the homepage, call printPosts. Now search for the close tag of the main function (it looks like</b:includable>) and after it paste the following code:

<b:includable id='printPosts' var='post'>

<b:if cond='data:post.dateHeader'>

<h2 class='date-header'><data:post.dateHeader/></h2>

</b:if>

<b:include data='post' name='post'/>

<b:if cond='data:blog.pageType == "item"'>

<b:include data='post' name='comments'/>

</b:if>

</b:includable

The above code is your printPosts function/method. It is identical to what you had before, it was just turned into a function to reduce code duplication. That's it. Now only posts with a "main" label will show up on the front page. [...] To filter out content, just change the (== "main") markup to something like (!= "nsfw").

Posted via email from BeeCMS

Deleted and moved the 'footer' post-info paragraphes.

2010-01-09T18:36:00.001-08:00

Deleted the following paragraphes originally there from Nexus 5.

<footer class='post-info'>

<!--

<abbr class='published'>

<b:if cond='data:post.dateHeader'>

<data:post.dateHeader/>

</b:if>

</abbr>

<address class='vcard author'>

By

</address>

-->

</footer>

We moved the post.dateHeader part to the section class='footer'.

Reasoning, Author names usually are not used in classic website styles. Therefore the "post" has been moved left as well.

Posted via email from BeeCMS

The change log of Nexus 5 morphing into BeeCMS

2010-01-07T20:56:00.000-08:00

CSS defintions
Before

headerfont
generic entry, all other header font settings are related like h2, h3, and section specific and gadgets/widgets/boxes h2 definitions like "about", "extras", "featured"...
navbar (Menu Navigation Bar) colour is set in combination with normal text colour

Now

headerfont split into
headerfont1, headerfont2, ..., headerfont6
sectionheaderfont setting for all Gadget / Extras / About (bottom section ) / Startpage
sectionheadercolor to maintain the colour consistency of the section headers
navbar colours and text colours are separated

Other significant changes

Removing of author in post listings
Removing of 200px position of texts in listings (therefore the text listings start at 20px margin from the left as normal)
Removing of text limitation in #featured section
Removing of read more link in #featured section
Edited the section header of #featured (h2) to "Welcome to the home of"
The Label keyword needed for the start page post is now "Welcome" (used to be "Featured")
Used breadcrumbs code of bloggerplugins.org to replace the Blogger Status-Message
Used the neat trick of InstantFundas.com to create the start page using an "if then else" method rather then the simple "if then" of the original to make the posts list disappear from the homeurl.

Content Management using Bloggercom and the BeeCMS template

2010-01-05T17:41:00.000-08:00

BeeCMS is a template for Blogger.com, the free blog hosting service of Google. Blogger has become a powerful and versatile tool with very few restrictions. If you want free hosting, a possibility to maintain the site as a team and to enjoy the possibility of AJAX & Co Blogger is there for you.

BeeCMS is brought to you by BloggerCMS which is dedicated to blogger tools and template to use Blogger like a classic CMS for your website. Visually a little less like a blog, but with all the powerful tools and envirnment of Blogger :-)