Cara Membuat Iklan Teks Ala Google Adsense

Cara Membuat Iklan Teks Ala Google Adsense

Rio Ilham Hadi

25 April 2014

Membuat Iklan Teks Ala Google Adsense - Hai sobat Blanter kali ini saya kan membagikan Tutorial yang sudah lumayan terkenal, yaitu ''Iklan Teks Ala Google Adsense'' walaupun sudah banyak yang membagikan tutorial ini, apa salahnya berbagi dan terus berbagi dan silahkan simak baik2 Tutorial berikut ini...

1. Masuk ke Blogger

2. Pilih Template >> Edit HTML

3. Simpan kode ini di atas </head>

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

4. Simpan 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;
} 

5. 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://blanter-forever.blogspot.com' target='_blank'>Blogger Tutorial</a>
            <a href='http://blanter-forever.blogspot.com' target='_blank'>Dunia Blanter</a>
        <span class='isi'>Blogger Tutorials and Free Blogger Templates.</span>
            <a class='panah-besar' href='http://blanter-forever.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/AVvXsEj98jEKPN4gj4TPZD6rZtmDTFD-PA073qBg8O03lF-wcr0ppykKAq3AQjDbk0lJMYgoWNX9juvM3mkygB6BLvKGDHMpt2f_015GSK-zcylQmnzL250BVxOidMjOsqo6U2ak6ru9sYmrYXE/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://blanter-forever.blogspot.com' target='_blank'>Pasang Iklan di Sini</a>
            <a href='http://blanter-forever.blogspot.com' target='_blank'>Dunia Blanter</a>
            <span class='isi'>Pasang iklan Anda di sini, hanya 35 ribu / bulan.
            <a class='panah-besar' href='http://blanter-forever.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/AVvXsEj98jEKPN4gj4TPZD6rZtmDTFD-PA073qBg8O03lF-wcr0ppykKAq3AQjDbk0lJMYgoWNX9juvM3mkygB6BLvKGDHMpt2f_015GSK-zcylQmnzL250BVxOidMjOsqo6U2ak6ru9sYmrYXE/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://blanter-forever.blogspot.com' target='_blank'>Pasang Iklan di Sini</a>
            <a href='http://blanter-forever.blogspot.com' target='_blank'>Dunia Blanter</a>
            <span class='isi'>Pasang iklan Anda di sini, hanya 35 ribu / bulan.
            <a class='panah-besar' href='http://blanter-forever.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/AVvXsEj98jEKPN4gj4TPZD6rZtmDTFD-PA073qBg8O03lF-wcr0ppykKAq3AQjDbk0lJMYgoWNX9juvM3mkygB6BLvKGDHMpt2f_015GSK-zcylQmnzL250BVxOidMjOsqo6U2ak6ru9sYmrYXE/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://blanter-forever.blogspot.com' target='_blank'>Pasang Iklan di Sini</a>
            <a href='http://blanter-forever.blogspot.com' target='_blank'>Dunia Blanter</a>
            <span class='isi'>Pasang iklan Anda di sini, hanya 35 ribu / bulan.
            <a class='panah-besar' href='http://blanter-forever.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/AVvXsEj98jEKPN4gj4TPZD6rZtmDTFD-PA073qBg8O03lF-wcr0ppykKAq3AQjDbk0lJMYgoWNX9juvM3mkygB6BLvKGDHMpt2f_015GSK-zcylQmnzL250BVxOidMjOsqo6U2ak6ru9sYmrYXE/s1600/icon_chevron_white.png'/></a></span>
        </span>
    </div>
    <!-- info -->
    <span class='info-iklan'>Iklan oleh Google</span>
    <span class='info-icon'><a href='http://www.google.com' target='_blank'><img alt='info' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjsndvtzbgG6nPzbGhU5qTQSulhAKZDyRZm50l_dyIdkiUzaxBSLDrazjJtv879YCj7ZMiMGpfCakLJKWY4QzO9f1VpHdiN9Oge0RC8TCKoWfZECiTnBp0uK_oUjo7XIlrvUYThKcU1sQ/s1600/info-iklan.png'/></a></span>     
</div> 

NOTE : Silahkan Edit Link dan data2 Iklan di atas ini.... :D

Sekian Tutorial kali ini semoga bermanfaat bagi sobat semua...

 http://blog.kangismet.net/2013/11/membuat-iklan-teks-ala-google-adsense.html 

Share This