MEMBUAT RECENT POST SCROLL KE BAWAH DENGAN TUMBNAIL KEREN

Halo blogger jumpa lagi bersama saya adpati, Sebelumnya ku ucapkan selamat datang di blog kesayangan saya ini, semoga kalian tidak jenuh-jenuh untuk selalu mengunjungi blog ini. Nah pada kesempatan kali ini dari blog Adpati akan mempersembahkan sebuah kode script blog untuk menambahkan Widget Recent Post atau Artikel Terbaru.


Nah sebelum kita mulai mohon dukungannya demi kemajuan blog ini tekan follow via email untuk berlangganan atau bisa juga Klik Subscribe di bagian halaman paling bawah. Oke sebelumnya terima kasih. Mari kita lanjut.

Yang akan kita bahas di sini ialah tutorial menambahkan widget  Recent Post yang di mana dengan widget ini Akan menambah tampilan blog kalian menjadi lebih keren.


Apa itu recent post?

Recent post adalah sebuah widget berisi link postingan terbaru kalian yang dimana dengan widget ini biasanya artikel akan tampil otomatis di blog kalian ketika kalian memposting sebuah artikel baru. Adpati akan membagikan script recent post unik dengan thumbnail gambar dan bisa di scroll ke bawah buat kalian pengunjung blog ini tentunya dan gratis. Dengan script ini kalian bisa mengatur jumlah postingan terbaru dan tidak akan memakan banyak tempat.


Nah bagaimana cara buatnya simak yuk.

1). Kalian buka akun Blogger kalian.
2). Masuk Tata Letak - Tambahkan Widget - HTML. Lalu Copy script di bawah ini.

<div style="border: 0px solid #FF00FF; height: 500px; overflow: auto; padding: 3px; width: auto;">
<style scoped='' type='text/css'>
#recent-posts{color:#ff0000;font-size:12px}
#recent-posts img{background:#fafafa;float:left;height:60px;margin-right:8px;width:60px;border-radius:4px}
#recent-posts ul{margin:0;padding:0}
#recent-posts ul li{margin:0 0 10px 0;padding:0 0 10px 0;border-bottom:1px solid rgba(0,0,0,0.2)}
#recent-posts ul li:last-child{border-bottom:0}
<script type='text/javaScript'>
#recent-posts ul li a{display:block;color:#3300ff;font-weight:700;text-decoration:none;font-size:14px;margin:0 0 10px 0;line-height:normal}
</style> <div id='recent-posts'> var rcp_numposts=15; var rcp_snippet_length=200; var rcp_info='yes'; var rcp_comment='Comment';
function recent_posts(json){var dw='';a=location.href;y=a.indexOf('?m=0');dw+='<ul>';for(var i=0;i<rcp_numposts;i++){var entry=json.feed.entry[i];var rcp_posttitle=entry.title.$t;if('content'in entry){var rcp_get_snippet=entry.content.$t}else{if('summary'in entry){var rcp_get_snippet=entry.summary.$t}else{var rcp_get_snippet="";}};rcp_get_snippet=rcp_get_snippet.replace(/<[^>]*>/g,"");if(rcp_get_snippet.length<rcp_snippet_length){var rcp_snippet=rcp_get_snippet}else{rcp_get_snippet=rcp_get_snippet.substring(0,rcp_snippet_length);var space=rcp_get_snippet.lastIndexOf(" ");rcp_snippet=rcp_get_snippet.substring(0,space)+"&#133;";};for(var j=0;j<entry.link.length;j++){if('thr$total'in entry){var rcp_commentsNum=entry.thr$total.$t+' '+rcp_comment}else{rcp_commentsNum=rcp_disable};if(entry.link[j].rel=='alternate'){var rcp_posturl=entry.link[j].href;if(y!=-1){rcp_posturl=rcp_posturl+'?m=0'}var rcp_postdate=entry.published.$t;if('media$thumbnail'in entry){var rcp_thumb=entry.media$thumbnail.url}else{rcp_thumb="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbqfqHNKtBNiUAtEX3cV1d0r_3vovTQ3Cqoj4HUTSnCuD8iP8Evzvp_SafHSl1zvG4iyZO4z2mhZAe5XjOrhJZR53HDBpgNRcOwPbqIVJxctAaQQ8EF6vxk2BD3XB1NV8MrJbEflIGfBqO/"};}};dw+='<li>';dw+='<img alt="'+rcp_posttitle+'" src="'+rcp_thumb+'"/>';dw+='<div><a href="'+rcp_posturl+'" rel="nofollow" title="'+rcp_snippet+'">'+rcp_posttitle+'</a></div>';if(rcp_info=='yes'){dw+='<span>'+rcp_postdate.substring(8,10)+'/'+rcp_postdate.substring(5,7)+'/'+rcp_postdate.substring(0,4)+' - '+rcp_commentsNum+'</span>';};dw+='<div style="clear:both"></div></li>';};dw+='</ul>';document.getElementById('recent-posts').innerHTML=dw;};document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results='+rcp_numposts+'&callback=recent_posts\"><\/script>');
var rcp_disable='T?t Nh?n x�t';
</script>
</div></div>

