Loading...

√ Cara Menciptakan Widget Subscribe Di Blog

Kotak Berlangganan Untuk Blogger

Update : Cara Membuat Widget Subscribe di Blog - Bukan hanya youtuber saja yang sanggup mendapatkan subscriber, seorang blogger pun sanggup mempunyai subscriber untuk blog mereka.

Sedikit berbeda dengan subscriber di youtube, bila subscriber youtube mendapat notifikasi berupa video terbaru dari channel yang mereka subscribe. Di blogger orang yang berlangganan blog Anda akan mendapat pemberitahuan berupa postingan gres dari Anda melalui email/gmail mereka.

Setiap kali pengunjung gres di blog Anda dan mereka menambahkan email mereka ke dalam kotak subscribe Anda maka otomatis setiap kali Anda update sesuatu atau memposting sesuatu ke dalam blog Anda maka mereka akan eksklusif mendapat pesan berupa pemberitahuan bahwa ada sesuatu yang gres di alog Anda.

Tentu saja ini merupakan salah satu cara terbaik untuk mendapat visitor dengan cepat dari artikel terbaru Anda, Bagaimana Anda tertarik menambahkannya ke dalam blog Anda?

Sebenarnya di dalam sajian widget blogger sudah terdapat kotak subscribe ini, dan cara membuatnya pun sangat lah gampang kalian hanya perlu masik ke Dashboard => Tata Letak => Tambahkan Widget => Pilih Tautan Berlangganan.  Namun tampilanya masih kurang menarik dan keren berdasarkan saya. Nah untuk membuatnya lebih keren dan menarik silahkan ikuti kangka saya di bawah ini untuk membuatnya :
 seorang blogger pun sanggup mempunyai subscriber untuk blog mereka √ Cara Membuat Widget Subscribe di Blog

Cara Membuat Widget Subscribe Box Menjadi Keren dan Menarik

Untuk sanggup memakai layanan kotak berlangganan blog Anda harus mempunyai ID Feddburner terlebih dahulu, apa itu feedburner dan bagaimana cara mendapat ID nya? silahkan baca juga disini: Cara Daftar dan Menggunakan Layanan Feedburner.

Lanjut langkah langkah menciptakan widget subscriber :

1. Masuk ke akun Blogger Anda, dan di sajian Blogger silahkan pilih layout/tata letak.
2. Klik tambah widget / Add a Gadget.
3. Pilih HTML/JavaScribe.
 seorang blogger pun sanggup mempunyai subscriber untuk blog mereka √ Cara Membuat Widget Subscribe di Blog

4. Copy dan pate isyarat scribe di bawah ini ke dalam widget HTML/JavaScribe.

<div id='subscribe-css'>
<h4><p class='subscribe-note'>
<span>SUBSCRIBE</span> <span class='itatu'>TO</span> OUR NEWSLETTER</p></h4>
<div class='subscribe-wrapper'>
<div class='subscribe-form'>
<form action='http://feedburner.google.com/fb/a/mailverify?uri=http://feeds.feedburner.com/######' class='subscribe-form' method='post' onsubmit='window.open ('http://feedburner.google.com/fb/a/mailverify?uri=http://feeds.feedburner.com/####', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'>
<input name='uri' type='hidden' value='http://feeds.feedburner.com/#####'/><input name='loc' type='hidden' value='en_US'/><input autocomplete='off' class='subscribe-css-email-field' name='email' placeholder='Enter your Email'/><input class='subscribe-css-email-button' title='' type='submit' value='submit'/></form>
</div>
</div>
</div>

5. Klik save dan masuk ke sajian blogger pilih tema => edit HTML.
6. Copy dan paste isyarat CSS ini di atas kode ]]></b:skin> atau </style>.

/* Subscribe Box */
#subscribe-css{position:relative;padding:5px 0;background:#edeff1;overflow:hidden;border-top:2px solid #eee;}
.subscribe-wrapper{color:#fff;font-size:16px;line-height:normal;margin:0;text-align:center;text-transform:none;font-weight:400;width:100%}
.subscribe-form{clear:both;display:block;overflow:hidden}
form.subscribe-form{clear:both;display:block;margin:0;width:auto;overflow:hidden}
.subscribe-css-email-field{background:#415471;color:#ccc;margin:10px 0;padding:15px 20px;width:35%;border:0}
.subscribe-css-email-button{background:#3cc091;color:#fff;cursor:pointer;font-weight:700;padding:14px 30px;margin-left:15px;text-transform:none;font-size:16px;border:0;border-radius:3px;transition:all .6s}
.subscribe-css-email-button:hover{background:#37b185;}
#subscribe-css p.subscribe-note{margin:16px;text-align:center;color:#58585a;font-size:180%;font-weight:400;line-height:normal;}
#subscribe-css p.subscribe-note span {position:relative;overflow:hidden;font-weight:700;transition:all .5s}
#subscribe-css p.subscribe-note span.itatu {font-weight:400;font-style:italic;color:#777;text-transform:lowercase}
#subscribe-css p.subscribe-note span.itatu:before,#subscribe-css p.subscribe-note span.itatu:after{display:none}
#subscribe-css p.subscribe-note span:before{content:'';position:absolute;bottom:-2px;left:0;width:0;height:3px;margin:10px 0 0;background:rgba(255,255,255,.1);transition:all .5s}
#subscribe-css:hover p.subscribe-note span:before{width:100%;}
7. Simpan tema dan lihat hasilnya.

Keterangan :

  • Silahkan ganti tanya ### dengan ID FeedBurner.
  • Untuk ukuran tidak perlu Anda ubah karna sudah resposive.
  • Jika warna goresan pena atau kotaknya kurang sesuai dengan template blog Anda silahkan Anda ganti sesuka hati.
Itu tadi cara menciptakan widget subscribe di blog, cukup gampang bukan, bila masih ada kekurangan silahkan berkomentar dengan memberi saran, biar sama-sama sanggup menyebarkan blog ini lebih baik lagi.

Sumber http://felovena01.blogspot.com
Buat lebih berguna, kongsi:

Trending Kini: