Cara Membuat Tulisan " New " Pada Artikel Terbaru

Bagikan :

Tweet

Hai Sobat, kali ini saya akan share " Cara Membuat Tulisan " New " Pada Artikel Terbaru ". Cara Ini cocok untuk menambah keindahan homepage anda agar lebih keren dan responsive.
Mau tau caranya... Lanjut Ke Tutorialnya...

Cara Membuat Tulisan " New " Pada Artikel Terbaru

1. Masuk Ke Beranda Blogger > Template > Edit Html
2. Cari Kode ]]></b:skin> Atau </style> Untuk Mempermudah Pencarian Anda Dapat Tekan CTRL + F
3. Masukkan Kode Di Bawah Ini Di Atas Kode ]]></b:skin> Atau </style>

.first-post
.post.hentry:before {
content:"";
width: 65px;
height: 65px;
position: absolute; right: -2px; top: -2px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHypVTEYqanBqL0Fm7MZUEuSE18lniA7XjI7hh9mLtyjfXddJbtySTTHWPi0_D4r1-eHDzaj_F5_8zQ2Teyr3exMxOMKoi9WEv-aqSA643LMhzqiyAwJaoR1myQDuEQYR_EGCbrx1kedPF/s1600/New+Blue+-+Cak+Yit.png) no-repeat;
background-size: 70px 70px; }

Untuk Mengganti Warna Yang Lain Anda Dapat Menggunakan Kode Berikut

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBUnRbFFxH2ADD-2PKXESYhzUHmhGgk0vDmNm58wSUkBdMSkaLvWFmIzuntCtcfcGjazRnEWQ5O13KI5Apif6GlEHHWCz7c3BIxsjjv0OahOGy3FWF5QquiYkfZgaM-OVXcwwaXhFSCgQO/s1600/New+Black+-+Cak+Yit.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHypVTEYqanBqL0Fm7MZUEuSE18lniA7XjI7hh9mLtyjfXddJbtySTTHWPi0_D4r1-eHDzaj_F5_8zQ2Teyr3exMxOMKoi9WEv-aqSA643LMhzqiyAwJaoR1myQDuEQYR_EGCbrx1kedPF/s1600/New+Blue+-+Cak+Yit.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCj4OALb9Xpuo6DSRg1sjqcTNusVJbJ13hY2hDGytq-XEnn9TfabBdZ97sEMoNbUU59oKll1j0m8xFEwSag-WPXKveBRJeP0A0F7szNVzTfkd52EuisYAz7h9R_FLAJ0Rr48SU68SONZ3r/s1600/New+Cyan+-+Cak+Yit.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglXMn6S5NZTVBiZy-HJrpHoriv9nmvCrl1Pp4o8R21xo8vTAc3QHNrVb9wYve19wCSeJkx9tqEAiOd011vTjDt3W9UdffWSW3UjnWk2D8nN-zvc7BXJNdkbXsGdJ0Ud96IxiTgX3zj4mxy/s1600/New+Green+-+Cak+Yit.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7LYQPWqedB_lzX-UzT1lF_WSWQtLafhil5cILe2eANN6Fs5FHY2tTBjARNas9ejE2aZKWFje_MA4KuihbehoEKQA9wvYOzzLygTFydhInSvqvCWJDjzKHSSL0Kv86f8hQC0Yfyx69w83Q/s1600/New+Orange+-+Cak+Yit.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLrRXeOuWyYbOe2LwFQp7CIsIwYe3Og4qGqe9m5vbQ46c-A3rpq7CJIExoUVNWW8Ms826Hz4y0RGvpQ5KRl6IpktlGU-ZB7DIDypmdA59Pwu74iMNjvu3lJhjqvyaIJzwBdS7aiTYDFv_e/s1600/New+Pink+-+Cak+Yit.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5N74lxIg1Tk1NuxseRCslZQfWezfXSQIq3hI-XgOBX7AaMBw4BUPTYYMj4GfFPRGcsC73rP5eXFLx9hutGTQeDBmlMXIHigkb4f6Hr5YWWrQR6X7UogiOzwOUkSgL4ZitHEI8x8fzLS4L/s1600/New+Red+-+Cak+Yit.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3kr-jx29ULRxv0JdHCNKeiynZ07I6t5wLC5hraL4-bhl3mXYc_dQJ79ITutF2B9dczKtBESTVz3od3drZrT8vQYlE-FWjIYLKaK6T_JdM3jbrPAsd-8krPTrEZ6EwCnEp_jjKQr4WQSma/s1600/New+Yellow+-+Cak+Yit.png

4. Cari Kode <b:include data='post' name='post'/>, Ganti Dengan Kode Di Bawah Ini

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:post.isFirstPost == &quot;true&quot;'>
<div class='first-post'>
<b:include data='post' name='post'/>
</div>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>

5. Klik Simpan

Update Tulisan New 2015 - 12 - 23

http://1.bp.blogspot.com/-3KgXV7o7KSM/Vmw-xE0YZEI/AAAAAAAAAsQ/AFeAPva2db8/s1600/icon-new-label.png

Tag : Tutorial Blog, Widget