3). Paste kan di bagian Tambahkan Widget
4). Lalu simpan

Baca Juga



*ket:

  • var rcp_numposts=12; ( angka 12 adalah jumlah postingan. Silahkan atur sendiri)
  • #ff00ff; height: 500px; overflow: auto; padding: 3px; width: auto;"> (angka 500 adalah lebar kotak kebawah)
  • <div style="border: 1px groove #00ff00; padding: 6px;"> ( 1px adalah ketebalan garis luar dalam)
  • <div style="border: 1px groove #00ff00; padding: 6px;"> (#00ff00 adalah kode warna)
Demikian sedikit ulasan tentang tutorial membuat recent post dengan thumbnail gambar dan bisa di scroll ke bawah. Semoga bisa membantu buat para blogger pemula. Sekian dan terima kasih..

MEMPERCANTIK KURSOR MOUSE DI BLOG

Cara Mudah Mengganti Tampilan Kursor di Blog



Kursor atau penunjuk mouse adalah tanda yang menyatakan posisi mouse atau kursor pada layar monitor. Tanda ini umumnya dijumpai dengan bentuk anak panah baik pada komputer maupun pada blog. Akan tetapi tahukah anda bahwa tanda ini sebenarnya bisa diubah dan disesuaikan sesuka hati. Jika anda pernah mengunjungi sebuah blog atau situs di internet dan melihat bentuk dari kursor berbeda dari biasanya, yang mana bentuk-bentuk dari kursor tersebut terlihat begitu unik.

Dan bagi anda yang saat ini memiliki sebuah blog, tentunya untuk dapat menarik pengunjung agar mau singgah pada blog kita adalah harapan besar anda. Salah satu cara yangefektif untuk dapat menarik minat pengunjung yang mampir pada blog adalah buatlah tampilan blog sedemikian rupa agar terlihat cantik dan menarik. Dan salah satu cara untuk dapat membuat tampilan blog terlihat menarik adalah dengan menambahkan pernak-pernik widget, seperti salah satunya saat ini tim bisikan.com akan membisikan bagaiaman cara untuk dapat mengganti tampilan kursor pada blog untuk membuat tampilan blog terlihat lebih menarik.

Baca Juga



langkah-langkahnya 
  1. Langkah pertama, terlebih dahulu buka browser internet pada komputer. Semenatara tunggu hingga halaman browser dimunculkan. 
  2. Langkah kedua, silahkan masuk ke dashboard blog. Untuk dapat log in ke dasboard blog, ketikan alamat “Blogger.com” kemudian tunggu hingga halaman depan blogger dimunculkan. Langkah ketiga, silahkan log in ke blog menggunakan akun gmail yang anda gunakan saat membuat blog. 
  3. Kini anda telah masuk pada dashboard blog. Selanjutnya, tinggalkan terlebih dahulu halaman ini dan buka tab baru. 
  4. Kemudian cari situs yang menyediakan berbagai bentuk unik kursor untuk blog, yang bisa anda unduh secara gratis. Namun jika anda masih belum memiliki link untuk dapat mencari kursor unik untuk blog, berikut ini salah satu contoh link rekomendasi yang bisa anda kunjungi  www.cursors-4u.com
  5. Jika link diatas sudah diakses, maka anda akan disuguhkan banyak contoh kursor, yang mana bisa anda pilih salah satunya.
  6. Tak hanya itu, anda juga dapat memilih kategori yang anda inginkan, yang terletak dikolm seblah kiri. 
  7. Silahkan pilih salah satu kursor yang anda sukai untuk dapat digunakna pada blog anda. 
  8. Jika sudah dipilih, klik pada gambar kursor tersebut utnuk mendapatkan kode dari kursornya. 
  9. Selanjutnya, silahkan copy-kan kode HTML dari kursor tersebut. Selanjutnya pasangkan kode tersebut pada blog anda. 
  10. Untuk memasangkan kode HTML kursor pada blog, pilih menu Tata Letak>> Tambahkan Gadget>> HTML/JavaScript kemudian paste kode pada kolom script. 
  11. Kemudian akhiri dengan menekan tombol Simpan.  

CARA MEMBUAT SITEMAP ATAU PETA SITUS BLOGGER 2019

Apakah kalian seorang blogger?
Baik pemula atau yang sudah master pasti tidak asing dengan istilah Sitemap dan Peta Situs. Sitemap atau peta situs sering di sebut juga sebagai Daftar isi. Sebuah Website atau Situs web di sarankan untuk membuat daftar isi tersebut selain memudahkan untuk pengindexan artikel atau postingan juga sebagai salah satu jalan keluar untuk memperbanyak pengunjung blog.

Kenapa begitu?
Dengan memasang Sitemap pada halaman Situs web membantu pengunjung untuk mendapatkan informasi yang mereka cari dan membantu pengunjung untuk menjelajahi seluruh isi blog atau web tersebut. Oleh karena itu Sitemap berperan aktif untuk sebuah blog. Bagi para publisher adsense memasang Peta situs merupakan hal yang bisa dikatakan wajib. Memasang sitemap adalah syarat untuk mendaftarkan ke Google Adsense.

Berikut lanangragiel akan mengulas dan mempersembahkan sebuah kode script sitemap html yang secara otomatis akan meload semua artikel yang berada di situs web kalian.
Untuk cara pemasangan simak di bawah ini:
1). Masuk akun Blogger - Halaman - Buat Halaman baru - HTML
2). Isi judul dengan nama Sitemap.Dan Copy kode di bawah ini,pastekan di bagian HTML bukan COMPOSE.

