Cara pasang Feedburner Email Subscription Form terlajak memukau pada blog

Bismillah…

Sebelum aku teruskan dengan perkongsian pada entri ini, terlebih dahulu aku doakan kepada anda yang membaca entri ini agar mudah untuk menerima ilmu yang aku kongsikan serta berkongsi maklumat dengan rakan-rakan lain

Amin…

Ok…

Aku baru selesai ubahsuai blog ini agar nampak lebih kemas dan teratur.

Dan…

Sudah selesai pasang Feedburner Email Subscription. Masih ramai blogger yang tidak sedar akan kelebihan feedburner ni. Jadi aku ulas serba ringkas dibawah…

Feedburner adalah satu aplikasi atau platform yang menguruskan segala kandungan laman web agar boleh dibaca oleh setiap pengunjung melalui platform lain khususnya melalui email, media sosial dan sebagainya.

Jadi,

Dalam skop kita berblogging, feedburner ini sebenarnya penting agar pengunjung tetap sesebuah blog tidak terlepas dari sebarang berita terbaru. Jika mereka tidak berkesempatan untuk melayari blog, ada alternatif lain iaitu melalui email.

Untuk itu, kita sebagai pentadbir blog perlu menyediakan satu borang khas untuk kita mendapatkan alamat email setiap pengunjung blog.

Aku telah pasang borang tersebut di halaman utama blog ini. Anda boleh lihat di sebelah penjuru kanan.

Apa pendapat anda? Menarik atau tidak?

Dalam entri ini, aku cuba kongsi sedikit ilmu + tutorial untuk pasang borang ini di blog anda.

Kandungan tutorial di blog asal di MS Design telah diubahsuai kepada Bahasa Melayu agar anda lebih mudah hadam dan faham. Jadi, jom kita mulakan

feedburner email subscriptions Form ini adalah menggunakan CSS sepenuhnya. Jadi, ada sedikit pengubahsuaian pada template blogger anda.

Perkara pertama perlu anda buat adalah dengan menambah google font jenis PT San dan ikon media sosial jenis Fontawesome.

1. Pergi ke Dashboard > Template > Edit HTML dan salin kod dibawah selepas kod <head>

2. Sekarang, tambah kod CSS sebelum kod aturcara </style> pada template

#subscribebox{background:#UBAH-KOD-WARNA-IKUT-SUKA-ANDA;padding:20px;font-family:&#39;PT Sans&#39;,sans-serif;}
.widget_follow_subscribe .widget-detail{padding:36px 30px 40px}
#subscribebox p{color:#fff;font-size:15px;text-align:center;font-weight:700}
.follow-subscribe-social{margin:0 0 15px;padding:0 0 14px;border-bottom:#858585 solid 1px}
.follow-subscribe-social ul{list-style:none;margin:0;padding:0;text-align:center}
.follow-subscribe-social ul li{display:inline;margin:0 15px 0 0;border-bottom:none}
.follow-subscribe-social ul li:last-child{margin:0}
.follow-subscribe-social ul li a{font-size:17px;color:#cacaca;-webkit-transition:color .2s ease-in-out;-moz-transition:color .2s ease-in-out;-ms-transition:color .2s ease-in-out;-o-transition:color .2s ease-in-out;transition:color .2s ease-in-out}
.follow-subscribe-social ul li a:hover{color:#fff}
form.subscribe{margin-top:10px}
form.subscribe input{display:block;width:100%}
.subscribe-email{height:45px;border:none;margin:0 0 10px;font-size:.928571em;background-color:rgba(255,255,255,0.2);text-align:center;color:#fff}
.subscribe-email:focus{outline:0}
form.subscribe .placeholder{color:#cacaca}
form.subscribe input:-ms-input-placeholder{color:#cacaca}
form.subscribe input::-webkit-input-placeholder{color:#cacaca}
form.subscribe input:-moz-placeholder{color:#fafafa}
form.subscribe input::-moz-placeholder{color:#fafafa}
.subscribe-button{height:45px;font-weight:700;font-size:16px;color:#fff;text-transform:uppercase;border:none;background-color:#F35D5C;-webkit-transition:background-color .2s ease-in-out;-moz-transition:background-color .2s ease-in-out;-ms-transition:background-color .2s ease-in-out;-o-transition:background-color .2s ease-in-out;transition:background-color .2s ease-in-out}
.subscribe-button:hover{background-color:#f1d640}
.subscribe-button:focus{outline:0}
.creadit a{color: #A7A6A6; float: right; font-size: 8px;}

Sila ubah kod warna seperti yang aku bold kan di atas.

Setelah selesai, Save template anda

Langkah terakhir, pergi ke menu Layout > Add a Gadjet > HTML/Javascript dan salin kod dibawah. Kemudian simpan.

<div id=“subscribebox”><div class=“follow-subscribe-social”><ul><li><a href=“#” target=“_blank”><i class=“fa fa-facebook”></i></a></li><li><a href=“#” target=“_blank”><i class=“fa fa-twitter”></i></a></li><li><a href=“#” target=“_blank”><i class=“fa fa-linkedin”></i></a></li><li><a href=“#” target=“_blank”><i class=“fa fa-google”></i></a></li><li><a href=“#” target=“_blank”><i class=“fa fa-pinterest-p”></i></a></li><li><a href=“#” target=“_blank”><i class=“fa fa-dribbble”></i></a></li><li><a href=“#” target=“_blank”><i class=“fa fa-instagram”></i></a></li></ul></div><p>Subscribe to my Newsletter</p><form class=“subscribe” action=‘http://feedburner.google.com/fb/a/mailverify?uri=YOUR-USER-NAME’ method=‘post’ onsubmit=‘window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=YOUR-USER-NAME, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true’ target=‘popupwindow’><input name=‘uri’ type=‘hidden’ value=‘YOUR-USER-NAME’/><input name=‘loc’ type=‘hidden’ value=‘en_US’/><input class=“subscribe-email” type=‘text’ name=’email’ onblur=‘if (this.value == &quot;&quot;) {this.value = &quot;Your Email&quot;;}’ onfocus=‘if (this.value == &quot;Your Email&quot;) {this.value = &quot;&quot;;}’ value=‘Your Email’/><input class=“subscribe-button” type=“submit” value=“Subscribe” /></form></div><div class=“creadit”><a href=“http://msdesignbd.com” rel=“dofollow” target=“_blank”> Get This Widget</a></div>

Selesai…

Anda boleh review Subscription Form yang telah anda pasang di blog untuk lihat tahap keohseman nya.

Nanti bila sudah pasang borang tersebut, kena invite pengunjung setia untuk submit email mereka di borang tersebut.

Supaya mudah untuk mereka akses dan baca entri blog anda pada email mereka sahaja.

Nanti aku kongsikan cara-cara untuk dapatkan trafik yang bermurah hati untuk tinggalkan email pada Subscription Form terlajak memukau ni.

Baru anda akan arasa bahagia senyum sampai ke belakang kepala bila tengok pageview blog anda mencanak meroket ke langit.

Ok lah… sekian sahaja perkongsian menusuk kalbu dari aku. Semoga anda semua mendapat keberkatan dari perkongsian ini.

Jazakallah…..

Kredit to: MS Design

3 Comments

  1. titan 17/06/2016
  2. Afif Rayyan 03/06/2016
  3. Raihanah Ahmad 23/05/2016

Add Comment

CommentLuv badge

Minisite Builder dan Affiliate Platform tanpa yuran bulanan. Dapatkan SEKARANG!!!Di SINI