Bismillah, 
Assalamualaikum

Cara Tukar ke Hierarchy Blog Archived | Biasa kan kalau kita tukar template blog, ada yang widget blog archive jenis flat list, biasanya akan dapat yang ini, tukar dekat layout pun tetap ini developer bagi, kita tengok pun geram ja rasa, maklumlah entry yang lepas tak dapat tengok, template pula dibagi free, mengadap ja la..hihi so entry kali ini sha nak ajar korang tukar macam blog archive time kita mula-mula blog dulu..simple template akan dapat widget blog archive jenis hierarchy.



ada 3 jenis widget, kita kalau nak senang orang tengok latest dan oldest post yang hierarchy ni more better, tapi kalau dah tak pandai nak edit, apa boleh buat, lagi-lagi template free tu dah paling cantik di mata kita yang slack nya blog archive tu ja la..last-last tukar template lain..ini sebenarnya dah lama sha alami, sebagai pengedit blog tegar haha.


so mari la kita besarkan mata depan laptop, oh yah, entry ini sha nak creditkan dekat blogger yang punya tutorial ni, korang kalau tak faham bolehlah tengok entry dia ya, thanks to https://www.bolakatok.com/

Cara Tukar ke Hierarchy Blog Archived

Step 1. Masuk HTML dalam blog, sebelah kiri dashboard kan ada menu, klik theme, 2026 ni banyak function dah berubah, tapi masih senang nak faham lah. make sure sebelum mula korang copy siap-siap kod template lama korang,  save dekat text doc di laptop.

klik tombol down


klik edit HTML

Step 2. Cari kod b:css='false' tukarkan false ke true b:css='true' ) tengok gambar di bawah dan tekan save


Step 3. Sediakan Widget Blog Archive, pergi layout cari blog archive, ubah style ke hierarchy dan klik monthly, kemudian save.


Step 4. Cari kod Widget Blog Archive di HTML, <b:widget id='BlogArchive1' locked='false'

Copy dan paste kan kod dibawah dekat kod yang korang cari tu 
 <b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive' version='2' visible='true'>
            <b:widget-settings>
              <b:widget-setting name='showStyle'>HIERARCHY</b:widget-setting>
              <b:widget-setting name='yearPattern'>yyyy</b:widget-setting>
              <b:widget-setting name='showWeekEnd'>true</b:widget-setting>
              <b:widget-setting name='monthPattern'>MMMM</b:widget-setting>
              <b:widget-setting name='dayPattern'>MMM dd</b:widget-setting>
              <b:widget-setting name='weekPattern'>MM/dd</b:widget-setting>
              <b:widget-setting name='chronological'>false</b:widget-setting>
              <b:widget-setting name='showPosts'>true</b:widget-setting>
              <b:widget-setting name='frequency'>MONTHLY</b:widget-setting>
            </b:widget-settings>
            <b:includable id='main'>
  <b:if cond='data:title != &quot;&quot;'>
    <h2><data:title/></h2>
  </b:if>
  <div class='widget-content'>
  <div id='ArchiveList'>
  <div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>
    <b:include cond='data:style == &quot;HIERARCHY&quot;' data='data' name='interval'/>
    <b:include cond='data:style == &quot;FLAT&quot;' data='data' name='flat'/>
    <b:include cond='data:style == &quot;MENU&quot;' data='data' name='menu'/>
  </div>
  </div>
  <b:include name='quickedit'/>
  </div>
</b:includable>
            <b:includable id='content'>
  <div class='widget-content'>
    <div id='ArchiveList'>
      <div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>
        <b:include cond='data:this.style == &quot;HIERARCHY&quot;' name='hierarchy'/>
        <b:include cond='data:this.style in {&quot;FLAT&quot;, &quot;MENU&quot;}' name='flat'/>
      </div>
    </div>
  </div>
</b:includable>
            <b:includable id='flat' var='data'>
  <ul class='flat'>
    <b:loop values='data:data' var='i'>
      <li class='archivedate'>
        <a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)
      </li>
    </b:loop>
  </ul>
</b:includable>
            <b:includable id='hierarchy'>
  <b:include data='data' name='interval'/>
</b:includable>
            <b:includable id='interval' var='intervalData'>
  <b:loop values='data:intervalData' var='interval'>
    <ul class='hierarchy'>
      <li expr:class='&quot;archivedate &quot; + data:interval.expclass'>
        <b:include cond='data:interval.toggleId' data='interval' name='toggle'/>
        <a class='post-count-link' expr:href='data:interval.url'>
          <data:interval.name/>
        </a>
        <span class='post-count' dir='ltr'>(<data:interval.post-count/>)</span>
        <b:include cond='data:interval.data' data='interval.data' name='interval'/>
        <b:include cond='data:interval.posts' data='interval.posts' name='posts'/>
      </li>
    </ul>
  </b:loop>
</b:includable>
            <b:includable id='menu' var='data'>
  <select expr:id='data:widget.instanceId + &quot;_ArchiveMenu&quot;'>
    <option value=''><data:title/></option>
    <b:loop values='data:data' var='i'>
      <option expr:value='data:i.url'><data:i.name/> (<data:i.post-count/>)</option>
    </b:loop>
  </select>
</b:includable>
            <b:includable id='posts' var='posts'>
  <ul class='posts'>
    <b:loop values='data:posts' var='post'>
      <li><a expr:href='data:post.url'><data:post.title/></a></li>
    </b:loop>
  </ul>
</b:includable>
            <b:includable id='toggle' var='interval'>
  <a class='toggle' href='javascript:void(0)'>
    <span expr:class='&quot;zippy&quot; + (data:interval.expclass == &quot;expanded&quot; ? &quot; toggle-open&quot; : &quot;&quot;)'>
      <b:if cond='data:interval.expclass == &quot;expanded&quot;'>
        &#9660;&#160;
      <b:elseif cond='data:blog.languageDirection == &quot;rtl&quot;'/>
        &#9668;&#160;
      <b:else/>
        &#9658;&#160;
      </b:if>
    </span>
  </a>
</b:includable>
          </b:widget>



kalau korang tak tahu nak padam sampai mana, petunjuknya tengok widget bawah blog archive korang, macam sha total pageview so sha akan padam kod lama sampai </b;widget> ini maksudnya penutup kod widget tu, kalau salah jangan save. preview dan save

tengok jadi ke tak, kalau jadi alhamdulilah, boleh lah komen jadi, kalau tak jadi tengok balik step pertama mesti ada salah padam atau salah step..semoga berjaya, marilah kita mula mencantikkan blog agar semangat taip entry baru itu datang haha