Showing posts with label changelog. Show all posts
Showing posts with label changelog. Show all posts

Monday, January 11, 2010

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

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 :-)

Our 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 == &quot;static_page&quot;'>
        <b:include data='post' name='comments'/>
      </b:if>
      <b:if cond='data:blog.pageType == &quot;item&quot;'>
      <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'>
  <!-- posts -->

    <!-- <b:include data='top' name='status-message'/> -->
    <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 == &quot;home&quot;'>
                    <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/>
...


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

<b:includable id='main' var='top'>
  <!-- posts -->

    <!-- <b:include data='top' name='status-message'/> -->
    <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 == &quot;static_page&quot;'>
        <b:include data='post' name='comments'/>
      </b:if>
      <b:if cond='data:blog.pageType == &quot;item&quot;'>
      <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/>

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 :-)

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

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'>
  <!-- posts -->

    <!-- <b:include data='top' name='status-message'/> -->
    <b:include data='posts' name='breadcrumb'/>

    <data:defaultAdStart/>

    <b:if cond='data:blog.pageType != &quot;item&quot;'>
    

    <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 == &quot;static_page&quot;'>
        <b:include data='post' name='comments'/>
      </b:if>
      <b:if cond='data:blog.pageType == &quot;item&quot;'>
      <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 == &quot;static_page&quot;'>
        <b:include data='post' name='comments'/>
      </b:if>
      <b:if cond='data:blog.pageType == &quot;item&quot;'>
        <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'>
  <!-- posts -->

    <!-- <b:include data='top' name='status-message'/> -->
    <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 == &quot;static_page&quot;'>
        <b:include data='post' name='comments'/>
      </b:if>
      <b:if cond='data:blog.pageType == &quot;item&quot;'>
      <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 BloggerCMS

Removed the post summaries

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 != &quot;item&quot;'>

    <div expr:id='&quot;summary&quot; + data:post.id'>
       <data:post.body/>
    </div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script> 
<span class='rmlink' style='float:right; margin-right: 1px;'> Continue reading &raquo;</span>

      <div style='clear: both;'/> <!-- clear for photos floats -->

</b:if>


<b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div class='post-body entry-content'>
      <data:post.body/>
      <div style='clear: both;'/> <!-- clear for photos floats -->
    </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;'/> <!-- clear for photos floats -->
    </div>

Posted via email from BloggerCMS

Sunday, January 10, 2010

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

Deleted the following code (parsed)

    &lt;footer class=&#039;post-info&#039;&gt;
    &lt;!-- 
    &lt;abbr class=&#039;published&#039;&gt;
      &lt;b:if cond=&#039;data:post.dateHeader&#039;&gt;
      &lt;data:post.dateHeader/&gt;
      &lt;/b:if&gt;
    &lt;/abbr&gt;

    &lt;address class=&#039;vcard author&#039;&gt;
    By &lt;a class=&#039;url fn&#039; href=&#039;#&#039;&gt;&lt;data:post.author/&gt;&lt;/a&gt;
    &lt;/address&gt;
    --&gt;
    &lt;/footer&gt;

(here is the same code plain)

    <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 BloggerCMS