Membuat Pop up Subscribe Email – Subscribe atau Berlangganan adalah opsi yang ditawarkan oleh vendor produk atau penyedia layanan yang memungkinkan pelanggan mendapatkan akses ke produk atau layanan. Sebagian besar model berbasis langganan adalah layanan berbayar, yang mengharuskan pelanggan membayar biaya berlangganan untuk mengakses dan menggunakan produk atau layanan tertentu. Tapi disini kita akan membagikan tutorial cara membuat pop up widget subscribe box yakni email berlangganan gratis!

Cara Membuat Pop up Subscribe Email Berlangganan di Blog

Selain itu, banyak situs web, perusahaan produk dan layanan, dll., Memungkinkan pelanggan untuk berlangganan buletin mereka, blog terkait produk / layanan, siaran pers, dll. Untuk berlangganan, pelanggan harus menambahkan alamat emailnya ke mailing list perusahaan. Ini berarti bahwa pelanggan berlangganan apa pun yang dikirim ke milis itu.

Apa itu Subscribe atau Berlangganan?

Seringkali, berlangganan memerlukan pendaftaran alamat email di situs web. Alamat email yang terdaftar ditambahkan ke repositori ID email pelanggan, yang digunakan untuk mengirim massal beberapa jenis konten digital. Mendapatkan pembaruan harian, mingguan, kupon, atau penawaran dari berbagai organisasi juga merupakan model baru berbasis langganan.

Penyedia Perangkat Lunak sebagai Layanan (SaaS) juga menawarkan model berbasis langganan, yang mencakup dua jenis:

Model berlangganan bulanan: Dalam model ini, pelanggan membayar setiap bulan, seringkali melalui kartu kredit atau pembayaran elektronik otomatis. Secara umum, pelanggan diizinkan untuk membatalkan langganan kapan saja, tanpa penalti atau biaya. Meskipun tidak biasa, beberapa perusahaan berlangganan bulanan memang menyediakan langganan triwulanan dan tahunan.

Model langganan jangka: Dalam model ini, pelanggan berlangganan layanan untuk periode waktu yang disepakati bersama. Perjanjian berlangganan mungkin atau mungkin tidak memasukkan ketentuan untuk pembatalan selama periode perjanjian. Model langganan berjangka memiliki fitur pembayaran yang fleksibel, yang dapat mencakup ketentuan pembayaran khusus bulanan, triwulanan, tahunan, atau yang disepakati bersama.

Baca juga: Memasang Script Lazy Load untuk Mempercepat Loading di Blog

Selain penyedia SaaS, banyak situs web juga menggunakan model berbasis langganan. Beberapa jenis situs web berlangganan populer adalah:

  • Situs web berlangganan keanggotaan: Anggota berbayar dapat berlangganan perpustakaan data tentang topik tertentu atau sekelompok topik.
  • Situs web berlangganan majalah: Anggota berbayar dapat berlangganan majalah digital atau cetak terkait atau majalah.
  • Situs web berlangganan aplikasi: Anggota berbayar dapat berlangganan untuk mendapatkan akses ke program perangkat lunak online tertentu atau aplikasi yang memungkinkan mereka memasukkan data, mencari basis data berpemilik, hasil akses, dll.
  • Situs web berlangganan blog: Sebagian besar model berlangganan gratis di mana pembaca dapat mengakses penerbit serta konten yang dibuat pengguna, yang diperbarui secara konsisten dan sering.

Namun, kali ini saya sumekar31 akan membagikan subscribe box unlimited tanpa batas. Membuat Widget Pop up Email Subscribe Box Berlangganan di Blog – Adalah widget blogger menggunakan jquery. Formulir berlangganan ini dibuat dengan css3 dan jquery. Dalam tutorial ini saya berbagi cara menambahkan dan memasang kotak berlangganan email langganan untuk blog blogspot Anda.

Cara Membuat Pop up Subscribe Box

Dengan menambahkan widget ini, Anda harus dengan mudah meningkatkan pembaca blog Anda. Ini cara yang lebih baik untuk meningkatkan pembaca blog. Saya harap kotak berlangganan email sembulan yang baru ini membantu Anda meningkatkan pembaca blog. Sekarang mari kita mulai tutorialnya.

1. Buka dasbor blogger> Template > Edit HTML dan masukkan Kode CSS di bawah ini sebelum </style>

CSS