<div id="toc">
<script src="https://cdn.rawgit.com/penaindigo/Pena-Indigo-Code/a134f9de/sitemappenaindigo.js" type="text/javascript"></script>
<script src="http://alamat.blogkamu.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script></div>
<link href="https://cdn.rawgit.com/penaindigo/project/d4a73206/penaindigocom.css" rel="stylesheet"></link>

3). Ubah Url: alamat.blogkamu.com dengan alamat Blog kalian.
4). Setelah itu simpan.

Baca Juga

Dalam tahap ini berarti anda sudah berhasil membuat sitemap situs web. Coba kalian publikasi dan lihat hasilnya.

*Note: apabila setelah di publikasi belum muncul Daftar isi, tunggu 1x 24jam.


Baca juga : Script anti bom klik 2018 ampuh.
Demikian tutorial cara memasang peta situs atau Sitemap di blog dan website. Dengan memasang sitemap semoga membuat pengunjung blog semakin meningkat drastis.
Sekian. Apabila ada pertanyaan bisa komentar di bawah. Terima kasih.

TRIK JITU AGAR BLOG RAMAI PENGUNJUNG

Trik Jitu Agar Blog Ramai Pengunjung

Blog ramai pengunjung tentunya adalah hal yang paling di idam idamkan oleh para blogger. Tapi untuk mendapatkan banyak pengunjung di blog kita tentunya bukanlah hal yang mudah. Setelah saya mencari berbagai dari sumber, saya akan berbagi dari sumber sumber yang pernah saya baca. Meskipun untuk masalah blog saya masih termasuk pemula tapi semoga tulisan yang saya bagikan ini dapat bermanfaat untuk saya dan sobat semua.

Berikut adalah Trik Jitu supaya Blog Ramai Pengunjung.

