Singpolyma

Archive of "Blogger"

Archive for the "Blogger" Category

The Bleet

Posted on

All geeks have their jargon, and the Blogger hacking community is no exception. One of the big words right now is ‘Bleet’ – the Blogger Elite. First coined by Avatar of Bloggeratto, this term is used to describe the best of the best of the Blogger hackers.

Wh!13 7h!5 m4y 83 r3m3n!53n7 0f 1337, 37c, the term seems to be gaining acceptance among non-hackers as well. Then the question becomes — how do we keep track of who’s ‘in’? 😉

Well, elite coders must write elite code. I’d hazard a guess that all Bleet members must be hacking the new Blogger by now, but what else? Who and what? What do you think?

I have created a survey with only three questions: the URL of a Bleet member (in your opinion), your favourite hack by this member, and one quality you think all Bleet should have. Note to the Bleet : do not vote for yourself!

Fill out the survey

Another note to the Bleet : Check out the Blogger Hacks Wrink and add yourself to it and it to your blog. You can use any of the modes (some people dislike webrings, some dislike extra blogrolls, we have options!) What’s the point? Well, right now that wrink is getting more than 500 traffic a week. This means that each week (unless my stats are broken) at least 500 people travel from one Bleet site to another using this widget. Great way for us to share our traffic with each other!

Static Pages in Blogger

Posted on

This is a long-standing feature/hack request from much of the Blogger community. Pages that are not posts. This hack is a little messy and not the be-all solution, but I feel it is mature enough to publish as a start.

The pages are all addressed as http://yourblog.blogspot.com/?page=pagename

As always there are multiple options for this hack, but the basic starting is the same:

  1. Go to Google Pages (you’re on the new Blogger, you have a Google Account) and create the page you want.
  2. Click the ‘View live’ link from the Google Pages editor (after publishing the page)
  3. Note the URL in the location bar / address bar, you will need it later

You will need to add this code to the <head> section of your blog first time only, subsequent pages you can skip this:

<script src='http://jscripts.ning.com/get.php?xn_auth=no&amp;id=2999987' type='text/javascript'/>

In code that follows, replace the red pagename with the what you want used as pagename in the URL (See above) and the red URL.

If you want to just redirect to the other page (example) use this code:

<script type='text/javascript'>

//make sure the WidgetData object and staticpage section are defined
if(typeof(WidgetData) != ‘object’) WidgetData = {};
if(typeof(WidgetData[‘staticpage’]) != ‘object’) WidgetData[‘staticpage’] = {};

WidgetData[‘staticpage’][‘pagename‘] = {
‘url’:’URL‘,
‘type’:’redirect’
};
</script>

If you want the other page superimposed in an IFRAME (example) use this code:

<script type='text/javascript'>

//make sure the WidgetData object and staticpage section are defined
if(typeof(WidgetData) != ‘object’) WidgetData = {};
if(typeof(WidgetData[‘staticpage’]) != ‘object’) WidgetData[‘staticpage’] = {};

WidgetData[‘staticpage’][‘pagename‘] = {
‘url’:’URL‘,
‘type’:’iframe’
};
</script>

If you want the other page superimposed (example) use this code:

<script type='text/javascript'>

//make sure the WidgetData object and staticpage section are defined
if(typeof(WidgetData) != ‘object’) WidgetData = {};
if(typeof(WidgetData[‘staticpage’]) != ‘object’) WidgetData[‘staticpage’] = {};

WidgetData[‘staticpage’][‘pagename‘] = {
‘url’:’URL
};
</script>

If you want the other page included in a DIV so that it fits better into your page (you must style the DIV so that it works well. The example simply styles it to fill the page), use this code and put a DIV in your code with an ID the same as pagename:

<script type='text/javascript'>

//make sure the WidgetData object and staticpage section are defined
if(typeof(WidgetData) != ‘object’) WidgetData = {};
if(typeof(WidgetData[‘staticpage’]) != ‘object’) WidgetData[‘staticpage’] = {};

WidgetData[‘staticpage’][‘pagename‘] = {
‘url’:’URL
};
</script>

