Selasa, 30 Agustus 2016

Kerangka Template Blogger yang Paling Sederhana v2

Pada artikel "kerangka template blogger yang paling sederhana" yang sebelumnya, ada beberapa bagian yang tidak berfungsi dengan baik. Setelah aku coba-coba, alhamdulillah bagian yang tidak berfungsi sudah beres. Ini mark up nya:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
 <head>
  <b:include data='blog' name='all-head-content'/>
  <b:if cond='data:blog.pageType == &quot;index&quot;'>
   <title><data:blog.title/></title>
   <b:else/>
   <title><data:blog.pageName/> | <data:blog.title/></title>
  </b:if>
  <b:skin><![CDATA[]]></b:skin>
  <link href='file.css' rel='stylesheet' type='text/css'/>
  <style>
   .navbar { display: none; }
   .Attribution { display: none; }
   .Header { display: none; }
  </style>
 </head>
 <body>

  <b:section class='main' id='main' showaddelement='no'>
   <b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog' version='1' visible='true'>
    <b:includable id='main' var='top'>
     <b:if cond='!data:mobile'>
      <!-- posts -->
      <div class='blog-posts hfeed'>

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

       <b:loop values='data:posts' var='post'>
        <b:if cond='data:post.isDateStart and not data:post.isFirstPost'>
         &lt;/div&gt;&lt;/div&gt;
        </b:if>
        <b:if cond='data:post.isDateStart'>
         &lt;div class=&quot;date-outer&quot;&gt;
        </b:if>
        <b:if cond='data:post.dateHeader'>
         <h2 class='date-header'><span><data:post.dateHeader/></span></h2>
        </b:if>
        <b:if cond='data:post.isDateStart'>
         &lt;div class=&quot;date-posts&quot;&gt;
        </b:if>
        <div class='post-outer'>
         <b:include data='post' name='post'/>
         <b:include cond='data:blog.pageType in {&quot;static_page&quot;,&quot;item&quot;}' data='post' name='comment_picker'/>
        </div>

        <!-- Ad -->
        <b:if cond='data:post.includeAd'>
         <div class='inline-ad'>
          <data:adCode/>
         </div>
        </b:if>
       </b:loop>
       <b:if cond='data:numPosts != 0'>
        &lt;/div&gt;&lt;/div&gt;
       </b:if>
      </div>

      <!-- navigation -->
      <b:include name='nextprev'/>

      <!-- feed links -->
      <b:include name='feedLinks'/>

      <b:else/>
      <b:include name='mobile-main'/>
     </b:if>

     <b:if cond='data:top.showPlusOne'>
      <data:top.googlePlusBootstrap/>
     </b:if>

    </b:includable>
    <b:includable id='backlinkDeleteIcon' var='backlink'>
     <span expr:class='&quot;item-control &quot; + data:backlink.adminClass'>
      <a expr:href='data:backlink.deleteUrl' expr:title='data:top.deleteBacklinkMsg'>
       <img src='https://resources.blogblog.com/img/icon_delete13.gif'/>
      </a>
     </span>
    </b:includable>
    <b:includable id='backlinks' var='post'>
     <a name='links'/><h4><data:post.backlinksLabel/></h4>
     <b:if cond='data:post.numBacklinks != 0'>
      <dl class='comments-block' id='comments-block'>
       <b:loop values='data:post.backlinks' var='backlink'>
        <div class='collapsed-backlink backlink-control'>
         <dt class='comment-title'>
          <span class='backlink-toggle-zippy'>&#160;</span>
          <a expr:href='data:backlink.url' rel='nofollow'><data:backlink.title/></a>
          <b:include data='backlink' name='backlinkDeleteIcon'/>
         </dt>
         <dd class='comment-body collapseable'>
          <data:backlink.snippet/>
         </dd>
         <dd class='comment-footer collapseable'>
          <span class='comment-author'><data:post.authorLabel/> <data:backlink.author/></span>
          <span class='comment-timestamp'><data:post.timestampLabel/> <data:backlink.timestamp/></span>
         </dd>
        </div>
       </b:loop>
      </dl>
     </b:if>
     <p class='comment-footer'>
      <a class='comment-link' expr:href='data:post.createLinkUrl' expr:id='data:widget.instanceId + &quot;_backlinks-create-link&quot;' target='_blank'><data:post.createLinkLabel/></a>
     </p>
    </b:includable>
    <b:includable id='comment-form' var='post'>
     <div class='comment-form'>
      <a name='comment-form'/>
      <b:if cond='data:mobile'>
       <h4 id='comment-post-message'>
        <a expr:id='data:widget.instanceId + &quot;_comment-editor-toggle-link&quot;' href='javascript:void(0)'><data:postCommentMsg/></a></h4>
       <p><data:blogCommentMessage/></p>
       <data:blogTeamBlogMessage/>
       <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
       <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' expr:height='data:cmtIframeInitialHeight' frameborder='0' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
       <b:else/>
       <h4 id='comment-post-message'><data:postCommentMsg/></h4>
       <p><data:blogCommentMessage/></p>
       <data:blogTeamBlogMessage/>
       <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
       <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' expr:height='data:cmtIframeInitialHeight' frameborder='0' id='comment-editor' name='comment-editor' src='' width='100%'/>
      </b:if>
      <data:post.friendConnectJs/>
      <data:post.cmtfpIframe/>
      <script type='text/javascript'>
       BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;);
      </script>
     </div>
    </b:includable>
    <b:includable id='commentDeleteIcon' var='comment'>
     <span expr:class='&quot;item-control &quot; + data:comment.adminClass'>
      <b:if cond='data:showCmtPopup'>
       <div class='goog-toggle-button'>
        <div class='goog-inline-block comment-action-icon'/>
       </div>
       <b:else/>
       <a class='comment-delete' expr:href='data:comment.deleteUrl' expr:title='data:top.deleteCommentMsg'>
        <img src='https://resources.blogblog.com/img/icon_delete13.gif'/>
       </a>
      </b:if>
     </span>
    </b:includable>
    <b:includable id='comment_count_picker' var='post'>
     <b:if cond='data:post.commentSource == 1'>
      <span class='cmt_count_iframe_holder' expr:data-count='data:post.numComments' expr:data-onclick='data:post.addCommentOnclick' expr:data-post-url='data:post.url' expr:data-url='data:post.url.canonical.http'>
      </span>
      <b:else/>
      <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
       <data:post.commentLabelFull/>:
      </a>
     </b:if>
    </b:includable>
    <b:includable id='comment_picker' var='post'>
     <b:if cond='data:post.commentSource == 1'>
      <b:include data='post' name='iframe_comments'/>
      <b:elseif cond='data:post.showThreadedComments'/>
      <b:include data='post' name='threaded_comments'/>
      <b:else/>
      <b:include data='post' name='comments'/>
     </b:if>
    </b:includable>
    <b:includable id='comments' var='post'>
     <div class='comments' id='comments'>
      <a name='comments'/>
      <b:if cond='data:post.allowComments'>
       <h4><data:post.commentLabelFull/>:</h4>

       <b:if cond='data:post.commentPagingRequired'>
        <span class='paging-control-container'>
         <b:if cond='data:post.hasOlderLinks'>
          <a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'><data:post.oldestLinkText/></a>
          &#160;
          <a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'><data:post.olderLinkText/></a>
          &#160;
         </b:if>

         <data:post.commentRangeText/>

         <b:if cond='data:post.hasNewerLinks'>
          &#160;
          <a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'><data:post.newerLinkText/></a>
          &#160;
          <a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'><data:post.newestLinkText/></a>
         </b:if>
        </span>
       </b:if>

       <div expr:id='data:widget.instanceId + &quot;_comments-block-wrapper&quot;'>
        <dl expr:class='data:post.avatarIndentClass' id='comments-block'>
         <b:loop values='data:post.comments' var='comment'>
          <dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
           <b:if cond='data:comment.favicon'>
            <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
           </b:if>
           <a expr:name='data:comment.anchorName'/>
           <b:if cond='data:blog.enabledCommentProfileImages'>
            <data:comment.authorAvatarImage/>
           </b:if>
           <b:if cond='data:comment.authorUrl'>
            <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
            <b:else/>
            <data:comment.author/>
           </b:if>
           <data:commentPostedByMsg/>
          </dt>
          <dd class='comment-body' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'>
           <b:if cond='data:comment.isDeleted'>
            <span class='deleted-comment'><data:comment.body/></span>
            <b:else/>
            <p>
             <data:comment.body/>
            </p>
           </b:if>
          </dd>
          <dd class='comment-footer'>
           <span class='comment-timestamp'>
            <a expr:href='data:comment.url' title='comment permalink'>
             <data:comment.timestamp/>
            </a>
            <b:include data='comment' name='commentDeleteIcon'/>
           </span>
          </dd>
         </b:loop>
        </dl>
       </div>

       <b:if cond='data:post.commentPagingRequired'>
        <span class='paging-control-container'>
         <a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'>
          <data:post.oldestLinkText/>
         </a>
         <a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'>
          <data:post.olderLinkText/>
         </a>
         &#160;
         <data:post.commentRangeText/>
         &#160;
         <a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'>
          <data:post.newerLinkText/>
         </a>
         <a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'>
          <data:post.newestLinkText/>
         </a>
        </span>
       </b:if>

       <p class='comment-footer'>
        <b:if cond='data:post.embedCommentForm'>
         <b:if cond='data:post.allowNewComments'>
          <b:include data='post' name='comment-form'/>
          <b:else/>
          <data:post.noNewCommentsText/>
         </b:if>
         <b:elseif cond='data:post.allowComments'/>
         <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
        </b:if>
       </p>
      </b:if>
      <b:if cond='data:showCmtPopup'>
       <div id='comment-popup'>
        <iframe allowtransparency='true' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'>
        </iframe>
       </div>
      </b:if>

      <div id='backlinks-container'>
       <div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'>
        <b:include cond='data:post.showBacklinks' data='post' name='backlinks'/>
       </div>
      </div>
     </div>
    </b:includable>
    <b:includable id='feedLinks'>
     <b:if cond='data:blog.pageType != &quot;item&quot;'> <!-- Blog feed links -->
      <b:if cond='data:feedLinks'>
       <div class='blog-feeds'>
        <b:include data='feedLinks' name='feedLinksBody'/>
       </div>
      </b:if>

      <b:else/> <!--Post feed links -->
      <div class='post-feeds'>
       <b:loop values='data:posts' var='post'>
        <b:include cond='data:post.allowComments and data:post.feedLinks' data='post.feedLinks' name='feedLinksBody'/>
       </b:loop>
      </div>
     </b:if>
    </b:includable>
    <b:includable id='feedLinksBody' var='links'>
     <div class='feed-links'>
      <data:feedLinksMsg/>
      <b:loop values='data:links' var='f'>
       <a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>
      </b:loop>
     </div>
    </b:includable>
    <b:includable id='iframe_comments' var='post'>

     <b:if cond='data:post.allowIframeComments'>
      <script expr:src='data:post.iframeCommentSrc' type='text/javascript'/>
      <div class='cmt_iframe_holder' expr:data-href='data:post.url.canonical' expr:data-viewtype='data:post.viewType'/>

      <b:if cond='data:post.embedCommentForm == &quot;false&quot;'>
       <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
      </b:if>
     </b:if>
    </b:includable>
    <b:includable id='mobile-index-post' var='post'>
     <div class='mobile-date-outer date-outer'>
      <b:if cond='data:post.dateHeader'>
       <div class='date-header'>
        <span><data:post.dateHeader/></span>
       </div>
      </b:if>

      <div class='mobile-post-outer'>
       <a expr:href='data:post.url'>
        <h3 class='mobile-index-title entry-title' itemprop='name'>
         <data:post.title/>
        </h3>

        <div class='mobile-index-arrow'>&amp;rsaquo;</div>

        <div class='mobile-index-contents'>
         <b:if cond='data:post.thumbnailUrl'>
          <div class='mobile-index-thumbnail'>
           <div class='Image'>
            <img expr:src='data:post.thumbnailUrl'/>
           </div>
          </div>
         </b:if>

         <div class='post-body'>
          <b:if cond='data:post.snippet'><data:post.snippet/></b:if>
         </div>
        </div>

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

       <div class='mobile-index-comment'>
        <b:include cond='data:blog.pageType != &quot;static_page&quot;              and data:post.allowComments              and data:post.numComments != 0' data='post' name='comment_count_picker'/>
       </div>
      </div>
     </div>
    </b:includable>
    <b:includable id='mobile-main' var='top'>
     <!-- posts -->
     <div class='blog-posts hfeed'>

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

      <b:if cond='data:blog.pageType == &quot;index&quot;'>
       <b:loop values='data:posts' var='post'>
        <b:include data='post' name='mobile-index-post'/>
       </b:loop>
       <b:else/>
       <b:loop values='data:posts' var='post'>
        <b:include data='post' name='mobile-post'/>
       </b:loop>
      </b:if>
     </div>

     <b:include name='mobile-nextprev'/>
    </b:includable>
    <b:includable id='mobile-nextprev'>
     <div class='blog-pager' id='blog-pager'>
      <b:if cond='data:newerPageUrl'>
       <div class='mobile-link-button' id='blog-pager-newer-link'>
        <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'>&amp;lsaquo;</a>
       </div>
      </b:if>

      <b:if cond='data:olderPageUrl'>
       <div class='mobile-link-button' id='blog-pager-older-link'>
        <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'>&amp;rsaquo;</a>
       </div>
      </b:if>

      <div class='mobile-link-button' id='blog-pager-home-link'>
       <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
      </div>

      <div class='mobile-desktop-link'>
       <a class='home-link' expr:href='data:desktopLinkUrl'><data:desktopLinkMsg/></a>
      </div>

     </div>
     <div class='clear'/>
    </b:includable>
    <b:includable id='mobile-post' var='post'>
     <div class='date-outer'>
      <b:if cond='data:post.dateHeader'>
       <h2 class='date-header'><span><data:post.dateHeader/></span></h2>
      </b:if>
      <div class='date-posts'>
       <div class='post-outer'>

        <div class='post hentry uncustomized-post-template' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
         <b:if cond='data:post.thumbnailUrl'>
          <meta expr:content='data:post.thumbnailUrl' itemprop='image_url'/>
         </b:if>
         <meta expr:content='data:blog.blogId' itemprop='blogId'/>
         <meta expr:content='data:post.id' itemprop='postId'/>

         <a expr:name='data:post.id'/>
         <b:if cond='data:post.title'>
          <h3 class='post-title entry-title' itemprop='name'>
           <b:if cond='data:post.link'>
            <a expr:href='data:post.link'><data:post.title/></a>
            <b:elseif cond='data:post.url and data:blog.url != data:post.url'/>
            <a expr:href='data:post.url'><data:post.title/></a>
            <b:else/>
            <data:post.title/>
           </b:if>
          </h3>
         </b:if>

         <div class='post-header'>
          <div class='post-header-line-1'/>
         </div>

         <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='articleBody'>
          <data:post.body/>
          <div style='clear: both;'/> <!-- clear for photos floats -->
         </div>

         <div class='post-footer'>
          <div class='post-footer-line post-footer-line-1'>
           <span class='post-author vcard'>
            <b:if cond='data:top.showAuthor'>
             <b:if cond='data:post.authorProfileUrl'>
              <span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
               <meta expr:content='data:post.authorProfileUrl' itemprop='url'/>
               <a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
                <span itemprop='name'><data:post.author/></span>
               </a>
              </span>
              <b:else/>
              <span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
               <span itemprop='name'><data:post.author/></span>
              </span>
             </b:if>
            </b:if>
           </span>

           <span class='post-timestamp'>
            <b:if cond='data:top.showTimestamp'>
             <data:top.timestampLabel/>
             <b:if cond='data:post.url'>
              <meta expr:content='data:post.url.canonical' itemprop='url'/>
              <a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601' itemprop='datePublished'><data:post.timestamp/></abbr></a>
             </b:if>
            </b:if>
           </span>

           <span class='post-comment-link'>
            <b:include cond='data:blog.pageType not in {&quot;item&quot;,&quot;static_page&quot;}                  and data:post.allowComments' data='post' name='comment_count_picker'/>
           </span>
          </div>

          <div class='post-footer-line post-footer-line-2'>
           <b:if cond='data:top.showMobileShare'>
            <div class='mobile-link-button goog-inline-block' id='mobile-share-button'>
             <a href='javascript:void(0);'><data:shareMsg/></a>
            </div>
           </b:if>
           <b:if cond='data:top.showDummy'>
            <div class='goog-inline-block dummy-container'><data:post.dummyTag/></div>
           </b:if>
          </div>

         </div>
        </div>

        <b:include cond='data:blog.pageType in {&quot;static_page&quot;,&quot;item&quot;}' data='post' name='comment_picker'/>
       </div>
      </div>
     </div>
    </b:includable>
    <b:includable id='nextprev'>
     <div class='blog-pager' id='blog-pager'>
      <b:if cond='data:newerPageUrl'>
       <span id='blog-pager-newer-link'>
        <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
       </span>
      </b:if>

      <b:if cond='data:olderPageUrl'>
       <span id='blog-pager-older-link'>
        <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
       </span>
      </b:if>

      <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>

      <b:if cond='data:mobileLinkUrl'>
       <div class='blog-mobile-link'>
        <a expr:href='data:mobileLinkUrl'><data:mobileLinkMsg/></a>
       </div>
      </b:if>

     </div>
     <div class='clear'/>
    </b:includable>
    <b:includable id='post' var='post'>
     <div class='post hentry uncustomized-post-template' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
      <b:if cond='data:post.firstImageUrl'>
       <meta expr:content='data:post.firstImageUrl' itemprop='image_url'/>
      </b:if>
      <meta expr:content='data:blog.blogId' itemprop='blogId'/>
      <meta expr:content='data:post.id' itemprop='postId'/>

      <a expr:name='data:post.id'/>
      <b:if cond='data:post.title'>
       <h3 class='post-title entry-title' itemprop='name'>
        <b:if cond='data:post.link or (data:post.url and data:blog.url != data:post.url)'>
         <a expr:href='data:post.link ? data:post.link : data:post.url'><data:post.title/></a>
         <b:else/>
         <data:post.title/>
        </b:if>
       </h3>
      </b:if>

      <div class='post-header'>
       <div class='post-header-line-1'/>
      </div>

      <!-- Then use the post body as the schema.org description, for good G+/FB snippeting. -->
      <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' expr:itemprop='(data:blog.metaDescription ? &quot;&quot; : &quot;description &quot;) + &quot;articleBody&quot;'>
       <data:post.body/>
       <div style='clear: both;'/> <!-- clear for photos floats -->
      </div>

      <b:if cond='data:post.hasJumpLink'>
       <div class='jump-link'>
        <a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
       </div>
      </b:if>

      <div class='post-footer'>
       <div class='post-footer-line post-footer-line-1'>
        <span class='post-author vcard'>
         <b:if cond='data:top.showAuthor'>
          <data:top.authorLabel/>
          <b:if cond='data:post.authorProfileUrl'>
           <span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
            <meta expr:content='data:post.authorProfileUrl' itemprop='url'/>
            <a class='g-profile' expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
             <span itemprop='name'><data:post.author/></span>
            </a>
           </span>
           <b:else/>
           <span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
            <span itemprop='name'><data:post.author/></span>
           </span>
          </b:if>
         </b:if>
        </span>

        <span class='post-timestamp'>
         <b:if cond='data:top.showTimestamp'>
          <data:top.timestampLabel/>
          <b:if cond='data:post.url'>
           <meta expr:content='data:post.url.canonical' itemprop='url'/>
           <a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'><abbr class='published' expr:title='data:post.timestampISO8601' itemprop='datePublished'><data:post.timestamp/></abbr></a>
          </b:if>
         </b:if>
        </span>

        <span class='reaction-buttons'>
         <b:if cond='data:top.showReactions'>
          <table border='0' cellpadding='0' cellspacing='0' width='100%'><tr>
           <td class='reactions-label-cell' nowrap='nowrap' valign='top' width='1%'>
            <span class='reactions-label'>
             <data:top.reactionsLabel/></span>&#160;</td>
           <td><iframe allowtransparency='true' class='reactions-iframe' expr:src='data:post.reactionsUrl' frameborder='0' name='reactions' scrolling='no'/></td>
           </tr></table>
         </b:if>
        </span>

        <span class='post-comment-link'>
         <b:include cond='data:blog.pageType not in {&quot;item&quot;,&quot;static_page&quot;}              and data:post.allowComments' data='post' name='comment_count_picker'/>
        </span>

        <!-- backlinks -->
        <span class='post-backlinks post-comment-link'>
         <b:if cond='data:blog.pageType not in {&quot;item&quot;,&quot;static_page&quot;}            and data:post.showBacklinks'>
          <a class='comment-link' expr:href='data:post.url + &quot;#links&quot;'><data:top.backlinkLabel/></a>
         </b:if>
        </span>

        <span class='post-icons'>
         <!-- email post links -->
         <b:if cond='data:post.emailPostUrl'>
          <span class='item-action'>
           <a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
            <img alt='' class='icon-action' height='13' src='https://resources.blogblog.com/img/icon18_email.gif' width='18'/>
           </a>
          </span>
         </b:if>

         <!-- quickedit pencil -->
         <b:include data='post' name='postQuickEdit'/>
        </span>

        <!-- share buttons -->
        <div class='post-share-buttons goog-inline-block'>
         <b:include cond='data:post.sharePostUrl' data='post' name='shareButtons'/>
        </div>

       </div>

       <div class='post-footer-line post-footer-line-2'>
        <span class='post-labels'>
         <b:if cond='data:top.showPostLabels and data:post.labels'>
          <data:postLabelsLabel/>
          <b:loop values='data:post.labels' var='label'>
           <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='not data:label.isLast'>,</b:if>
          </b:loop>
         </b:if>
        </span>
       </div>

       <div class='post-footer-line post-footer-line-3'>
        <span class='post-location'>
         <b:if cond='data:top.showLocation and data:post.location'>
          <data:postLocationLabel/>
          <a expr:href='data:post.location.mapsUrl' target='_blank'><data:post.location.name/></a>
         </b:if>
        </span>
       </div>
       <b:if cond='data:post.authorAboutMe'>
        <div class='author-profile' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
         <b:if cond='data:post.authorPhoto.url'>
          <img expr:src='data:post.authorPhoto.url' itemprop='image' width='50px'/>
         </b:if>
         <div>
          <a class='g-profile' expr:href='data:post.authorProfileUrl' itemprop='url' rel='author' title='author profile'>
           <span itemprop='name'><data:post.author/></span>
          </a>
         </div>
         <span itemprop='description'><data:post.authorAboutMe/></span>
        </div>
       </b:if>
      </div>
     </div>
    </b:includable>
    <b:includable id='postQuickEdit' var='post'>
     <b:if cond='data:post.editUrl'>
      <span expr:class='&quot;item-control &quot; + data:post.adminClass'>
       <a expr:href='data:post.editUrl' expr:title='data:top.editPostMsg'>
        <img alt='' class='icon-action' height='18' src='https://resources.blogblog.com/img/icon18_edit_allbkg.gif' width='18'/>
       </a>
      </span>
     </b:if>
    </b:includable>
    <b:includable id='shareButtons' var='post'>
     <b:if cond='data:top.showEmailButton'><a class='goog-inline-block share-button sb-email' expr:href='data:post.sharePostUrl + &quot;&amp;target=email&quot;' expr:title='data:top.emailThisMsg' target='_blank'><span class='share-button-link-text'><data:top.emailThisMsg/></span></a></b:if><b:if cond='data:top.showBlogThisButton'><a class='goog-inline-block share-button sb-blog' expr:href='data:post.sharePostUrl + &quot;&amp;target=blog&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=270,width=475\&quot;); return false;&quot;' expr:title='data:top.blogThisMsg' target='_blank'><span class='share-button-link-text'><data:top.blogThisMsg/></span></a></b:if><b:if cond='data:top.showTwitterButton'><a class='goog-inline-block share-button sb-twitter' expr:href='data:post.sharePostUrl + &quot;&amp;target=twitter&quot;' expr:title='data:top.shareToTwitterMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToTwitterMsg/></span></a></b:if><b:if cond='data:top.showFacebookButton'><a class='goog-inline-block share-button sb-facebook' expr:href='data:post.sharePostUrl + &quot;&amp;target=facebook&quot;' expr:onclick='&quot;window.open(this.href, \&quot;_blank\&quot;, \&quot;height=430,width=640\&quot;); return false;&quot;' expr:title='data:top.shareToFacebookMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToFacebookMsg/></span></a></b:if><b:if cond='data:top.showPinterestButton'><a class='goog-inline-block share-button sb-pinterest' expr:href='data:post.sharePostUrl + &quot;&amp;target=pinterest&quot;' expr:title='data:top.shareToPinterestMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToPinterestMsg/></span></a></b:if><b:if cond='data:top.showPlusOne'><div class='goog-inline-block google-plus-share-container'><data:post.googlePlusShareTag/></div></b:if>
    </b:includable>
    <b:includable id='status-message'>
     <b:if cond='data:navMessage'>
      <div class='status-msg-wrap'>
       <div class='status-msg-body'>
        <data:navMessage/>
       </div>
       <div class='status-msg-border'>
        <div class='status-msg-bg'>
         <div class='status-msg-hidden'><data:navMessage/></div>
        </div>
       </div>
      </div>
      <div style='clear: both;'/>
     </b:if>
    </b:includable>
    <b:includable id='threaded-comment-form' var='post'>
     <div class='comment-form'>
      <a name='comment-form'/>
      <b:if cond='data:mobile'>
       <p><data:blogCommentMessage/></p>
       <data:blogTeamBlogMessage/>
       <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
       <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' expr:height='data:cmtIframeInitialHeight' frameborder='0' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
       <b:else/>
       <p><data:blogCommentMessage/></p>
       <data:blogTeamBlogMessage/>
       <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
       <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' expr:height='data:cmtIframeInitialHeight' frameborder='0' id='comment-editor' name='comment-editor' src='' width='100%'/>
      </b:if>
      <data:post.friendConnectJs/>
      <data:post.cmtfpIframe/>
      <script type='text/javascript'>
       BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;);
      </script>
     </div>
    </b:includable>
    <b:includable id='threaded_comment_js' var='post'>
     <script async='async' expr:src='data:post.commentSrc' type='text/javascript'/>

     <script type='text/javascript'>
      (function() {
       var items = <data:post.commentJso/>;
       var msgs = <data:post.commentMsgs/>;
       var config = <data:post.commentConfig/>;

       // <![CDATA[
       var cursor = null;
       if (items && items.length > 0) {
        cursor = parseInt(items[items.length - 1].timestamp) + 1;
       }

       var bodyFromEntry = function(entry) {
        if (entry.gd$extendedProperty) {
         for (var k in entry.gd$extendedProperty) {
          if (entry.gd$extendedProperty[k].name == 'blogger.contentRemoved') {
           return '<span class="deleted-comment">' + entry.content.$t + '</span>';
          }
         }
        }
        return entry.content.$t;
       }

       var parse = function(data) {
        cursor = null;
        var comments = [];
        if (data && data.feed && data.feed.entry) {
         for (var i = 0, entry; entry = data.feed.entry[i]; i++) {
          var comment = {};
          // comment ID, parsed out of the original id format
          var id = /blog-(\d+).post-(\d+)/.exec(entry.id.$t);
          comment.id = id ? id[2] : null;
          comment.body = bodyFromEntry(entry);
          comment.timestamp = Date.parse(entry.published.$t) + '';
          if (entry.author && entry.author.constructor === Array) {
           var auth = entry.author[0];
           if (auth) {
            comment.author = {
             name: (auth.name ? auth.name.$t : undefined),
             profileUrl: (auth.uri ? auth.uri.$t : undefined),
             avatarUrl: (auth.gd$image ? auth.gd$image.src : undefined)
            };
           }
          }
          if (entry.link) {
           if (entry.link[2]) {
            comment.link = comment.permalink = entry.link[2].href;
           }
           if (entry.link[3]) {
            var pid = /.*comments\/default\/(\d+)\?.*/.exec(entry.link[3].href);
            if (pid && pid[1]) {
             comment.parentId = pid[1];
            }
           }
          }
          comment.deleteclass = 'item-control blog-admin';
          if (entry.gd$extendedProperty) {
           for (var k in entry.gd$extendedProperty) {
            if (entry.gd$extendedProperty[k].name == 'blogger.itemClass') {
             comment.deleteclass += ' ' + entry.gd$extendedProperty[k].value;
            } else if (entry.gd$extendedProperty[k].name == 'blogger.displayTime') {
             comment.displayTime = entry.gd$extendedProperty[k].value;
            }
           }
          }
          comments.push(comment);
         }
        }
        return comments;
       };

       var paginator = function(callback) {
        if (hasMore()) {
         var url = config.feed + '?alt=json&v=2&orderby=published&reverse=false&max-results=50';
         if (cursor) {
          url += '&published-min=' + new Date(cursor).toISOString();
         }
         window.bloggercomments = function(data) {
          var parsed = parse(data);
          cursor = parsed.length < 50 ? null
          : parseInt(parsed[parsed.length - 1].timestamp) + 1
          callback(parsed);
          window.bloggercomments = null;
         }
         url += '&callback=bloggercomments';
         var script = document.createElement('script');
         script.type = 'text/javascript';
         script.src = url;
         document.getElementsByTagName('head')[0].appendChild(script);
        }
       };
       var hasMore = function() {
        return !!cursor;
       };
       var getMeta = function(key, comment) {
        if ('iswriter' == key) {
         var matches = !!comment.author
         && comment.author.name == config.authorName
         && comment.author.profileUrl == config.authorUrl;
         return matches ? 'true' : '';
        } else if ('deletelink' == key) {
         return config.baseUri + '/delete-comment.g?blogID='
         + config.blogId + '&postID=' + comment.id;
        } else if ('deleteclass' == key) {
         return comment.deleteclass;
        }
        return '';
       };

       var replybox = null;
       var replyUrlParts = null;
       var replyParent = undefined;

       var onReply = function(commentId, domId) {
        if (replybox == null) {
         // lazily cache replybox, and adjust to suit this style:
         replybox = document.getElementById('comment-editor');
         if (replybox != null) {
          replybox.height = '250px';
          replybox.style.display = 'block';
          replyUrlParts = replybox.src.split('#');
         }
        }
        if (replybox && (commentId !== replyParent)) {
         replybox.src = '';
         document.getElementById(domId).insertBefore(replybox, null);
         replybox.src = replyUrlParts[0]
         + (commentId ? '&parentID=' + commentId : '')
         + '#' + replyUrlParts[1];
         replyParent = commentId;
        }
       };

       var hash = (window.location.hash || '#').substring(1);
       var startThread, targetComment;
       if (/^comment-form_/.test(hash)) {
        startThread = hash.substring('comment-form_'.length);
       } else if (/^c[0-9]+$/.test(hash)) {
        targetComment = hash.substring(1);
       }

       // Configure commenting API:
       var configJso = {
        'maxDepth': config.maxThreadDepth
       };
       var provider = {
        'id': config.postId,
        'data': items,
        'loadNext': paginator,
        'hasMore': hasMore,
        'getMeta': getMeta,
        'onReply': onReply,
        'rendered': true,
        'initComment': targetComment,
        'initReplyThread': startThread,
        'config': configJso,
        'messages': msgs
       };

       var render = function() {
        if (window.goog && window.goog.comments) {
         var holder = document.getElementById('comment-holder');
         window.goog.comments.render(holder, provider);
        }
       };

       // render now, or queue to render when library loads:
       if (window.goog && window.goog.comments) {
        render();
       } else {
        window.goog = window.goog || {};
        window.goog.comments = window.goog.comments || {};
        window.goog.comments.loadQueue = window.goog.comments.loadQueue || [];
        window.goog.comments.loadQueue.push(render);
       }
      })();
      // ]]>
     </script>
    </b:includable>
    <b:includable id='threaded_comments' var='post'>
     <div class='comments' id='comments'>
      <a name='comments'/>
      <h4><data:post.commentLabelFull/>:</h4>

      <div class='comments-content'>
       <b:include cond='data:post.embedCommentForm' data='post' name='threaded_comment_js'/>
       <div id='comment-holder'>
        <data:post.commentHtml/>
       </div>
      </div>

      <p class='comment-footer'>
       <b:if cond='data:post.allowNewComments'>
        <b:include data='post' name='threaded-comment-form'/>
        <b:else/>
        <data:post.noNewCommentsText/>
       </b:if>
      </p>

      <b:if cond='data:showCmtPopup'>
       <div id='comment-popup'>
        <iframe allowtransparency='true' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'>
        </iframe>
       </div>
      </b:if>

      <div id='backlinks-container'>
       <div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'>
        <b:include cond='data:post.showBacklinks' data='post' name='backlinks'/>
       </div>
      </div>
     </div>
    </b:includable>

   </b:widget>
  </b:section>

  <div id='footer-right'>
   <b:section class='footer' id='footer-r' preferred='yes'>
    <b:widget id='Label1' locked='false' title='Labels' type='Label' version='1' visible='true'>
     <b:includable id='main'>
      <b:if cond='data:title'>
       <h2><data:title/></h2>
      </b:if>
     </b:includable>
    </b:widget>
   </b:section>
  </div>

 </body>
