Februari 24, 2016

Cara Memodifikasi Post Date di Blogspot


Sering ganti template blog? Pernah menemukan kendala post date atau tanggal posting atau date header nggak muncul di blog? Jadi ceritanya blog mykoreandrama.com ganti template, aku baru aja berjibaku ngotak-atik html blog mykoreandrama.com karena tanggal postingnya nggak nongol. Setelah sibuk Delete, Ctrl C dan Ctrl Z akhirnya nemu juga solusinya :D

Post date tidak terbaca
Langkah pertama,
Ganti settingan pada Bahasa dan pemformatan, juga pada Konfigurasi Posting Blog seperti dibawah ini.

Setting Bahasa dan pemformatan
Konfigurasi Posting Blog
Langkah kedua,
Cari pada html, script berikut :

<h2 class='date-header'><span><data:post.dateHeader/></span></h2>


Replace script tersebut dengan :

<div class='date-header'><span><script> replace_date(&#39;<data:post.dateHeader/>&#39;);</script></span></div>



Langkah ketiga,
Tambahkan script berikut diatas </head> .

<script type='text/javascript'>
//<![CDATA[
function replace_date(b){var a=b.split(' ');month="<span class='month'>"+a[0].slice(0,3)+"</span>";day=" <span class='day'>"+a[1].slice(0,2)+"</span><span class='sep'>, </span>";year="<span class='year'>"+a[2]+"</span>";document.write(month+day+year)};
//]]>
</script>

Langkah keempat,
Tambahkan script berikut diatas ]]></b:skin> .

.date-header {
  background: #fff000;
  color: #00000;
  float: left;
  position: relative;
  text-align: center;
  width: 50px;
}
.date-header:after {
  content: '';
  display: block;
  position: absolute;
  bottom: -10px;
  left: 0;
  border-color: ;

  .date-header .year {
  display: block;
}

.date-header .month {
  display: block;
}

.date-header .sep,
.date-header .year {
  clip: rect(2px 2px 2px ); /* IE6, IE7 */
  clip: rect(2px, 2px, 2px);
  clip: rect(2px, 2px, 2px);
  position: absolute !important;
}

.post {
  padding-left: 70px;
}

Dan taraaaaaaaaaaaa :D
Tampilannya jadi seperti ini.


Selamat mencoba :)



sumber referensi : optimasi-blog.blogspot.co.id

0 comments:

Posting Komentar