mau membuat widget recent pos horizontal di blog kamu?
susah tidak ya?
ada solusi yang tepat buat kamu, cara paling mudah membuat recent post horizontal pada blog.
cara ini terbukti coba lihat saja di sini ,
terus bagaimana caranya:
1. copy kode script di bawah ini :
<style type="text/css">
#seocips-gallery { width:100%px; margin:0 auto; font:normal 11px Arial,Sans-Serif; color:#494848; padding:8px; background-color:transparant; -webkit-box-shadow:0 10px 30px rgba(0,0,0,0.4); -moz-box-shadow:0 10px 30px rgba(0,0,0,0.4); box-shadow:0 10px 30px rgba(0,0,0,0.4); -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; }
#seocips-gallery h2 { font:20px Arial,Sans-Serif; color:white; text-shadow:0 3px 2px black; text-transform:uppercase; margin:2px 2px 2px; padding:7px 14px; background-color:#48D; text-align:center; }
#seocips-gallery .bgt-item { float:left; display:inline; position:relative; margin:2px; padding:0 0; background:#fff url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyXmSuGCYejVg4Xnb7S899deu_RGFrpR21AbmHdy2xB8LfAHs7ySsahTKI_Tx-NNkU5RLW4ZZbMSFaGHGgMvx4mkH9bHc3sxGcGpJ-X1Wc0urnsIiKPn0mUdJhGWKgNQmZ9uJYcXqboZ8/s1600/seocipsldng.gif') no-repeat 50% 50%; width:85px; height:85px; }
#seocips-gallery .bgt-item img { width:85px; height:85px; border:none !important; margin:0 0 !important; padding:0 0 !important; background:transparent !important; display:none; }
#seocips-gallery .bgt-item .bgt-child { position:relative; top:10% !important; left:10% !important; z-index:1000; width:200px; background-color:white; border-top:5px solid #FA7C19; -webkit-box-shadow:5px 5px 10px rgba(0,0,0,0.7); -moz-box-shadow:5px 5px 10px rgba(0,0,0,0.7); box-shadow:5px 5px 10px rgba(0,0,0,0.7); padding:10px 15px; overflow:hidden; word-wrap:break-word; display:none; opacity:0.9; }
#seocips-gallery .bgt-item .bgt-child h4 { font-size:12px; margin:0 0 5px; color:#FA7C19; }
#seocips-gallery .bgt-item:hover .hidden { display:block; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
var bgtTitle = "Latest Posts",
numposts = 12,
numchar = 190,
rcFadeSpeed = 610,
pBlank = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIy5wLxf_rhzIMDx419r8ekHrT1xrUsdfA_bwGhqTrq5oHnFI7fMMH4JlyDeDGxj0pFkMxU7hr4TL5sp2dB2aYlLP7OuaQ13904xPZBqYn1ulou7emRKXzEQY4keJPlCKSXX2pKbLBEXM/s1600/no-image-ava.jpg",
blogURL = "https://pakrus.blogspot.com";
</script>
<script src="https://cdn.rawgit.com/Brando07/share/Updte/recnt-post-tooltip.js" type="text/javascript"></script>
#seocips-gallery { width:100%px; margin:0 auto; font:normal 11px Arial,Sans-Serif; color:#494848; padding:8px; background-color:transparant; -webkit-box-shadow:0 10px 30px rgba(0,0,0,0.4); -moz-box-shadow:0 10px 30px rgba(0,0,0,0.4); box-shadow:0 10px 30px rgba(0,0,0,0.4); -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; }
#seocips-gallery h2 { font:20px Arial,Sans-Serif; color:white; text-shadow:0 3px 2px black; text-transform:uppercase; margin:2px 2px 2px; padding:7px 14px; background-color:#48D; text-align:center; }
#seocips-gallery .bgt-item { float:left; display:inline; position:relative; margin:2px; padding:0 0; background:#fff url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyXmSuGCYejVg4Xnb7S899deu_RGFrpR21AbmHdy2xB8LfAHs7ySsahTKI_Tx-NNkU5RLW4ZZbMSFaGHGgMvx4mkH9bHc3sxGcGpJ-X1Wc0urnsIiKPn0mUdJhGWKgNQmZ9uJYcXqboZ8/s1600/seocipsldng.gif') no-repeat 50% 50%; width:85px; height:85px; }
#seocips-gallery .bgt-item img { width:85px; height:85px; border:none !important; margin:0 0 !important; padding:0 0 !important; background:transparent !important; display:none; }
#seocips-gallery .bgt-item .bgt-child { position:relative; top:10% !important; left:10% !important; z-index:1000; width:200px; background-color:white; border-top:5px solid #FA7C19; -webkit-box-shadow:5px 5px 10px rgba(0,0,0,0.7); -moz-box-shadow:5px 5px 10px rgba(0,0,0,0.7); box-shadow:5px 5px 10px rgba(0,0,0,0.7); padding:10px 15px; overflow:hidden; word-wrap:break-word; display:none; opacity:0.9; }
#seocips-gallery .bgt-item .bgt-child h4 { font-size:12px; margin:0 0 5px; color:#FA7C19; }
#seocips-gallery .bgt-item:hover .hidden { display:block; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
var bgtTitle = "Latest Posts",
numposts = 12,
numchar = 190,
rcFadeSpeed = 610,
pBlank = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIy5wLxf_rhzIMDx419r8ekHrT1xrUsdfA_bwGhqTrq5oHnFI7fMMH4JlyDeDGxj0pFkMxU7hr4TL5sp2dB2aYlLP7OuaQ13904xPZBqYn1ulou7emRKXzEQY4keJPlCKSXX2pKbLBEXM/s1600/no-image-ava.jpg",
blogURL = "https://pakrus.blogspot.com";
</script>
<script src="https://cdn.rawgit.com/Brando07/share/Updte/recnt-post-tooltip.js" type="text/javascript"></script>
2. masuk ke blogger.com
3. klik " tata letak "
4. pilih lokasi, klik " tambah gadget "
5. klik " html "
6. paste code script tadi pada kotak html, gantu link url yang berwarna merah dengan url kamu
7. klik " simpan "
coba lihat blog, widget recent post horizontal sudah terpasang pada blog kamu