</html>

Senin, 29 Agustus 2016

Struktur XML dari JSON Callback=showrecentcomments

Inilah yang didapat dari JSON Show Recent Comments

"id":{"$t":"tag:blogger.com,1999:blog-2155713361567759727.post-8923788124016647560"},
"published":{"$t":"2016-03-21T23:12:03.186+07:00"},
"updated":{"$t":"2016-03-21T23:12:03.186+07:00"},
"title":{"type":"text","$t":"aamiin. iya, cak, saling mengingatkan ya... :-D"},
"content":{"type":"html","$t":"aamiin. iya, cak, saling mengingatkan ya... :-D"},
"link":[{"rel":"edit","type":"application/atom+xml","href":"http:\/\/www.blogger.com\/feeds\/2155713361567759727\/3338584723370144814\/comments\/default\/8923788124016647560"},
{"rel":"self","type":"application/atom+xml","href":"http:\/\/www.blogger.com\/feeds\/2155713361567759727\/3338584723370144814\/comments\/default\/8923788124016647560"},
{"rel":"alternate","type":"text/html","href":"http:\/\/h.eru.web.id\/2016\/03\/tetaplah-rendah-hati.html?showComment=1458576723186#c8923788124016647560","title":""},
{"rel":"related","type":"application/atom+xml","href":"http:\/\/www.blogger.com\/feeds\/2155713361567759727\/3338584723370144814\/comments\/default\/5328275533318240188"}],"author":[{"name":{"$t":"Heru Sularto"},
"uri":{"$t":"http:\/\/www.blogger.com\/profile\/17725291692732329184"},
"email":{"$t":"noreply@blogger.com"},
"gd$image":{"rel":"http://schemas.google.com/g/2005#thumbnail","width":"32","height":"32","src":"\/\/lh4.googleusercontent.com\/-b3-ZhjRprlU\/AAAAAAAAAAI\/AAAAAAAAG_I\/s8twol6h-q8\/s512-c\/photo.jpg"}}],"thr$in-reply-to":{"xmlns$thr":"http://purl.org/syndication/thread/1.0","href":"http:\/\/h.eru.web.id\/2016\/03\/tetaplah-rendah-hati.html","ref":"tag:blogger.com,1999:blog-2155713361567759727.post-3338584723370144814","source":"http://www.blogger.com/feeds/2155713361567759727/posts/default/3338584723370144814","type":"text/html"},
"gd$extendedProperty":[{"name":"blogger.itemClass","value":"pid-869219936"},
{"name":"blogger.displayTime","value":"21 Maret 2016 23.12"}]},