1. Buatlah judul blog yang unik dan menarik Dari judul yang unik dan menarik tentunya akan menarik pembaca untuk mengunjungi blog kita. Oleh karena itu buatlah judul sekreatif, seunik dan semenarik mungkin. Contohnya seperti judul pada artikel ini "Trik Jitu Agar Blog Ramai Pengunjung" Menarik bukan? buktinya sobat tertarik untuk membaca artikel ini. hehehe

 2. Tulislah isi artikel blog sendiri. Copaser memang sangat marak dan sudah tidak asing lagi dalam dunia blogger. Tapi tentunya menulis artikel sendiri akan lebih baik dibandingkan dengan hasil copas. Selain itu copas akan membahayakan untuk blog itu sendiri. Oleh karena itu para sobat sekalian mari usahakan membuat artikel sendiri.

 3. Buatlah link artikel yang terkait dengan postingan. Ketika kita sobat memposting sebuah artikel buatlah link yang terkait dengan isi artikel yang kita tuliskan. Karena ketika pengunjung membaca isi postingan pada blog kita, dan terdapat artikel yang terkait dan dengan judul yang menarik, tentunya akan menarik minat pengunjung untuk membaca pula artikel itu. Coba saja dehh...  Seperti ini contohnya.. Baca juga artikel ini ya Cara Daftar dan Verifikasi Blog di Alexa Terbaru 2014

 4. Rajin-rajin mengupdate blog sobat. Ketika blog sobat sudah mulai ramai dengan pengunjung, dan setiap artikel yang dibagikan disukai pembaca pasti pembaca akan menunggu nunggu postingan kita selanjutnya. Inilah gunanya update blog setiap hari, sehingga akan membuat pembaca takut ketinggalan update postingan di blog kita.

 5. Pilih Template yang sesuai. Dengan template yang unik, keren dan enak dipandang mata akan membuat pembaca merasa nyaman berkunjung di blog kita. Selain itu pilihlah template yang ringan agar tidak membuat loading lama sehingga akan membuat pembaca cepat cepat angkat kaki dari blog yang sedang dikunjunginya. Masih seputar template, desain template agar template menjadi seo friendly. Coba cek skor SEO blog sobat di CHKME.COM.

 6. Berikan gambar pada setiap artikel. Gambar yang menarik dan tentunya sesuai dengan isi postingan akan menarik pembaca berkunjung ke blog kita. Karena dengan adanya gambar juga akan membuat isi artikel semakin menarik pula.

 7. Daftarkan blog sobat di Google webmaster. Cara ini akan membuat blog sobat muncul/terindeks di pencarian google. berikut cara daftarnya Cara daftar dan submit google webmaster. Cara ini akan membuat blog kita mendapatkan sitelink dari google. Apa sih sitelink google? Baca juga : Cara mendapat sitelink google

Baca Juga

 8. Pasanglah kotak komentar di blog dengan adanya kotak komentar akan membuat pembaca lebih mudah berinteraksi dengan admin blog dan dengan blogger lainnya. Oleh karena itu pasanglah komentar di blog sobat, tentunya komentar yang sobat pasang harus teroptimasi SEO.

 9. Penulis harus memngetahui yang sedang banyak di cari pembaca, pokoknya harus selalu update. Oleh karena itu sebagai penulis blog harus senang membaca karena kata pepatah membaca dapat membuka jendela dunia. Dengan membaca penulis akan mengetahui informasi terbaru, informasi yang sedang hangat dan informasi yang banyak di cari oleh pembaca.

 10. Blogwalking Berkomentarlah di blog blog lain. hal ini akan membuat blog sobat ramai pengunjung atau sobat bisa tukar link dengan blog blog yang lain. Cara ini akan menaikan peringkat blog di alexa rank juga.

 11. Manfaatkan Media Sosial Zaman sekarang banyak sekali media sosial seperti facebook, twitter dll. Kalian bisa membagikan postingan melalui media sosial tersebut.

12. Untuk pemilihan judul menarik, gunakan google trends, untuk mengetahui mana headline yg menarik. Biasa saya bikin 2-3 judu headline, lalu dicompare dengan Google trends utk ketahuan mana yg paling menarik.

CARA MEMBUAT TEKS BERJALAN DI BLOG ANDA

Mungkin kalian pernah melihat tulisan keren berjalan di blog. Namanya marquee! fungsi sebenarnya hanya sebagai hiasan di blog, hampir sama dengan news. cuma yang ini lebih mudah dalam mengaturnya, terutama dalam mengatur gerakan teks yang kalian inginkan. Kalian yang tertarik membuat tulisan yang mondar - mandir ini, silahkan ikuti tutorialnya.

Cara Membuat Tulisan Berjalan di Blog

1. Tulisan bergerak dari kanan ke kiri
 <marquee direction="left" scrollamount="2" align="center">Contoh Tulisan Berjalan</marquee>
 hasilnya
Contoh Tulisan Berjalan

2. Tulisan bergerak dari kiri ke kanan
 <marquee direction="right" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>
 hasilnya
Contoh Tulisan Berjalan

