Cara Membuat Iklan Google Keren Valid Html5

Cara Membuat Iklan Teks Ala Google Keren Valid HTML5 CSS3 - Kali ini saya akan membagikan tutorial blog untuk membuat Iklan Teks Google Adsense Ala Bloger KangIsmet tutorial ini memang sudah banyak di internet tapi bagi penonton setia blog ini saya akan berbagi tutorial ini jadi mohon simak baik-baik yah.

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 Text */
#iklan-teks {height: 275px;
background-color: #FFF;
position: relative;
overflow: hidden;
width: 100%;
margin-bottom: -6px; }
#iklan-teks h2.iklan-header { cursor: pointer; background-color: white; background-image: none; font: normal normal 20px Verdana, Tahoma, Serif; color: #f0523f; border-top: 1px solid #d8d8d8; padding: 10px; margin: 0; position: relative; text-transform: none; letter-spacing: 0; } 
.iklan-teks-post-footer .iklan-header { border-bottom: 0; }  #iklan-teks h2.iklan-header:first-child { border-top: 0; }  #iklan-teks h2.iklan-header:before { content: ""; width: 0; height: 0; position: absolute; top: 20px; right: 15px; border: transparent solid 5px; border-color: #b2b2b2 transparent transparent; } 
#iklan-teks div { height: 120px; padding: 10px 70px 10px 10px; z-index: 1; background: white; font: normal normal 13px Verdana, Tahoma, Serif; color: white; position: relative; border-top: 1px solid #d8d8d8; }  .judul { font: normal normal 20px Verdana, Tahoma, Serif; color: #f0523f; margin: 0 0 5px 0; } ;
a.judul { font: normal normal 20px Verdana, Tahoma, Serif !important; color: #f0523f !important; text-decoration: none; display: inline-block; }  a:hover.judul { font: normal normal 20px Verdana, Tahoma, Serif !important; color: #2c343e; text-decoration: underline; }  .isi-iklan a { font: normal 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:after { content: "\f124"; font-family: FontAwesome; font-size: 21px; font-style: normal; font-weight: normal; background: #f0523f; color: #fff; border-radius: 50%; height: 34px; float: right; margin-right: -60px; margin-top: -60px; width: 34px; text-align: center; line-height: 34px; }

5. Simpan Kode Ini Diaatas </Body>

  <script type='text/javascript'>$(&#39;.close&#39;).click(function () {
  $(&#39;#dialog-box&#39;).fadeOut();
  $(&#39;#dialog-overlay&#39;).hide();
 })
});
function Popup(url) {
 popupWindow = window.open(url, &#39;popUpWindow&#39;, &#39;height=700,width=800,left=10,top=10,resizable=yes,scrollbars=yes,toolbar=no,menubar=no,location=no,directories=no,status=no&#39;)
};
(function (a) {
 a.fn.hoverTimeout = function (c, e, b, d) {
  return this.each(function () {
   var f = null,
    g = a(this);
   g.hover(function () {
    clearTimeout(f);
    f = setTimeout(function () {
     e.call(g)
    }, c)
   }, function () {
    clearTimeout(f);
    f = setTimeout(function () {
     d.call(g)
    }, b)
   })
  })
 }
})(jQuery);
(function (b) {
 b.fn.iklanaccordion = function (a) {
  a = jQuery.extend({
   active: 1,
   hovertimeout: 300,
   sUpSpeed: 500,
   sDownSpeed: 500,
   sUpEasing: null,
   sDownEasing: null
  }, a);
  return this.each(function () {
   var g = b(this),
    h = g.children(&quot;div[data-header]&quot;),
    f = a.active - 1;
   h.each(function () {
    b(this).hide().before(&#39;<h2 class='iklan-header'>&#39; + b(this).data(&quot;header&quot;) + &quot;</h2>&quot;)
   });
   g.children(&quot;div:eq(&quot; + f + &quot;)&quot;).show().prev().css(&quot;margin-top&quot;, &quot;-47px&quot;).addClass(&quot;active&quot;);
   g.find(&quot;.iklan-header&quot;).hoverTimeout(a.hovertimeout, function () {
    g.children(&quot;h2&quot;).removeClass(&quot;active&quot;).animate({
     marginTop: 0
    });
    h.slideUp(a.sUpSpeed, a.sUpEasing).animate({
     marginTop: -47
    });
    b(this).addClass(&quot;active&quot;).next().slideDown(a.sDownSpeed, a.sDownEasing)
   })
  })
 }
})(jQuery);
$(function () {
 $(&quot;.iklan-teks-sidebar&quot;).iklanaccordion();
 $(&quot;.iklan-teks-post-footer&quot;).iklanaccordion()
});</script>

6. Simpan Kode ini pada Widget HTML / Javascript

<div class='iklan-teks-sidebar' id='iklan-teks'>
<div data-header='Pasang Iklan di Sini'><span class='isi-iklan'><a class='judul' href='/p/contact-us.html' target='_blank'>Pasang Iklan di Sini</a><a href='/' target='_blank'>bsccomunitasll.blogspot.com/</a><span class='isi'>Pasang iklan Anda di sini, gratis untuk 2 bulan.<a class='panah-besar' href='/p/contact-us.html' target='_blank'/></span></span></div>
<div data-header='Pasang Iklan di Sini'><span class='isi-iklan'><a class='judul' href='/p/contact-us.html' target='_blank'>Pasang Iklan di Sini</a><a href='/' target='_blank'>bsccomunitasll.blogspot.com/</a><span class='isi'>Pasang iklan Anda di sini, gratis untuk 2 bulan.<a class='panah-besar' href='/p/contact-us.html' target='_blank'/></span></span></div>
<div data-header='Pasang Iklan di Sini'><span class='isi-iklan'><a class='judul' href='/p/contact-us.html' target='_blank'>Pasang Iklan di Sini</a><a href='/' target='_blank'>bsccomunitasll.blogspot.com/</a><span class='isi'>Pasang iklan Anda di sini, gratis untuk 2 bulan.<a class='panah-besar' href='/p/contact-us.html' target='_blank'/></span></span></div>
<div data-header='Pasang Iklan di Sini'><span class='isi-iklan'><a class='judul' href='/p/contact-us.html' target='_blank'>Pasang Iklan di Sini</a><a href='/' target='_blank'>bsccomunitasll.blogspot.com/</a><span class='isi'>Pasang iklan Anda di sini, gratis untuk 2 bulan.<a class='panah-besar' href='/p/contact-us.html' target='_blank'/></span></span></div>
<div data-header='Pasang Iklan di Sini'><span class='isi-iklan'><a class='judul' href='/p/contact-us.html' target='_blank'>Pasang Iklan di Sini</a><a href='/' target='_blank'>bsccomunitasll.blogspot.com/</a><span class='isi'>Pasang iklan Anda di sini, gratis untuk 2 bulan.<a class='panah-besar' href='/p/contact-us.html' target='_blank'/></span></span></div>
</div>

Sekian jika anda kurang puas mohon edit sendiri :D

Author : Unknown

Share this

Related Posts