Hayo, bingung nggak kamu... Hehehe

Senin, 15 Agustus 2016

Types of Operators

This section describes the operators you can use inside an expression on a Widget tag for Layouts.

Equivalence

When to use an 'equivalence' operator

The equivalence operators are useful when you want to check what a data value is.


Supported Syntax

== and !=


Examples
Not-equal operator
Use the not-equal != operator to check if the title of a widget is empty.

<b:if cond=’data:title != “”’>

   <h3> <data:title /> </h3>

</b:if>
Equal operator
Use the == operator to check if you're on the home page.

<b:if cond=’data:blog.pageType == “index”’>

  <p>Homepage! </p>

</b:if>

And

When to use the 'and' Operator

The and operator is most useful when you want to combine the conditions under which a Widget tag is evaluated, such as a b:if tag. This prevents you having to nest multiple b:if tags inside each other.


Supported Syntax

and and &&


Examples

Here's an example that shows when to use the and operator in a b:if tag.
Without 'and'
Without an and operator, we would need two nested b:if tags.


<b:if cond=’data:blog.pageType not in {"item","static_page"}’>
   <b:if cond=’data:post.allowComments’>
       <b:include name='comment_count_picker' data='post' />
  </b:if>
</b:if>


With 'and'
With an and operator, we can put both conditions into one b:if tag.
<b:if cond=’data:blog.pageType not in {"item","static_page"} and data:post.allowComments’>
    <b:include name='comment_count_picker' data='post' />