3. Teks bergerak bolak balik ( mondar - mandir ) dari kiri ke kanan
<marquee direction="left" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>
hasilnya
Contoh Tulisan Berjalan


4. Teks bergerak bolak balik ( mondar - mandir ) dari kanan ke kiri
<marquee direction="right" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>
hasilnya
Contoh Tulisan Berjalan

5. Teks bergerak dari atas ke bawah
 <marquee direction="down" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>
 hasilnya
Contoh Tulisan Berjalan

6. Teks bergerak dari bawah ke atas
 <marquee direction="up" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>
hasilnya
Contoh Tulisan Berjalan

7. Teks bergerak mondar- mandir dari atas ke bawah
 <marquee direction="up" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>
hasilnya
Contoh Tulisan Berjalan

8. Teks bergerak zig - zag ( diagonal ) memantul
 <center><marquee direction="up" scrollamount="2" align="center" behavior="alternate" width="90%"><marquee direction="right" behavior="alternate"> Contoh Tulisan Berjalan </marquee></marquee></center>
 hasilnya
Contoh Tulisan Berjalan

Contoh Tulisan Berjalan

9. Teks bergerak zig - zag ( diagonal ) tembus
 <center><marquee direction="up" scrollamount="2" align="center" behavior="alternate" width="90%"><marquee direction="right"> Contoh Tulisan Berjalan </marquee></marquee></center>
hasilnya
Contoh Tulisan Berjalan

Baca Juga

Cara memasang :
1. Login ke akun blog sobat
2. Klik rancangan --> Elemen laman --> Tambah gadget --> HTML/Javascript
3. Masukkan kode marquee dari salah satu tulisan berjalan diatas
4. Klik save dan lihat hasilnya.

tambahan :
  • Direction : untuk mengatur gerakan teks (left, right, up dan down)
  • Scrollamount :  mengatur kecepatan gerakan teks. Naikkan angkanya ( dari 2 menjadi 3 ) untuk mempercepat gerakan dan sebaliknya.
  • Behavior ( scroll/slide/alternate ):  mengatur prilaku gerakan.
  • Untuk menambahkan background, padding, border, color, dll pada marquee, silahkan sisipkan  kode marquee antara kode berikut
<div style="background: #000000; border: 2px solid #FF0000; color: white; font-size: 20px; font-weight: bold; letter-spacing: 0.5em; padding: 15px;">
<marquee direction="left" scrollamount="6" align="center">Contoh Tulisan Berjalan</marquee> </div>

hasilnya :

Contoh Tulisan Berjalan

  • Untuk menyisipkan link marquee, gunakan kode berikut :
<div style="background: #FFFFFF; border: 2px solid #FF0000; color: black; font-size: 20px; font-weight: bold; letter-spacing: 0.2em; padding: 15px;">
<marquee direction="left" scrollamount="6" align="center"><a href="http://lanangragiel.blogspot.com/2015/10/cara-membuat-teks-berjalan-di-blog-anda.html"/>Cara Membuat Teks Berjalan di Blog</a></marquee>
</div>
catatan :
ganti tulisan yang berwana biru dengan Url yang di inginkan.
hasilnya :


Sekian posting cara bikin tulisan berjalan nya....

CARA MENDAPATKAN IKLAN MATCHED CONTENT ADSENSE

Jika Anda memiliki persyaratan khusus untuk unit Konten yang sesuai dan responsif, tampilan unit ini dapat disesuaikan dengan menambahkan parameter pada kode iklan Anda. Parameter ini memungkinkan Anda mengubah tata letak unit Konten yang sesuai dan menentukan cara pengaturan baris dan kolom rekomendasi di dalamnya.
Anda juga dapat menggunakan parameter untuk menetapkan setelan yang berbeda untuk seluler vs. desktop. Misalnya, jika Anda memberikan nilai tunggal pada parameter tata letak, unit Konten yang sesuai akan memiliki tata letak yang sama di seluler dan desktop. Sementara jika Anda memberikan 2 nilai pada parameter tata letak, berarti unit Konten yang sesuai akan memiliki 1 tata letak pada seluler (nilai pertama) dan tata letak yang berbeda pada desktop (nilai kedua).
Perhatikan bahwa opsi ini hanya tersedia untuk unit Konten yang sesuai dan responsif, serta semua parameter diperlukan agar penyesuaian berfungsi. Setelah memodifikasi kode iklan, pastikan Anda menguji unit Konten yang sesuai pada beragam perangkat dan layar untuk memastikannya berfungsi dengan baik.
Yakinlah bahwa contoh yang dijelaskan di artikel ini adalah perubahan yang dapat di terima pada kode iklan AdSense. Anda tidak akan melanggar kebijakan program AdSense dengan mengubah kode Konten yang sesuai menggunakan cara yang telah disetujui ini.
Persyaratan blog untuk mendapatkan Hadiah dari Google Adsense yaitu berupa Iklan Matched tersebut minimal pengunjung blog adalah 500 viewer / page view per harinya.
Berikut Cara memasang Iklan matched.
1). Masuk Dasboard Adsense - Iklan Saya - Unit Iklan.

