Cara Membuat Iklan Seperti AdSense Di Blog

Membuat iklan seperti AdSense -  Membuat gambar atau tampilan iklan menyerupai iklan oleh google AdSense tampil di blog kalian.

Buat kamu yang ingin menampilkan iklan pribadi namun terlihat seperti iklan Googgle AdSense, kamu bisa mencoba cara dibawah ini.

Berikut contoh tampilan Iklan Seperti Google AdSense

tampilan Iklan Seperti Google AdSense


Cara Membuat Iklan Teks Seperti AdSense


Langkah 1 : Simpan kode ini di atas </head>


<script src='https://googledrive.com/host/0B3pi8P5BWqm1OHB4Zks1aWR0Nnc/iklan-teks-ga.js' type='text/javascript'/>

Langkah 2 : Simpan kode CSS ini di atas ]]></b:skin> atau </style>

/* Iklan Teks
----------------------------------------------- */
#iklan-teks {
  width:304px;
  height:259px;
  background-color:white;
  position:relative;
  overflow:hidden;
  margin:0 auto;
}
#iklan-teks h2.iklan-header {
  cursor:pointer;
  background-color:white;
  background-image:none;
  font:normal 20px Verdana, Tahoma,Serif;
  color:blue;
  border-top:1px solid #d8d8d8;
  padding:10px;
  margin:0 0;
  position:relative;
  text-transform:none;
  letter-spacing:0;
}
#iklan-teks h2.iklan-header:first-child {
  border-top:none;
}
#iklan-teks h2.active {
  display: none;
}
#iklan-teks h2.iklan-header:before{
  content:"";
  width:0;
  height:0;
  position:absolute;
  top:20px;
  right:15px;
  border:5px solid transparent;
  border-color:#b2b2b2 transparent transparent;
}
#iklan-teks div {
  height:100px;
  padding:10px 70px 10px 10px;
  font:normal 13px Verdana, Tahoma,Serif;
  color:white;
  border-top:1px solid #d8d8d8;
}
.judul {
  font:normal 20px Verdana, Tahoma,Serif;
  color:blue;
  margin:0 0 5px 0;
}
a.judul{
  font:normal 20px Verdana, Tahoma,Serif !important;
  color:blue !important;
  text-decoration:none;
  display:inline-block;
}
a:hover.judul {
  font:normal 20px Verdana, Tahoma,Serif !important;
  color:blue;
  text-decoration:underline;
}
.isi-iklan a{
  font:normal 13px Verdana, Tahoma,Serif;
  color:green;
  text-decoration:none;
  display:block;
  margin-bottom:10px;
}
.isi-iklan a:hover{
  color:green;
  text-decoration:none;
}
.isi {
  padding-top:15px;
  color:#222;
  text-align:left !important;
}
.panah-besar {
  background: #4d90fe;
  border-radius: 50%;
  cursor: pointer;
  height: 34px;
  float: right;
  margin-right: -60px;
  margin-top: -40px;
  width: 34px;
  text-align: center;
  line-height: 34px;
}
.panah-besar:hover {
  background: #4472bd;
}
.info-icon {
  width:15px;
  height:15px;
  position:absolute;
  top:0;
  right:0;
  cursor:pointer;
}
.info-iklan {
  background:#d3d3d3;
  width:100px;
  height:15px;
  border-bottom-left-radius:4px;
  position:absolute;
  top:0;
  right:0;
  color:#000;
  font:normal 11px Arial,Sans-Serif;
  text-align:left;
  overflow:hidden;
  padding-right:19px;
  padding-left:5px;
  display:none;
}


Langkah 3 : Simpan kode ini pada Widget HTML / JavaScript

