Blogger & AngularJs - Is it a better love story than Twilight ?

May Allah`s peace , mercy and blessing be upon you

I shared recently a post about how I got that idea to use AngularJs with Blogger using RSS as a resource and modding comments. Today, I want to share with you my impressions after two weeks since I launched the experiment.

Disclaimer: The experiment was on this blog, it's a small personal blog with minimalistic design, limited number of posts and few visitors, so my judgement will be based on those facts. Behavior on larger blogs isn't guaranteed to be the same.

What I like about it ?

It's very light, swift and fast, the page is visible quickly even with using a custom font and many base64 resources, not to mention that Angular for a reason that I don't understand loads resources for all posts even if they aren't rendered nor in the DOM yet !!!

Blogger custom comment form [Wordpress like] - Part II

May Allah`s peace , mercy and blessing be upon you

Last time we transformed all inputs to a single JSON object which would be stored in a plain text comment and sent to the server , this time we will try to display those comments.

Ok we need to get the JSON string stored in comment's body from Blogger's database using :

<b:loop values='data:post.comments' var='comment'>
      <data:comment.body />
</b:loop>

Blogger custom comment form [Wordpress like] - Part I

May Allah`s peace , mercy and blessing be upon you

I was playing with Blogger's comment form using Firebug . If you don't know, Blogger uses an iframe to display the form , So because of the Cross-domain we can't style the form neither apply any Javascript code on it .

First, you need to know the major inconvenient of this method : comments will be considered as spam , So you have to check Not spam manually every time to make the comment visible (if you already administrating comments then you are used to).

Let's look at the next HTML code :

 
<form id="commentForm" method="POST" action="http://www.blogger.com/comment-iframe.do">
    <input type="text" id="user" placeholder="User Name" />
    <input type="email" id="email" placeholder="email" />
    <input type="url" id="url" placeholder="Website" />
    <textarea id="text"  placeholder="Text..."></textarea>
    <input type="hidden" name="commentBody" id="commentBody" />
    <input type="hidden" name="security_token" value="AAAAAAAAAAAAAAAAAAAAAAAAAA:***********" />
    <input type="hidden" name="blogID" value="**************" />
    <input type="hidden" name="postID" expr:value="data:post.id" />
    <input type="hidden" name="identityMenu" value="ANON" />
    <button id="sub">Submit</button>
</form>