#sub-box {display:none;background:rgba(0,0,0,0.9);width:100%;height:100%;position:fixed;top:0;left:0;z-index:99999;}
#boxclose {width:100%;height:100%;-webkit-transform:translateZ(0);}
#boxview {background:#fff;border:8px solid #fff;width:600px;height:250px;position:absolute;top:33%;left:28%;}
#closebox {float:right;cursor:pointer;position:absolute;right:-1px;top:-2px;}
#closebox:before {content:&quot;Close&quot;;padding:5px 8px;background:#fff;color:#48cb7a;font-weight:normal;font-size:12px;font-family:Open sans;}
#boxlink,#boxlink a.visited,#boxlink a,#boxlink a:hover {color:#aaaaaa;font-size:9px;text-decoration:none;text-align:center;padding:5px;}
#subscribe-box {width:600px;height:250px;background-color:#02BA74;}
#subscribe-box p {font-family:&#39;Open Sans&#39;;font-size:18px;color:#fff;line-height:20px;padding:10px 20px 0 20px;margin:0;}
#subscribe-box .emailfield {padding:0px 20px 10px;}
#subscribe-box .emailfield input {background:#f9f9f9;color:#bbb;padding:10px;margin-top:10px;font-size:13px;font-family:&#39;Open Sans&#39;;width:96.3%;border:0;transition:all 0.4s ease-in-out;}
#subscribe-box .emailfield input:focus {background:#fff;outline:none;color:#888;}
#subscribe-box .emailfield .submitbutton {background:#444;color:#fff;text-transform:uppercase;font-weight:normal;font-size: 16px;border:none;outline:none;width:100%;cursor:pointer;border-radius:3px;transition:all 0.4s ease-in-out;}
#subscribe-box .emailfield .submitbutton:active {outline:none;border:none;background:#fff;color:#e25734;}
#subscribe-box .emailfield .submitbutton:hover{background:#fff;color:#444;}

2. Sekarang Simpan Template.
3. Sekarang pergi ke Layout > Tambahkan gadget > HTML / Javascript dan masukkan kode di bawah ini.

Javascript

<script type='text/javascript'>
//<![CDATA[
jQuery.cookie = function (key, value, options) {
// Pengaturan cookie
if (arguments.length > 1 && String(value) !== "[object Object]") {
options = jQuery.extend({}, options);
if (value === null || value === undefined) {
options.expires = -1;
}
if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate() + days);
}
value = String(value);
return (document.cookie = [
encodeURIComponent(key), '=',
options.raw ? value : encodeURIComponent(value),
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}
// cookie
options = value || {};
var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;
return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;
};
//]]>
</script>
<script type='text/javascript'>
jQuery(document).ready(function($){
if($.cookie('popup_facebook_box') != 'yes'){
$('#sub-box').delay(3000).fadeIn('fast');
$('#closebox, #boxclose').click(function(){
$('#sub-box').stop().fadeOut('fast');
});
}

});
</script>
<div id='sub-box'>
<div id='boxclose'>
</div>
<div id='boxview'>
<div id='closebox'>
</div>
<div id='subscribe-box'>
                 <center><p>Subscribe for Latest Update</p></center>
             <div class='emailfield'>
              <form 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 type='text' name='name' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Your Name&quot;;}' onfocus='if (this.value == &quot;Your Name&quot;) {this.value = &quot;&quot;;}' value='Your Name'/>
               <input 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 name='uri' type='hidden' value='YOUR-USER-NAME'/>
<input name='loc' type='hidden' value='en_US'/>
                <input class='submitbutton' type='submit' value='Subscribe Now!'/>
</form>
</div></div> 
</div>
</div>

Catatan: Untuk YOUR USER NAME ganti dengan nama pengguna feedburner Anda.

Itu dia. Sekarang segarkan halaman Anda dan lihat hasilnya. Jika Anda menemukan masalah maka informasikan kepada saya bagian komentar dan jika Anda berpikir posting kami bermanfaat maka jangan lupa untuk berbagi dengan orang lain.

Akhir Kata

Terima kasih teman-teman telah mengunjungi Sumekar31 dan telah membaca artikel Cara Membuat Pop up Subscribe Email Berlangganan Responsive ini. Silakan terus kunjungi situs ini untuk lebih banyak artikel dan informasi baru. Sampai nanti selamat tinggal. Semoga harimu indah dan menyenangkan.

1 KOMENTAR

LEAVE A REPLY

Please enter your comment!
Please enter your name here