Hallo.. apa kabar sobat
AHS??...udah berapa lama nih AHS ngga update lagi xD..
ya maklum aja sobat,habis ganti template sih xD...kali ini saya ingin membagikan tutorial tentang
Cara Membuat Banner Ads 125x125 Ala AHS
ya,, jikalau dulu saya sudah pernah share yang memakai table yang itu >>
Cara Membuat Banner 125x125, sekarang saya mau share yang memakai css..seperti ini contohnya sobat,,..
ya, seperti itulah contohnya, yuk langsung aja sobat,..
Cara membuat banner ads 125x125 seperti AHS
- pertama,jelas masuk blogger lah -_-
- setelah itu menuju ke dashboard > Template > Edit HTML
- setelah masuk ke template,copy kode dibawah ini,pastekan di atas
]]></b:skin>
atau bisa juga diletakkan langsung diwidget*yang ada di tata letak itu*(cari menggunakan Ctrl+F)
#ahsharedads{margin:0px;padding:0px;text-align:center;}
#ahsharedads img {
margin:1px 1px;text-align:center;-webkit-border-radius: 5px;-moz-border-radius: 5px;
border-radius: 5px;-webkit-box-shadow: 1px 2px 1px #c0392b;
-moz-box-shadow: 1px 2px 1px #c0392b;box-shadow: 1px 2px 1px #c0392b;}
#ahsharedads img:hover {-moz-transform: scale(1.0) rotate(370deg);
-webkit-transform: scale(1.0) rotate(370deg);-o-transform: scale(1.0) rotate(370deg);
-ms-transform: scale(1.0) rotate(370deg);-o-transition:all 1.5s ease;-moz-transition:all 1.5s ease;
-webkit-transition:all 1.5s ease;-webkit-box-shadow:0px 0px 30px 0px #c0392b;
-moz-box-shadow:0px 0px 30px 0px #c0392b;box-shadow:0px 0px 30px 0px #c0392b;}
Eh,, belum selesai,..
- lanjut,,copy kode dibawah ini,pastenya di Add Gadget(caranya ya, Layout/Tata letak > Add Widget > Add HTML/Javascript)
<div id="ahsharedads">
<div style="text-align: center;">
<a href="http://akisada-ryo.blogspot.com/" target="_blank"><img alt="A-R" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhha9akhpxFIqfVuESa_N-i9IIv1BSdGXjStpxRkZUyoWBNtPbySMWtu4Lghy9BQgypUFhQUZYAKYEbPGIqgFZonvXmH5tyz1IHpICjvQ1NNqUFdxpJM9KZllEsi2vVJqRPMRL6lT7dga4/s1600/pi.png" title="visit now" /></a>
<a href="http://cie-inc.blogspot.com/2013/05/the-best-information.html" target="_blank" title="Second"><img alt="Second" src="http://i.imgur.com/Xknq2bH.png" /></a>
<a href="http://vhee-zone.blogspot.com/" title="VHEE-ZONE"><img alt="VHEE-ZONE" src="http://i.imgur.com/efuftpo.png" title="VHEE-ZONE" /></a>
<a href="http://best-of-konoha.blogspot.com/" target="_blank" title="Konoha Blogger"><img alt="Foxrider Blogger" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV78kSxTBu2B0XmjHC7SBH3SDCLYGK9k-wGKW0nxUWKlTyveladY9CG428UX9FDTiWPyCU3ZTYjY27g9sEtAqAYxIOg_YRhQRaoUmhrZw4LRH31zVszwIMFztrUgdEK7LKJvp8OlP1NhX5/s1600/.gif" /></a>
</div></div>
Setting
Kode | Penjelasan |
-webkit-border-radius: 5px;-moz-border-radius: 5px; | Nah,kode itu untuk membuat sudut/border,melengkung. |
-o-transform: scale(1.0) rotate(370deg);-ms-transform: scale(1.0) rotate(370deg); | Kode itu jika adsnya di hover/disentuh kan membesar 1.0 dan berputar sebesar 370 derajat |
Cara memasukkan link gambar/banner kedalam widget
- Nah, untuk yang ini,mudah saja,taruh saja link gambar/banner lengkap anda kedalam *sebutannya didalam* kode
<div id='AHSads'>
dan kode </div>
contohnya begini sobat,..
<div id='AHSads'>
..Kode Banner lengkap disini..
</div>
- Untuk bannernya sendiri support berapa?? nah, untuk yang itu, bisa support sampai maksimal(sebanyak-banyaknya)
Nah,,sampai sini dulu ya sobat,, untuk demo bisa dilihat sendiri xD..bye..