</b:if>

Or

When to use the 'or' operator

The or operator is most useful when you want to combine several conditions, any of which would be satisfactory, under which a Widget tag such as a b:if tag is rendered. This prevents you having to repeat yourself.

Supported Syntax

or and ||

Examples

Here's an example that shows when to use the or operator in a b:if tag.
Without 'or'
With an or operator, we would need two b:if tags.

<b:if cond='data:imagePlacement == "REPLACE"’>
     <b:include name="image" />
</b:if>
<b:if cond=’data:imagePlacement == “BEFORE_DESCRIPTION”’>
     <b:include name=”image” />
</b:if>

With 'or'
With an or operator, we can put both conditions into one b:if tag.
<b:if cond=’data:imagePlacement == “BEFORE_DESCRIPTION” or data:imagePlacement == “REPLACE”’>
     <b:include name=”image” />
</b:if>

Not

When to use the 'not' operator

The not operator is most useful when you want to operate under the condition that something is not true, like ab:if tag. This prevents you having to write an empty b:if tag just so that you can populate the b:else tag.

Supported Syntax

! and not

Examples

Here's an example that shows how to use the not operator in a b:if tag, to only show a byline on some pages.

<b:if cond=’not data:blog.pageType in {“static_page”, “index”}’>

    <b:include name=”comments_byline” />

