Cara Membuat Widget Iklan Menarik Seperti Google Adsense - Selamat datang di situs media global terbaru Xivanki, Pada halaman ini kami menyajikan informasi tentang Cara Membuat Widget Iklan Menarik Seperti Google Adsense !! Semoga tulisan dengan kategori
Tips Blogging dan internet !! ini bermanfaat bagi anda. Silahkan sebarluaskan postingan Cara Membuat Widget Iklan Menarik Seperti Google Adsense ini ke social media anda, Semoga rezeki berlimpah ikut dimudahkan Allah bagi anda, Lebih jelas infonya lansung dibawah -->
Iklan - iklan yang ada biasanya berbentuk banner dan juga iklan berbentuk text. Untuk iklan berbentuk banner, untuk membuat nya agar terlihat menarik sepertinya lebih mudah, kita tinggal membuat banner semenarik mungkin maka selesai deh iklan banner kita. Lalu bagaimana kalau kita mau menampilkan jenis iklan berbentuk text tapi bisa terlihat menarik, mungkin kita bisa mencontoh nih, iklan text milik nya Google Adsense, penampilanya terlihat menarik walaupun hanya berbentuk text. Lihat penampakanya dibawah ini :
Okey,,menarik kan ?? Lalu bagaimana cara membuatnya ?? Yuk kita bahas dibawah ini :
1. Login ke Akun Blogger Anda. Lalu Masuk ke Dashboard >> Template >> Edit HTML
2. Masukan Script Berikut diatas Code </head>
<script src='https://googledrive.com/host/0B3pi8P5BWqm1OHB4Zks1aWR0Nnc/iklan-teks-ga.js' type='text/javascript'/>
3. Lalu Masukan Code CSS Berikut Tepat diatas Code ]]></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;
}
3. Lalu Buatlah Sebuah Widget HTML/Javascript lalu isi dengan Code Berikut :
<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://blog.kangismet.net' target='_blank'>Blogger Tutorial</a>
<a href='http://blog.kangismet.net' target='_blank'>blog.kangismet.net</a>
<span class='isi'>Blogger Tutorials and Free Blogger Templates.</span>
<a class='panah-besar' href='http://blog.kangismet.net' target='_blank'><img style='margin-top:7px;margin-left:2px;width:12px;height:19px' alt='arrow' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirBygoCJkFqmEzlM1fVrRd5WVO3YCAJ1e9mKTzw1M2lJYOwhyT1rPtf3iZqr4jjBJ7ZvcGEd4soL4hXWcSMpzug1ieR-j4ZUz1M9WIYFQv9PvBq5o_96rMEV7Y-tClKASbVarmlcmrSoc/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://blog.kangismet.net/2012/12/pasang-iklan-di-blog-kang-ismet.html' target='_blank'>Pasang Iklan di Sini</a>
<a href='http://blog.kangismet.net/2012/12/pasang-iklan-di-blog-kang-ismet.html' target='_blank'>blog.kangismet.net</a>
<span class='isi'>Pasang iklan Anda di sini, hanya 35 ribu / bulan.
<a class='panah-besar' href='http://blog.kangismet.net/2012/12/pasang-iklan-di-blog-kang-ismet.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/AVvXsEirBygoCJkFqmEzlM1fVrRd5WVO3YCAJ1e9mKTzw1M2lJYOwhyT1rPtf3iZqr4jjBJ7ZvcGEd4soL4hXWcSMpzug1ieR-j4ZUz1M9WIYFQv9PvBq5o_96rMEV7Y-tClKASbVarmlcmrSoc/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://blog.kangismet.net/2012/12/pasang-iklan-di-blog-kang-ismet.html' target='_blank'>Pasang Iklan di Sini</a>
<a href='http://blog.kangismet.net/2012/12/pasang-iklan-di-blog-kang-ismet.html' target='_blank'>blog.kangismet.net</a>
<span class='isi'>Pasang iklan Anda di sini, hanya 35 ribu / bulan.
<a class='panah-besar' href='http://blog.kangismet.net/2012/12/pasang-iklan-di-blog-kang-ismet.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/AVvXsEirBygoCJkFqmEzlM1fVrRd5WVO3YCAJ1e9mKTzw1M2lJYOwhyT1rPtf3iZqr4jjBJ7ZvcGEd4soL4hXWcSMpzug1ieR-j4ZUz1M9WIYFQv9PvBq5o_96rMEV7Y-tClKASbVarmlcmrSoc/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://blog.kangismet.net/2012/12/pasang-iklan-di-blog-kang-ismet.html' target='_blank'>Pasang Iklan di Sini</a>
<a href='http://blog.kangismet.net/2012/12/pasang-iklan-di-blog-kang-ismet.html' target='_blank'>blog.kangismet.net</a>
<span class='isi'>Pasang iklan Anda di sini, hanya 35 ribu / bulan.
<a class='panah-besar' href='http://blog.kangismet.net/2012/12/pasang-iklan-di-blog-kang-ismet.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/AVvXsEirBygoCJkFqmEzlM1fVrRd5WVO3YCAJ1e9mKTzw1M2lJYOwhyT1rPtf3iZqr4jjBJ7ZvcGEd4soL4hXWcSMpzug1ieR-j4ZUz1M9WIYFQv9PvBq5o_96rMEV7Y-tClKASbVarmlcmrSoc/s1600/icon_chevron_white.png'/></a></span>
</span>
</div>
<!-- info -->
<span class='info-iklan'>Iklan oleh Kang Ismet</span>
<span class='info-icon'><a href='http://blog.kangismet.net/2012/12/pasang-iklan-di-blog-kang-ismet.html' target='_blank'><img alt='info' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEillZJXdl50BgdVf9f5jK1TXw4RYbyc4ZZvFNSe4KJ_bmV1FG0_XAbMXcN-hgLK3sGhRuPImMHDmEQwVENsguO1sMSp0jHhr0OM35DxElRjWbGKxiLRHJWw3l1_wDtATkl_H8dUs97OuUI/s1600/info-iklan.png'/></a></span>
</div>
4. Save dan Lihat Hasilnya.
Okey sob,,cukup sekian artikel Cara Membuat Widget Iklan Menarik Seperti Google Adsense. Semoga tips ini bermanfaat.
Demikian info Cara Membuat Widget Iklan Menarik Seperti Google Adsense, Semoga dengan adanya postingan ini, Anda sudah benar benar menemukan informasi yang memang sedang anda butuhkan saat ini. Bagikan informasi Cara Membuat Widget Iklan Menarik Seperti Google Adsense ini untuk orang orang terdekat anda, Bagikan infonya melalui fasilitas layanan Share Facebook maupun Twitter yang tersedia di situs ini.