Pasang Iklan Parallax ditengah artikel blog

Iklan paralak adalah iklan yang terlihat saat kita melakukan scroling saat membaca artikel di blog , namun dari sekian tutorial hanya memberikan cara memasang iklan paralak dibawah judul di pojok kiri atas postingan , jika anda ingin memasang iklan paralak ditengah postingan seperti diblog saya yang sederhana ini ,saya akan membagikan caranya,

MOHON BACA DENGAN SEKSAMA
sebelum anda ingin memasang iklan paralak ditengah postingan anda harus sudah bisa memasang unit iklan biasa di tengah postingan ( wajib) karena sudah terlalu banyak tutorial pasang iklan ditengah postingan jadi saya tidak ikut ikutan membuatnya ,

OKE lanjuttt .........cara pasang iklan paralak ditengah postingan 
1. silahkan anda kopas kode css berikut di atas kode </head>

<style type='text/css'>
/*<![CDATA[*/
.paralax_div {
  position: relative;
  overflow: visible;
  width: 300px;
  height: 250px;
  margin-right: 250px;
  display: inline-block;
  float: right;
  z-index: 9999;
}
.paralax_div > div {
  overflow: hidden;
  width: 100%;
  height: 100%;
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
  clip: rect(auto auto auto auto);
}
.paralax_div > div > div {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  margin: 0 auto;
  -moz-transform: translateZ(0);
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
}
.paralax_div > div > div > div {
  width: 100%;
  height: 100vh;
  position: absolute;
  left: 50%;
  top: 0;
  border: none;
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  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 img,.paralax_div iframe,.paralax_div ins {
  height: 600px;
  width: 300px;
}
.clear {
  clear: both;
  display: block
}

@media screen and (max-width:640px) {
  .paralax_div {
    width: 100%;
    height: 250px;
    margin: 0 auto;
    float: none;
  }
}
/*]]>*/
</style>
</b:if>

kode ini saya ambil dari kompiajaib yang sudah saya edit sedikit agar posisi iklan paralak bisa ditengah 

2. kemudin ini yang terpenting kopas kode dibawah ini dan taruh lah pada lokasi iklan tengah artikel maka dari itu anda harus bisa pasang iklan di tengah postingan terlebih dahulu silahkan cari di google banyak yang mengulas

ini kode yang harus di pasang di tengah artikel

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='paralax_div'>
  <div>
    <div>
      <div>
        <script async='async' src='//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'/>
<ins class='adsbygoogle' data-ad-client='ca-pub-12345678999999' data-ad-slot='000000000' style='display:inline-block;width:300px;height:600px'/>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
   
      </div>
    </div>
  </div>
<span class='clear'/>
</div>
</b:if>

buat unit iklan baru ukuran 600 x300 pikels
teks yang saya tandai silahkan edit sesuai milik anda , dan simpan templat anda selesai ,semoga bermanfaat

Artikel Terkait tipsblog ,

Comments

  1. Apa ini bisa di pasang di blogspot.?
    Trus performa iklannya gimana?

    ReplyDelete
    Replies
    1. Ini memang untuk blogger boss maaf saya admin tapi pinjem hp lain buat balas. Iklan ini masih coba coba belum tau performanya boss

      Delete

Post a Comment

Trimakasih , mohon kritik dan saran untuk kemajuan blog kami

Paling sering dibaca

Pasang holder kiri old vixion pada satria f

Membuat Lem Bata Hebel

Recovery mode Mito a82