</b:if>


Ternary

When to use a Ternary operator

You can use the ternary operator to select one of two values in-line, such as on an attribute of an HTML tag.

Syntax

[condition] ? [result when true] : [result when false]

Example

Here's an example that shows how to use the ternary operator in an HTML div tag to apply a different CSS class when comments are allowed, then when they're not allowed.

<div expr:class=’data:post.allowComments ? “comments” : “no-comments”’>


</div>

Membership

When to use a Membership operator

You can use the membership operator to check if a value is one of several possible values. This prevents you having to have several or conditions with equivalence operators.

Syntax

Define a set using { } or [ ], then apply the in and contains operators.

Examples

Here's an example that shows how to use the contains membership operator to check if the page type is a static page, or a single post.

<b:if cond=’{“item”, “static_page”} contains data:blog.pageType’>

  <p>Single Post or Page! </p>

</div>

Here's an example that shows how to use the in membership operator to check if the page type is the home page, or an archive page.

<b:if cond=’data:blog.pageType in [“index”, “archive”]’>

  <p>Homepage or Archive Page! </p>


</div>

Lambda

When to use a Lambda expression

Lambda expressions are useful when you want to check if a condition is true for one, all, or none of the items in a set. You can also use it to filter a set of items, or map a set of items to a new set.

