Skip to main content

Cara Membuat Subscribe Box Di Blog

Cara Membuat Subscribe Box Di Blog
Cara Membuat Subscribe Box Di Blog - Pada kali ini kita akan membuat subscribe box atau kotak berlangganan responsive di blog. Subscribe box atau subscription box merupakan sebuah widget dimana pengunjung blog bisa mendapatkan update terbaru dari blog kita dengan cara mendaftarkan emailnya ke formulir yg terdapat dalam widget tersebut. Setelah berlangganan, pengunjung tersebut akan dikirim email pada saat ada postingan terbaru dari blog kita. Membuat subscribe box pun dapat menciptakan backlink dari setiap email pelanggan, otomatis ini juga dapat meningkatkan seo blog. Berikut cara membuat subscribe box di blog.

Demo

CSS Subscribe Box

  • Login ke akun Blogger sobat.
  • Klik template pada dashboard.
  • Lalu klik edit HTML.
  • Copy dan pastekan salah satu CSS subscribe box dibawah ini tepat diatas kode ]]></b:skin>.

Subscribe Box Style 1

.subscribe-box{border:1px solid #eee;border-radius:4px;color:#fff;background:#eee;font-size:12px;line-height:20px;padding:1px 20px 10px;text-align:center;text-transform:none;font-weight:500}form.subscribe-box-form{clear:both;display:block;margin:10px 0 0;width:auto;overflow:hidden}.subscribe-box-email-field{outline:none;background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWzGnP7FYVqobKgPkykSzE1yDKe0FCt75mGCoERN3o34A5csP15ZibR5CQbqHedDdZ2PCmYnG9XFCviifOwew4g831ktk-O7FmCWaGzPNI7BzYU3rM4fOvLsbbi33H3k6dJ4G4tQEHlSg4/s1600/sprites.png) no-repeat 1px -27px;color:#444;margin:0 0 15px;padding:12px 40px;width:100%;border:none}.subscribe-box-email-button{outline:none;background-color:#ff5848;background-image:-webkit-linear-gradient(top,#ff5848,#FC3D2B);color:#fff;cursor:pointer;font-weight:700;padding:10px;text-transform:none;width:100%;border:none;font-size:16px}

Subscribe Box Style 2

.subscribe-box{border-radius:4px;color:#fff; background:#00aa9f ; font-size:12px;line-height:20px;padding:1px 20px 10px;text-align:center;text-transform:none;font-weight:500}form.subscribe-box-form{clear:both;display:block;margin:10px 0 0;width:auto;overflow:hidden}.subscribe-box-email-field{outline:none;background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWzGnP7FYVqobKgPkykSzE1yDKe0FCt75mGCoERN3o34A5csP15ZibR5CQbqHedDdZ2PCmYnG9XFCviifOwew4g831ktk-O7FmCWaGzPNI7BzYU3rM4fOvLsbbi33H3k6dJ4G4tQEHlSg4/s1600/sprites.png) no-repeat 1px -27px;color:#444;margin:0 0 15px;padding:12px 40px;width:100%;border:none}.subscribe-box-email-button{outline:none;background-color: #333; background-image: -webkit-linear-gradient(top,#333,#323);color:#fff;cursor:pointer;font-weight:700;padding:10px;text-transform:none;width:100%;border:0;font-size:16px}

Subscribe Box Style 3

.subscribe-box{border-radius:4px;color:#fff; background:#eee; font-size:12px;line-height:20px;padding:1px 20px 10px;text-align:center;text-transform:none;font-weight:500}form.subscribe-box-form{clear:both;display:block;margin:10px 0 0;width:auto;overflow:hidden}.subscribe-box-email-field{outline:none;background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWzGnP7FYVqobKgPkykSzE1yDKe0FCt75mGCoERN3o34A5csP15ZibR5CQbqHedDdZ2PCmYnG9XFCviifOwew4g831ktk-O7FmCWaGzPNI7BzYU3rM4fOvLsbbi33H3k6dJ4G4tQEHlSg4/s1600/sprites.png) no-repeat 1px -27px;color:#444;margin:0 0 15px;padding:12px 40px;width:100%;border:none}.subscribe-box-email-button{outline:none;background-color: #4d90fe; background-image: -webkit-linear-gradient(top,#4d90fe,#4787ed);color:#fff;cursor:pointer;font-weight:700;padding:10px;text-transform:none;width:100%;border:none;font-size:16px}
  • Kemudian klik simpan

HTML Subscribe Box

Ada banyak opsi dimana posisi paling efektif meletakkan atau memasang subscribe box yg dapat dijangkau oleh pengunjung blog seperti di sidebar blog, di bawah postingan ataupun membuat popup subscribe box.

Subscribe Box Di Sidebar

  • Login ke akun Blogger.
  • Klik tata letak pada dashboard.
  • Lalu tambahkan element/add gadget dan pilih HTML/Javascript.
  • Copy dan pastekan html di bawah ini.
<div class='subscribe-box'>
<form action='http://feedburner.google.com/fb/a/mailverify?uri=TypePedia' class='subscribe-box-form' method='post' onsubmit='window.open (&apos;http://feedburner.google.com/fb/a/mailverify?uri=TypePedia&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
<input name='uri' type='hidden' value='TypePedia'/><input name='loc' type='hidden' value='en_US'/><input autocomplete='off' class='subscribe-box-email-field' name='email' placeholder='Enter your email address '/><input class='subscribe-box-email-button' title='' type='submit' value='Subscribe Now !'/></form>
</div>
  • Klik simpan

Membuat Subscribe box Di Bawah Postingan

  • Login ke akun Blogger sobat.
  • Klik template pada dashboard.
  • Lalu klik edit HTML.
  • Copy dan pastekan salah satu CSS subscribe box diatas tadi tepat dibawah kode <div class="post-footer-line post-footer-line-1">.
  • Kemudian klik simpan
Demikianlah tutorial mengenai cara membuat subscribe box atau cara membuat kotak berlangganan responsive di blog. Semoga artikel ini dapat bermanfaat bagi kita semua dan dapat memperbanyak jumlah pelanggan blog anda. Jangan lupa like atau share.
Labels:

Comments

Post a Comment

Popular posts from this blog

10 Jembatan Paling Terkenal Di Dunia

10 Jembatan Paling Terkenal Di Dunia - Jembatan merupakan sebuah sarana untuk menyeberangi sungai ataupun lautan. Jembatan paling terkenal di dunia berikut mungkin adalah jembatan terpanjang, jembatan tertinggi di dunia. Banyak wisatawan dari penjuru dunia datang hanya untuk melihat maupun berfoto diatas jembatan ini. Berikut adalah 10 jembatan paling terkenal di dunia . 1. Jembatan Golden Gate, Amerika Serikat Jembatan paling terkenal pertama adalah jembatan Golden Gate. Jembatan Golden Gate (Golden Gate Bridge) menghubungkan antara San Fransisco dengan California. Jembatan ini memiliki panjang keseluruhan sekitar 2.727 meter dan tinggi 230 meter diatas permukaan laut. Jembatan Golden Gate dibuka pertama kali pada tahun 1937 dan merupakan jembatan paling terkenal serta menjadi daya tarik wisata paling populer di San Francisco. 2. Jembatan Menara, Inggris Jembatan paling terkenal kedua adalah jembatan Menara. Jembatan Menara (Tower Bridge) dibangun pada tahun 1886 dan ...
Post a Comment
Read more

10 Mobil Termahal Di Dunia

10 Mobil Termahal Di Dunia - Mobil merupakan kendaraan roda empat berbahan bakar bensin atau solar. Tidak seperti motor, mobil dapat mengangkut lebih dari dua orang dan dapat melindungi pengendara dari hujan dan panas. Di indonesia sendiri mobil sering di anggap sebagai tanda kekayaan dan kesuksesan seorang. Tapi apakah orang kaya Indonesia bisa membeli mobil termahal di dunia di bawah ini. Berikut 10 mobil termahal di dunia tahun 2014 versi Forbes. Mobil Mercedes-Benz CL65 AMG Coupe Negara Asal: Jerman Mesin: 621-hp, 6.0-liter, bi-turbo V-12 0-60 mph: 4.2 detik Harga : $ 215.500  Mobil Aston Martin Vanquish Negara Asal: Inggris Mesin: 565-hp, 6.0-liter V-12 0-62 mph (yaitu, 100 km per jam): 4,1 detik Harga: $ 279.995  Mobil Bentley Mulsanne Negara Asal: Inggris Mesin: 505-hp, 6.75-liter, twin-turbo V-8 0-60 mph: 5.1 detik Harga : $ 298.900  Mobil Rolls-Royce Phantom Wheelbase Negara Asal: Inggris Mesin: 453-hp, 6.75-liter V-12 0-60 mph: 5.8 detik Harga :...
Post a Comment
Read more

Mobil Paling Nyaman Pilihan Keluarga Indonesia

Mobil Paling Nyaman Pilihan Keluarga Indonesia - Kebutuhan mobil keluarga yang aman serta nyaman di Indonesia mulai berkembang secara pesat. Membeli mobil keluarga bagaikan membeli sebuah rumah karena bisa dibilang mobil adalah rumah kedua bagi pengendaranya. Berbicara mengenai mobil keluarga, Nissan Motor Indonesia menawarkan mobil Nissan All New Grand Livina sebagai produk unggulannya. Ada banyak perubahan dalam desain ekterior maupun interion dalam mobil All New Grand Livina serta ada 6 pilihan warna yg dirilis Nissan. Pada bagian interior juga dibuat lebih lapang dan nyaman. Berikut review singkat mengenai All New Grand Livina , mobil paling nyaman pilihan keluarga Indonesia. All New Grand Livina , Mobil Paling Nyaman Pilihan Keluarga Indonesia Pada edisi terbarunya. Nissan Grand Livina memiliki tampilan yang gagah dan mengusung tema "Comfort Creates Happiness". Desain terbarunya tidak hanya pada bagian eksterior, tapi juga pada bagian interior. Head Lamp dibuat...
Post a Comment
Read more