2). Pilih Iklan Matched seperti nampak pada Gambar.

Dengan iklan matched memberikan sisi positif yang cukup bagus untuk blog kalian. selain mempermudah pengunjung untuk menjelajahi isi blog dengan mudah,iklan ini juga mampu memperbanyak visitor dan memperlama visitor di dalam blog kalian. Dengan begitu mampu meningkatkan pendapatan adsense kalian.
3). Atur iklan sesuai keinginan sobat.
Untuk gaya iklan  kalian bisa baca di Bantuan Google.

Baca Juga



Seperti pada Gambar berikut ini:


Jika sudah selesai Simpan dan dapatkan kode. Lalu,
- Masuk ke Akun blog kalian
- Tata Letak - Tambahkan Gadget - HTML/ JavaScript
- Pastekan di situ. Selesai..

Selamat Iklan matched kalian sudah siap tampil di blog. Tunggu 20-30mnit. Semoga berhasil.

CARA MEMBUAT IKLAN PARALLAX DIAM KETIKA POSTINGAN DI SCROLL

Memasang iklan efek diam walaupun postingan di scroll ke Atas. Iklan ini biasanya di sebut iklan parallax. Untuk penempatan iklan parallax biasanya di bagian atas samping postingan blog. Nah kali ini blog ini akan memberikan informasi pembelajaran tentang Coding yaitu pemasangan iklan parallax di blogspot atau blogger.

Untuk ukuran iklan yang biasanya di pakai yaitu ukuran 300×600. Bagi kalian yang ingin memasang nya simak di bawah ini mengenai tutorial memasang script iklan parallax di postingan blog.

Langkah langkah:
1). Masuk ke akun blogger
2). Masuk Tema/ Template- Edit HTML
3). Ketikan CTRL+F dan cari kode <head>.
Copy dan pastekan kode di bawah ini tepat di bawah Kode <head>.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
/*<![CDATA[*/
  overflow: visible;
.paralax_div {
  position: relative;
  width: 300px;
  display: inline-block;
  height: 250px;
  margin-right: 20px;
.paralax_div > div {
  float: left;
  z-index: 9999;
}
  overflow: hidden;
  position: absolute;
  width: 100%;
  height: 100%;
  margin: 0;
.paralax_div > div > div {
  top: 0;
  left: 0;
  clip: rect(auto auto auto auto);
}
  top: 0;
  width: 100%;
  height: 100%;
  position: fixed;
  -webkit-transform: translateZ(0);
  margin: 0 auto;
  -moz-transform: translateZ(0);
  transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  position: absolute;
}
.paralax_div > div > div > div {
  width: 100%;
  top: 0;
  height: 100vh;   left: 50%;
  -ms-transform: translateX(-50%);
  border: none;
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  display: -ms-flexbox;
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  display: flex;
  display: -webkit-flex;
  align-items: center;
  -webkit-align-content: center;
  align-content: center;
  -ms-flex-align: center;
  -webkit-align-items: center;   background: #ddd; }
}
.paralax_div > div > div > div > * {
  margin: 0;   margin-top: 0; }