Syntax

[set of items] [lambda operator] ([lambda expression])
Lambda expressions have the format
[variable name] => [expression]
Note that variable name can be any string of letters. Generally, for brevity, we choose a relevant letter, like x, but it could be a longer name like label or myVariableName.
As an example, an expression for determining the count of posts with at least one comment would be:
data:posts count (p => p.numComments > 0)
In this example, data:posts is the set, count is the lambda operator, and p => p.numComments > 0 is the lambda expression. The count operator counts the number of items in the set data:posts for which the expression p => p.numComments > 0 is true, i.e. the number of posts with at least one comment.
As another example, to add a flower image if the post is labelled ‘Flower’:
<b:if cond=’data:post.labels any (label => label.name == “Flower”)’>
   <img src=’/img/flower.jpg’ />
</b:if>

Lambda Operators


any
Returns true if any of the items in the set returns true for the lambda expression
all
Returns true if all of the items in the set return true for the lambda expression
none
Returns true if none of the items in the set return true for the lambda expression
count
Returns the count of the items in the set which return true for the lambda expression
filter
Returns a set of items for which the lambda expression is true
map
Returns a set containing each of the results of the lambda expression
first
Returns the first item for which the lambda expression is true

Resize

When to use image resize operators

The image resize operators are useful when you want to ensure that an image is displayed in a suitable size. Generally this will be used to get a cropped thumbnail of an image, or to create a responsive image for a mobile-friendly template.