<div id="iklan-teks">
    <!-- iklan ke 1 -->
    <div data-header="Blogger Tutorial" style="border-top:none">
        <span class='isi-iklan'><a class='judul' href='http://beginikey.blogspot.com' target='_blank'>Blogger Tutorial</a>
            <a href='http://beginikey.blogspot.com' target='_blank'>beginikey.blogspot.com</a>
        <span class='isi'>Bukan Sekedar Cara Menjadi Publhiser Dengan Blogger.</span>
            <a class='panah-besar' href='http://beginikey.blogspot.com' target='_blank'><img style='margin-top:7px;margin-left:2px;width:12px;height:19px' alt='arrow' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMUhI2RrAW8JXZmMibFh1eCxdW4faQCgI3nqbFmIxE6qL7T5sMI_3HzUcdW5T6CZtHKTNljRWxMegtc_jQAOFxzio1I5p8yjR62U1iUcKkkd6afkqNsRNuLp5c2RqLF4akZPzMvVMKkCQ/s1600/icon_chevron_white.png'/></a>
        </span>
    </div>
    <!-- iklan ke 2 -->
    <div data-header="Pasang Iklan di Sini">
        <span class='isi-iklan'><a class='judul' href='http://beginikey.blogspot.com/p/pasang-iklan-di-beginikey.html' target='_blank'>Pasang Iklan di Sini</a>
            <a href='http://beginikey.blogspot.com/p/pasang-iklan-di-beginikey.html' target='_blank'>beginikey.blogspot.com</a>
            <span class='isi'>Pasang iklan Anda di sini, hanya 25 ribu / bulan.
            <a class='panah-besar' href='http://beginikey.blogspot.com/p/pasang-iklan-di-beginikey.html' target='_blank'><img style='margin-top:7px;margin-left:2px;width:12px;height:19px' alt='arrow' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMUhI2RrAW8JXZmMibFh1eCxdW4faQCgI3nqbFmIxE6qL7T5sMI_3HzUcdW5T6CZtHKTNljRWxMegtc_jQAOFxzio1I5p8yjR62U1iUcKkkd6afkqNsRNuLp5c2RqLF4akZPzMvVMKkCQ/s1600/icon_chevron_white.png'/></a></span>
        </span>
    </div>
    <!-- iklan ke 3 -->
    <div data-header="Pasang Iklan di Sini">
        <span class='isi-iklan'><a class='judul' href='http://beginikey.blogspot.com/p/pasang-iklan-di-beginikey.html' target='_blank'>Pasang Iklan di Sini</a>
            <a href='http://beginikey.blogspot.com/p/pasang-iklan-di-beginikey.html' target='_blank'>beginikey.blogspot.com</a>
            <span class='isi'>Pasang iklan Anda di sini, hanya 25 ribu / bulan.
            <a class='panah-besar' href='http://beginikey.blogspot.com/p/pasang-iklan-di-beginikey.html' target='_blank'><img style='margin-top:7px;margin-left:2px;width:12px;height:19px' alt='arrow' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMUhI2RrAW8JXZmMibFh1eCxdW4faQCgI3nqbFmIxE6qL7T5sMI_3HzUcdW5T6CZtHKTNljRWxMegtc_jQAOFxzio1I5p8yjR62U1iUcKkkd6afkqNsRNuLp5c2RqLF4akZPzMvVMKkCQ/s1600/icon_chevron_white.png'/></a></span>
        </span>
    </div>
    <!-- iklan ke 4 -->
    <div data-header="Pasang Iklan di Sini">
        <span class='isi-iklan'><a class='judul' href='http://beginikey.blogspot.com/p/pasang-iklan-di-beginikey.html' target='_blank'>Pasang Iklan di Sini</a>
            <a href='http://beginikey.blogspot.com/p/pasang-iklan-di-beginikey.html' target='_blank'>beginikey.blogspot.com</a>
        <span class='isi'>Pasang iklan Anda di sini, hanya 25 ribu / bulan.
            <a class='panah-besar' href='http://beginikey.blogspot.com/p/pasang-iklan-di-beginikey.html' target='_blank'><img style='margin-top:7px;margin-left:2px;width:12px;height:19px' alt='arrow' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMUhI2RrAW8JXZmMibFh1eCxdW4faQCgI3nqbFmIxE6qL7T5sMI_3HzUcdW5T6CZtHKTNljRWxMegtc_jQAOFxzio1I5p8yjR62U1iUcKkkd6afkqNsRNuLp5c2RqLF4akZPzMvVMKkCQ/s1600/icon_chevron_white.png'/></a></span>
        </span>
    </div>
    <!-- info -->
    <span class='info-iklan'>Iklan oleh beginikey</span>
    <span class='info-icon'><a href='http://beginikey.blogspot.com/p/pasang-iklan-di-beginikey.html' target='_blank'><img alt='info' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMezAvMdeBUidu9xM16m6VMinL-w2AMoyz47M3s45TBjqBnsUyJUeB-DO-C9mDjF013mO0TdD1S5V4m-7knsSqDKEg8JsQICRhq-rVgauZ1Mi59hPrasyBXmQn1K10PJFu1m3TV9tnRbE/s1600/info-iklan.png'/></a></span>  

</div>

Silahkan anda edit judul dan link.

1 Response to "Cara Membuat Iklan Seperti AdSense Di Blog"