.paralax_div > div > div > div > a {   width: 100%;   height: 100vh;
  .paralax_div {
.paralax_div img,.paralax_div iframe,.paralax_div ins {
  height: 600px;   width: 300px; } .clear {
@media screen and (max-width:640px) {
  clear: both;   display: block }     width: 100%;
    -ms-transform: translateX(-50%);
    height: 250px;
    margin: 0 auto;
    float: none;
  .paralax_div > div > div > div {
  }     left: 50%;
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    width:auto;
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 100%;
  }   .paralax_div > div > div {
  }
    left:0;     text-align: center;
    max-width:100%;
  .paralax_div img {     margin: 0 auto;
</b:if>
    height:auto;
  } }
@media screen and (max-width:320px) {
  .paralax_div iframe,.parallax_banner ins {
    height:600px;
    margin: 0 auto;     width:100%;   } } /*]]>*/ </style>


4). Selanjutnya tekan CTRL+F Cari kode <div class='post-body entry-content'.
Copy kode di bawah dan pastekan tepat di atas kode tersebut.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class="paralax_div">
  <div>
    <div>
      <div>
        <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_f8VXbTJqyRpYiMbOFvtXtVKzY61Fwb4fEWeKBYcEzdSx4MJbB9v3Ru6trHZNZFTnnoGvST4ynMcEpE4nksgFoNgpp0TVEK4c5ecS6iB2Z5Rbug0CYPYJIpj6N3r5xmSf_ig8WRLLHXb-/s300/18835763_10208567628658748_4561466345738187918_n.jpg" alt="banner" width="300" height="600" />
      </div>
    </div>
  </div>
<span class="clear"/>
</div>
</b:if>

5). Ganti kode

Baca Juga


 <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_f8VXbTJqyRpYiMbOFvtXtVKzY61Fwb4fEWeKBYcEzdSx4MJbB9v3Ru6trHZNZFTnnoGvST4ynMcEpE4nksgFoNgpp0TVEK4c5ecS6iB2Z5Rbug0CYPYJIpj6N3r5xmSf_ig8WRLLHXb-/s300/18835763_10208567628658748_4561466345738187918_n.jpg" alt="banner" width="300" height="600" / 

Dengan script iklan milik kalian
Save dan lihat hasilnya.

Demikian tutorial mengenai cara pemasangan iklan parallax di postingan. Baca juga artikel Cara memasang iklan melayang di bagian bawah blog.

Artikel Terkait:

iklan parallax background cara buat iklan parallax cara membuat iklan adsense parallax   membuat iklan parallax di wordpress cara buat iklan parallax cara membuat iklan adsense parallax parallax adsense membuat iklan parallax di wordpress iklan parallax background

CARA MEMBUAT RECENT POST MELAYANG DENGAN TOMBOL CLOSE

Jika kemarin telah di bahas cara membuat iklan melayang di sertai tombol Close. Nah untuk saat ini yang akan di bahas yaitu Cara membuat artikel terbaru atau Recent post melayang dengan tombol Close. Yak... Kalau biasanya Artikel terbaru atau recent post terletak di bilah samping kanan maupun kiri atau di bawah postingan dan tepatnya berada di Sidebar. Tapi untuk yang kali ini yaitu Recent post melayang yang di sertai Tombol Close dan iklan banner.

Seperti nampak di gambar bawah ini.

Selain Recent post yang melayang, juga bisa di sisipkan iklan banner loh tepat di bawah recent post tersebut. Lebih unik lagi recent post yang kali ini adalah recent post yang bisa di scroll ke atas jadi tidak akan memenuhi halaman blog sobat.

Fitur:
- Recent post Melayang
- Recent post Scroll ke atas
- Recent post disertai tombol Close dan di sertai iklan banner di bawahnya.

Artikel terbarunya juga di lengkapi thumbnail gambar jadi nampak keren di blog sobat. Blog adpati akan memberikan sedikit script widget di atas. Cara pemasangannya pun cukup mudah. Simak langsung langkah-langkahnya.
1). Masuk akun Blogger
2). Masuk bagian Tata Letak - Tambahkan gadget - dan Copy Kode di bawah ini dan pastekan di situ.