Syntax

Resize a single image url
resizeImage(imageUrl, newSize, optionalRatio)
The resizeImage operator takes 3 parameters:
  1. imageUrl - The original URL of the resizable image.
  2. newSize - The new width of the image
  3. (optional) ratio - The integer ratio of width to height for the resized image, e.g. “1:1” or “4:3”
Notes
  • If the imageUrl parameter is not a resizable image, the resizeImage function will return the original imageUrl.
  • The ratio must be integer numbers.
  • If the ratio is provided, the image will be cropped to those exact dimensions.
Example
<img expr:src=’resizeImage(data:post.firstImageUrl, 300)’ />

Create a responsive image srcset

sourceSet(imageUrl, newSizes, optionalRatio)
The sourceSet operator takes 3 parameters:
  1. imageUrl - The original URL of the resizable image.
  2. newSizes - An array of new widths of the image
  3. (optional) ratio - The integer ratio of width to height for the resized image, e.g. “1:1” or “4:3”
Notes
  • If the imageUrl parameter is not a resizable image, the sourceSet function will return an empty string
  • The ratio must be integer numbers
  • If the ratio is provided, the image will be cropped to those exact dimensions
Example

<img expr:src=’data:post.firstImageUrl’ expr:srcset=’sourceSet(data:post.firstImageUrl, [128, 256, 512])’ />

Sumber : https://productforums.google.com/forum/#!topic/blogger/59LGf47pPP8