Saturday, December 7, 2019

√ Cara Menciptakan Recent Post Sederhana Responsive

Recent Post merupakan tampilan artikel-artikel terbaru dari sebuah blog. Cara menciptakan recent post majemuk menyerupai recent post thumbnail (bergambar), berwarna maupun recent post sederhana yang menampilkan judul artikelnya saja. Pada kesempatan kali ini, Kang AP akan memperlihatkan trik bagaimana cara menciptakan recent post sederhana responsive. Recent post ini sangat cocok sekali bagi anda yang suka kesederhanaan, begitupun dengan google yang suka dengan kesederhanaan. Jika anda tertarik, berikut langkah-langkahnya.


Baca juga :
» Cara Praktis Membuat Recent Post Thumbnail Keren Bergerak Turun
» Cara Membuat Tombol Share Efek 3D
» Cara Agar Postingan Blog Cepat Terindex Google

1. Pertama, anda login dulu ke Blogger

2. Pilih Tata Letak » Tambah Gadget

3. Selanjutnya pilih HTML/JavaScript

4. Masukkan aba-aba dibawah ini pada kolom HTML/JavaScript

<div id="tb">

<script style="text/j4vascript" src="http://tutorialblogspot.googlecode.com/files/recentpostnothumbnail.js"></script>

<script style="text/j4vascript">var numposts = 7;var showpostdate = false;var showpostsummary = false;var numchars = 100;var standardstyling = true;</script>

<script src="https://ap-thea.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script></div>

<style type=text/css>

#rpdr {background: url( https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBzDhJ-TvdPtAE_evJCZUgldSsxVR91CVDhi709CuralzCrVDECcqLXA5TcpC09kGQoxy4CXakToyQ4eGflZYOBjbdzbsGeTb8jlcgwGRzzzXoNoXm6nTiHvotpAxm1F8FdqmSrHWrG4of/s1600/blogger.png ) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 5px 0px 0px 0px;line-height:14px;}

#rpdr, #rpdr a {color:none;}

#tb { }

.bbrecpost2 {

padding-top:6px;

padding-bottom:6px;

border-bottom: 1px #cccccc dotted; }

</style> </ul><a href="https://goo.gl/cYwSjy" target="_blank">Salam Blogger</a>


Note.
» Warna hijau merupakan jumlah postingan yang akan ditampilkan
» Ganti URL yang berwarna biru dengan URL anda

5. Simpan dan lihat hasilnya

Demikian cara menciptakan recent post sederhana responsive, agar sanggup membantu dan bermanfaat. terima kasih atas kunjungannya and happy blogging.


Sumber http://ap-thea.blogspot.com


EmoticonEmoticon