If you want the other page included as an IFRAME in a DIV so that it fits better into your page (you must style the DIV so that it works well. The example simply styles it to fill the page), use this code and put a DIV in your code with an ID the same as pagename:

<script type='text/javascript'>

//make sure the WidgetData object and staticpage section are defined
if(typeof(WidgetData) != ‘object’) WidgetData = {};
if(typeof(WidgetData[‘staticpage’]) != ‘object’) WidgetData[‘staticpage’] = {};

WidgetData[‘staticpage’][‘pagename‘] = {
‘url’:’URL‘,
‘type’:’iframe’
};
</script>

Microsummaries in Blogger

Posted on

I recently learned of the Microsummaries feature of Firefox 2.0 from Aditya.

Basically, when you bookmark a site that supports it there is an option to have Firefox automatically pull in the title of the most recent article (or similar) as the title/label on the bookmark. Like simplified Live Bookmarks. So I created a quick hack to let us generate these with Blogger. If you have marked up your blog with hAtom put this in your <head> section:

<link expr:href='"http://xoxotools.ning.com/extract_by_class.php?xn_auth=no&amp;amp;class=entry-title&amp;amp;url=" + data:blog.homepageUrl + "&amp;amp;_microsummary"' rel='microsummary' />

Otherwise use this code, which should work for 90% of new Blogger blogs:

<link expr:href='"http://xoxotools.ning.com/extract_by_class.php?xn_auth=no&amp;amp;class=post-title&amp;amp;url=" + data:blog.homepageUrl + "&amp;amp;_microsummary"' rel='microsummary' />

Mostly hAtom in the New Blogger

Posted on

While 100% hAtom support under Blogger is impossible, we can get close. What is the use of that? Well, doing this will allow you to use the Backup Tool for one thing. Most other hAtom-related tools mentioned on this blog will also work with the results of these changes. Plus, it’s just generally an all-around good idea. (These instructions will work with most templates on the New Blogger, but if you cannot complete any steps for some reason, just skip them and it may still mostly work.) So, here’s how:

  1. Go to the ‘Edit HTML’ section under the ‘Template’ tab.
  2. Find the code that looks something like this:

    <b:includable id='post' var='post'>
    <div class='post uncustomized-post-template'>

    and replace it with this:

    <b:includable id='post' var='post'>
    <div class='post uncustomized-post-template hentry' expr:id='"post-" + data:post.id'>
  3. Find the code that looks something like this:

    <h3 class='post-title'>

    and replace it with this:

    <h3 class='post-title entry-title'>
  4. Find the code that looks something like this:

    <a expr:href='data:post.url'><data:post.title/></a>

    and replace it with this:

    <a rel='bookmark permalink' expr:href='data:post.url'><data:post.title/></a>
  5. Find the code that looks something like this:

    <div class='post-body'>

    and replace it with this:

    <div class='post-body entry-content'>
  6. Find the code that looks something like this:

    <span class='post-author'>
    <b:if cond='data:top.showAuthor'>
    <data:top.authorLabel/> <data:post.author/>
    </b:if>
    </span>

    and replace it with this:

    <span class='post-author author vcard'>
    <b:if cond='data:top.showAuthor'>
    <data:top.authorLabel/> <span class='fn'><data:post.author/></span>
    </b:if>
    </span>
  7. Find the code that looks something like this:

    <a class='timestamp-link' expr:href='data:post.url' title='permanent link'><data:post.timestamp/></a>

    and replace it with this:

    <a class='timestamp-link updated published' rel='bookmark permalink' expr:href='data:post.url' title='permanent link'><data:post.timestamp/></a>
  8. Find the code that looks something like this:

    <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>

    and replace it with this:

    <a class='comment-link' rel="comments" expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
    <b:loop values='data:post.feedLinks' var='f'><span style="display:none;">There is an <a expr:href='data:f.url + "?alt=rss"' rel='alternate comments'>RSS Feed</a> for comments on this post.</span></b:loop>
  9. Save your template.

New Tools and XOXO Blog Activity

Posted on

After a long period of inactivity I have revived the former XOXO Blog as XOXO – A Semantic Weblog. The following new tools have been announced:

There is also a discussion of distributed social netoworking and a new WordPress plugin to start implementing the idea.