• Memasang Tag Label di Bawah Postingan



    1. Masuk ke akun blogger

    2. Langsung menuju ke halaman Edit HTML

    3. Cari kode ]]></b:skin> Lalu pastekan code di bawah ini tepat di atas kode  ]]</b:skin>

    
    /*Post Label*/
    .post-labels{float:left;display:block;width:100%;color:#999}
    .post-labels a{float:left;height:24px;line-height:24px;position:relative;font-size:12px;margin-left:12px;padding:0 10px;background:rgba(0,0,0,0.25);color:#fff;text-decoration:none;border-bottom-right-radius:3px;border-top-right-radius:3px}
    .post-labels a:before{content:"";float:left;position:absolute;top:0;left:-12px;width:0;height:0;border-color:transparent rgba(0,0,0,0.25) transparent transparent;border-style:solid;border-width:12px 12px 12px 0}
    .post-labels a:after{content:"";position:absolute;top:10px;left:-1px;float:left;width:4px;height:4px;border-radius:2px;background:#fff;transition:all .3s}
    .post-labels a:nth-child(1){background:#ca85ca}
    .post-labels a:nth-child(1):before{border-color:transparent #ca85ca transparent transparent}
    .post-labels a:nth-child(2){background:#e54e7e}
    .post-labels a:nth-child(2):before{border-color:transparent #e54e7e transparent transparent}
    .post-labels a:nth-child(3){background:#61c436}
    .post-labels a:nth-child(3):before{border-color:transparent #61c436 transparent transparent}
    .post-labels a:nth-child(4){background:#f4b23f}
    .post-labels a:nth-child(4):before{border-color:transparent #f4b23f transparent transparent}
    .post-labels a:nth-child(5){background:#46c49c}
    .post-labels a:nth-child(5):before{border-color:transparent #46c49c transparent transparent}
    .post-labels a:nth-child(6){background:#607ec7}
    .post-labels a:nth-child(6):before{border-color:transparent #607ec7 transparent transparent}
    .post-labels a:nth-child(7){background:#ca85ca}
    .post-labels a:nth-child(7):before{border-color:transparent #ca85ca transparent transparent}
    .post-labels a:nth-child(8){background:#e54e7e}
    .post-labels a:nth-child(8):before{border-color:transparent #e54e7e transparent transparent}
    .post-labels a:nth-child(9){background:#61c436}
    .post-labels a:nth-child(9):before{border-color:transparent #61c436 transparent transparent}
    .post-labels a:nth-child(10){background:#f4b23f}
    .post-labels a:nth-child(10):before{border-color:transparent #f4b23f transparent transparent}
    

    Cari kode <data:post.body/> (mungkin akan kamu temukan kode tersebut lebih dari satu, biasanya kode yang kedua yang di maksud) Jika sudah, ganti kode tersebut dengan kode dibawah ini

    
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
     <span class='post-labels'>
          <div id='maia-signature'/>
            <b:if cond='data:post.labels'>
              <span style='float: left;'>Tags: </span><b:loop values='data:post.labels' var='label'>
                <a expr:href='data:label.url + &quot;?max-results=6&quot;' expr:title='data:label.name' rel='tag nofollow'><data:label.name/></a>
              </b:loop>
            </b:if>
          </span>
    </b:if>
    

    Save dan lihat hasilnya.



    Cara kedua


    • masuk dulu ke blogger.com
    • Setelah login Pilih Menu TemplateEditHTML, Terus Cari Kode </head>
    • Kalo sudah ketemu, kalian masukan css dibawah ini tepat diatasnya
    • 
      <style type='text/css'>
      /*Post Label*/
      .post-labels{float:left;display:block;width:100%;color:#999}
      .post-labels a{float:left;height:24px;line-height:24px;position:relative;font-size:12px;margin-left:12px;padding:0 10px;background:rgba(0,0,0,0.25);color:#fff;text-decoration:none;border-bottom-right-radius:3px;border-top-right-radius:3px}
      .post-labels a:before{content:"";float:left;position:absolute;top:0;left:-12px;width:0;height:0;border-color:transparent rgba(0,0,0,0.25) transparent transparent;border-style:solid;border-width:12px 12px 12px 0}
      .post-labels a:after{content:"";position:absolute;top:10px;left:-1px;float:left;width:4px;height:4px;border-radius:2px;background:#fff;transition:all .3s}
      .post-labels a:nth-child(1){background:#ca85ca}
      .post-labels a:nth-child(1):before{border-color:transparent #ca85ca transparent transparent}
      .post-labels a:nth-child(2){background:#e54e7e}
      .post-labels a:nth-child(2):before{border-color:transparent #e54e7e transparent transparent}
      .post-labels a:nth-child(3){background:#61c436}
      .post-labels a:nth-child(3):before{border-color:transparent #61c436 transparent transparent}
      .post-labels a:nth-child(4){background:#f4b23f}
      .post-labels a:nth-child(4):before{border-color:transparent #f4b23f transparent transparent}
      .post-labels a:nth-child(5){background:#46c49c}
      .post-labels a:nth-child(5):before{border-color:transparent #46c49c transparent transparent}
      .post-labels a:nth-child(6){background:#607ec7}
      .post-labels a:nth-child(6):before{border-color:transparent #607ec7 transparent transparent}
      .post-labels a:nth-child(7){background:#ca85ca}
      .post-labels a:nth-child(7):before{border-color:transparent #ca85ca transparent transparent}
      .post-labels a:nth-child(8){background:#e54e7e}
      .post-labels a:nth-child(8):before{border-color:transparent #e54e7e transparent transparent}
      .post-labels a:nth-child(9){background:#61c436}
      .post-labels a:nth-child(9):before{border-color:transparent #61c436 transparent transparent}
      .post-labels a:nth-child(10){background:#f4b23f}
      .post-labels a:nth-child(10):before{border-color:transparent #f4b23f transparent transparent}
      </style>
      
    • Kalo sudah, selanjutnya kalian cari kode </article>
    • Kalo sudah ketemu, masukan HTML dibawah ini tepat diatasnya
    • 
      <b:if cond='data:blog.pageType == &quot;item&quot;'>
       <span class='post-labels'>
            <div id='maia-signature'/>
              <b:if cond='data:post.labels'>
                <span style='float: left;'>Tags: </span><b:loop values='data:post.labels' var='label'>
                  <a expr:href='data:label.url + &quot;?max-results=6&quot;' expr:title='data:label.name' rel='tag nofollow'><data:label.name/></a>
                </b:loop>
              </b:if>
            </span>
      </b:if>
      
      Jika Tags labelnya tidak sesuai misal tampil di bawah related post, kalian tinggal pindahkan html di atas sesuai keinginan kalian..
    • Kalo sudah sesuai, tinggal save template kalian n lihat hasilnya :)
    1 Komentar untuk " Memasang Tag Label di Bawah Postingan"

    Back To Top