<script type='text/javascript'>
$(document).ready(function() {$(&#39;img#closed&#39;).click(function(){$(&#39;#bl_banner&#39;).hide(90);});});
</script>
<div id='fixedban' style='width:100%;margin:auto;text-align:center;float:none;overflow:hidden;display:scroll;position:fixed;bottom:0;z-index:999;-webkit-transform:translateZ(0);'>
<div><a id='close-fixedban' onclick='document.getElementById(&apos;fixedban&apos;).style.display = &apos;none&apos;;' style='cursor:pointer;'><img alt='close' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9X7L2vk4rhiSXFRoYlMzwIHU32I1lbPOuREWUN7J9yv7_AS-L203l8Jio_0ixpJ-yYRvGelVqt20QnAtfScdb4dl8o9rXKdPtqDiBgI6QuoZVQkkzUY-F5Pv_0WkveNvdoM39MhGrn-DE/s1600/btn_close.gif' title='close button' style='vertical-align:middle;'/></a></div>
<div style='text-align:center;display:block;max-width:728px;height:auto;overflow:hidden;margin:auto'> <center> <div style="border: 0px solid #00FF00; height: 300px; overflow: auto; padding: 3px; width: auto;"> <style scoped='' type='text/css'> #recent-posts{color:#999;font-size:12px}
#recent-posts ul li a{display:block;color:#ff0000;font-weight:700;text-decoration:none;font-size:14px;margin:0 0 10px 0;line-height:normal}
#recent-posts img{background:#fafafa;float:left;height:60px;margin-right:8px;width:60px;border-radius:4px} #recent-posts ul{margin:0;padding:0} #recent-posts ul li{margin:0 0 10px 0;padding:0 0 10px 0;border-bottom:1px solid rgba(0,0,0,0.1)} #recent-posts ul li:last-child{border-bottom:0} </style> <div id='recent-posts'> <script type='text/javaScript'> var rcp_numposts=10;
function recent_posts(json){var dw='';a=location.href;y=a.indexOf('?m=0');dw+='<ul>';for(var i=0;i<rcp_numposts;i++){var entry=json.feed.entry[i];var rcp_posttitle=entry.title.$t;if('content'in entry){var rcp_get_snippet=entry.content.$t}else{if('summary'in entry){var rcp_get_snippet=entry.summary.$t}else{var rcp_get_snippet="";}};rcp_get_snippet=rcp_get_snippet.replace(/<[^>]*>/g,"");if(rcp_get_snippet.length<rcp_snippet_length){var rcp_snippet=rcp_get_snippet}else{rcp_get_snippet=rcp_get_snippet.substring(0,rcp_snippet_length);var space=rcp_get_snippet.lastIndexOf(" ");rcp_snippet=rcp_get_snippet.substring(0,space)+"&#133;";};for(var j=0;j<entry.link.length;j++){if('thr$total'in entry){var rcp_commentsNum=entry.thr$total.$t+' '+rcp_comment}else{rcp_commentsNum=rcp_disable};if(entry.link[j].rel=='alternate'){var rcp_posturl=entry.link[j].href;if(y!=-1){rcp_posturl=rcp_posturl+'?m=0'}var rcp_postdate=entry.published.$t;if('media$thumbnail'in entry){var rcp_thumb=entry.media$thumbnail.url}else{rcp_thumb="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbqfqHNKtBNiUAtEX3cV1d0r_3vovTQ3Cqoj4HUTSnCuD8iP8Evzvp_SafHSl1zvG4iyZO4z2mhZAe5XjOrhJZR53HDBpgNRcOwPbqIVJxctAaQQ8EF6vxk2BD3XB1NV8MrJbEflIGfBqO/"};}};dw+='<li>';dw+='<img alt="'+rcp_posttitle+'" src="'+rcp_thumb+'"/>';dw+='<div><a href="'+rcp_posturl+'" rel="nofollow" title="'+rcp_snippet+'">'+rcp_posttitle+'</a></div>';if(rcp_info=='yes'){dw+='<span>'+rcp_postdate.substring(8,10)+'/'+rcp_postdate.substring(5,7)+'/'+rcp_postdate.substring(0,4)+' - '+rcp_commentsNum+'</span>';};dw+='<div style="clear:both"></div></li>';};dw+='</ul>';document.getElementById('recent-posts').innerHTML=dw;};document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results='+rcp_numposts+'&callback=recent_posts\"><\/script>');
var rcp_snippet_length=75; var rcp_info='yes'; var rcp_comment='Comments'; var rcp_disable='T?t Nh?n xét'; </script> TARUH KODE IKLAN BANNER DI SINI
</div></center></div>

3). Save dan lihat hasilnya.

Baca Juga

Apabila script tidak bekerja dengan benar mungkin ada beberapa Element yang perlu di tambahkan ke Template sobat. Untuk Kode iklan banner bisa kalian pasang di bagian bawah. Bisa di cermati bagian script.

Var rcp_numpost = 10 ( bisa di ganti sesuai yang kalian inginkan. Ini adalah jumlah postingan terbaru yang akan di tampilkan.


Demikian mengenai Script Recent post melayang dengan iklan dan tombol Close. Apabila ada pertanyaan bisa tinggalkan komentar di bawah ya.
Semoga membantu..
Back To Top