Blog Tutorial

Tutorial Blog, Cheat Games, Tutorial Ponsel, Tutorial Komputer, Tutorial Browser

Kamis, 01 Juli 2010

Mempercantik Formulir Berlangganan

Kategori :
Mempercantik Formulir Berlangganan. Mungkin judulnya sedikit alay y sobat? tidak apa-apalah yang penting saya bisa berbagi dengan kalian semua. Widget ini menurut saya menarik dan cantik deh pokoke tidak menyesal buat sobat yang suka mempercantik blog. Di dalam widget ini sobat dapat menaruh link berupa gambar dan keterangannya, seperti Facebook, Twitter dan Langganan Artikel via Email. Dari pada penasaran mendingan lihat aja demonya dibawah ini.



  • Full RSS Feed

    Follow Me

    Ikuti jejak oketrik di Twitter.
  • E-Mail Delivery

    Via E-Mail

    Trik yang di oketrik ke email kamu?? buruan langganan...!!!.
  • Facebook Fans

    Fans Facebook

    Buruan gabung oketrik Di facebok.

bagaimana pendapat sobat? bagus bukan? oketrik.blogspot.com kalau sobat ingin memasangnya sobat dapat mengikuti langkah di bawah ini.

  1. Login ke blogger

    Mempercantik Formulir Berlangganan
  2. masuk ke Rancangan (dulunya tata letak)

    Mempercantik Formulir Berlangganan
  3. setelah itu tambahkan sebuah gadget, untuk penempatannya saya sarankan pasang di sidebar

    Mempercantik Formulir Berlangganan
  4. setelah itu pilih yang HTML/Javascript

    Mempercantik Formulir Berlangganan
  5. lalu masukan kode di bawah ini ke dalamnya


    <style type="text/css">#langganan {list-style: none;margin: 0px;}

    #langganan li {list-style: none; padding: 10px; position: relative; margin-top: 0; margin-right: 0; margin-bottom: 5px; margin-left: 0; height: 50px;}

    #langganan li h4 {list-style: none; margin: 0 0 0 45px; font-size: 24px; line-height: 26px; color: #333333; font-family: Helvetica, Arial, sans-serif; font-weight: bold; display: block; clear: none; border: none;}

    #langganan li p {list-style: none; margin: 0 0 0 45px; font-size: 13px; letter-spacing: -0.02em; clear: none;}

    #langganan li img {list-style: none; float: left; position: relative; padding: 0px; margin: 0px 20px 0px 0px;}

    #langganan li a.linkblock {list-style: none; background: none;border: none; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; position: absolute; z-index: 50;}

    #langganan li:hover {list-style: none; background-color: #F5F5F5;}</style>

    <ul id="langganan">

    <li> <a class="linkblock" href="ALAMATTWITTERSOBAT" title="My Twitter"></a><img alt="Twitter" src="ALAMATICONGAMBARTWITTERSOBAT" /> <h4>Follow Me</h4> <p>KETERANGAN UNTUK TWITTER SOBAT.</p> </li>

    <li> <a class="linkblock" href="http://feedburner.google.com/fb/a/mailverify?uri=oketrik" title="Via E-Mail"></a><img alt="E-Mail Delivery" src="ALAMATICONBERLANGGANANSOBAT" /> <h4>Via E-Mail</h4> <p>KETERANGAN UNTUK BERLANGGANAN.</p> </li>

    <li> <a class="linkblock" href="ALAMATFACEBOOKSOBAT" title="Fans Facebook"></a><img alt="Facebook Fans" src="ALAMATICONGAMBARFACEBOOKSOBAT" /> <h4>Fans Facebook</h4> <p>KETERANGANUNTUKFACEBOOK</p> </li> </ul>


    Mempercantik Formulir Berlangganan

    Penjelasan :
    • background-color: #F5F5F5 >> ini menunjukan warna background apabila disentuh, sobat dapat menyesuaikan warna background tersebut dengan warna template sobat.
    • http://feedburner.google.com/fb/a/mailverify?uri=oketrik >> ini menunjukan alamat untuk berlangganan (untuk mengisi email untuk berlangganan), sobat dapat mengganti dengan alamat berlangganan sobat, biasanya terdapat pada tombol berlangganan dari feedburner.
  6. setelah itu sobat dapat menyimpannya

Mungkin Mempercantik Formulir Berlangganan hanya segitu saja cara yang bisa saya sampaikan, oiya maaf kesempatan kali ini saya tidak berbagi tentang css3 karena g ada waktu buat experimen dan mencari triknya. oiya mungkin untuk lamat form berlangganan akan sulit di dapatkan apabila sobat tidak mempunyai akun feedburner, jadi buat dulu y. Sekian dari saya, Terima kasih dan Happy Blogging oketrik.blogspot.com.
Bagikan Artikel : Facebook Twitter Google+ Linkedin Technorati Digg

10 Komentar untuk Mempercantik Formulir Berlangganan

Pertamaaa......

pumpung lagi di waarnet ane klik iklanmu sob ehhehehehe

KEDUAX SOB :) THANKS INPONA

wah.. banyak ilmu disini...tks sob...tar ane cobain praktekin satu-satu di blog ane...

wess...
keren mas...
saya save page dulu ya....
ntar saya olah lagi gambarnya :)

Oh... that's very helpfull info...
I just to find it for the best view in my Form Subscriber....

@Pawewet >> sip kang, di jamin kgk nyesel...

@jaka zulham >> sip kang....

makasih sahabat atas kunjungannya. Salam sukses

Thanks Gan infonya.. :)

Info yg menyenangkan gan...thnks

http://fullydownloadzer.blogspot.com/