Langsung ke konten utama

Membuat Widget Subscription Box untuk Blogger

Membuat Widget Subscription Box untuk Blogger

Hohoho, selamat siang, di kesempatan akan menjelaskan tentang renovasi otak lyrics Membuat Widget Subscription Box untuk Blogger simak selengkapnya 

Membuat Widget Subscription Box buat Blogger - Tentunya para blogger telah tidak asing dengan widget yang satu ini. Yap, akurat Subscription Box, subscription box dibuat guna memudahkan pengunjung buat berlangganan pada blog kita dengan feedburner. Setelah pengunjung setia anda berlangganan, pengunjung akan mendapatkan notifikasi dari email ketika blog anda memiliki esai baru. Pastinya amat bermanfaat bukan?

Kali ini kita melaksanakan widget Subscription Box hanya dengan menggunakan HTML dan dipadukan dengan CSS yang melaksanakan pengejawantahan menjadi menarik dan ringan pastinya. Lantas, dengan jalan apa cara membuatnya? ikuti langkah demi langkah berikut ini.

Cara Membuat Widget Subscription Box

Sebelum beranjak ke tutorial melaksanakan widget ini, pastikan kalian telah terdaftar di FeedBurner. Jika belum, silahkan daftar terlebih dahulu.

1. Login ke akun blogger kalian

2. Pergi ke menu 

 Template 

 ➤ 

 Edit HTML 

3. Letakkan kode css dibawah ini tepat DIATAS </style> atau ]]></b:skin>

#subscribe-box margin:0;padding:0;width: 100%;height: auto;border-radius: 2px;background: linear-gradient(45deg, #7dffcb, #00ff77, #00ffc3, #00fff7, #00d5ff, #035787);
    background-size: 500% 500%;
    -webkit-animation: ROGradient 9s ease infinite;
    -moz-animation: ROGradient 9s ease infinite;
    animation: ROGradient 9s ease infinite;

@-webkit-keyframes ROGradient 
    0%background-position:0% 50%
    50%background-position:100% 50%
    100%background-position:0% 50%

@-moz-keyframes ROGradient 
    0%background-position:0% 50%
    50%background-position:100% 50%
    100%background-position:0% 50%

@keyframes ROGradient 
    0%background-position:0% 50%
    50%background-position:100% 50%
    100%background-position:0% 50%

#subscribe-box .title padding: 10px 25px;line-height: 30px;font: 26px Oswald;color: black;text-align: center;text-transform:uppercase;border-radius:2px 2px 0 0;
#subscribe-box p font-family: 'Droid Serif';font-size: 14px;color:black;line-height:20px;padding: 10px 20px 0 20px;margin: 0; text-align: center;
#subscribe-box .emailfield padding: 0px 20px 10px;
#subscribe-box .emailfield input box-sizing: border-box;line-height:15px;color: #777;padding: 10px;margin-top: 10px;font-size: 15px;font-family: 'Droid Serif';border:0;border-radius: 2px;width:100%;
#subscribe-box .emailfield input:focus outline: none;
#subscribe-box .emailfield .submitbutton width:100%;background: #00784e;color: white;border:none;outline: none; cursor:pointer; -webkit-transition: background 1.7s ease;
#subscribe-box .emailfield .submitbutton:hoverbackground: #133b2d;

4. Lalu klik Simpan

5. Masih di dasboard blogger, pergi ke menu

 Tata Letak 

➤

 Tambah Gadget 

➤

 HTML/JavaScript 

6. Masukkan kode dibawah ini 

<div id='subscribe-box'>
<div class='title'>
Renovasi Otak
</div>
<p>
Ingin mendapatkan informasi gratis terbaru setiap hari dari kami? Daftarkan nama dan email anda sekarang juga.
</p>
<div class='emailfield'>
              <form action='https://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open('https://feedburner.google.com/fb/a/mailverify?uri=nandorifky', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'>
               <input type='text' name='name' onblur='if (this.value == "") this.value = "Your Name";' onfocus='if (this.value == "Your Name") this.value = "";' value='Your Name' />
               <input type='text' name='email' onblur='if (this.value == "") this.value = "Your Email";' onfocus='if (this.value == "Your Email") this.value = "";' value='Your Email' />
<input name='uri' type='hidden' value='nandorifky'/>
<input name='loc' type='hidden' value='en_US'/>
                <input class='submitbutton' type='submit' value='Submit'/>
              </form>
</div>
</div>

Ubah https://feedburner.google.com/fb/a/mailverify?uri=nandorifky dengan url Feedburner anda.



Incoming Search Terms
  • cara melaksanakan persegi subscribe blog keren elegan
  • cara memasang persegi berlangganan di blog
  • cara menambahkan newslatter di blog
  • subscribe box buat blog
  • kotak berlangganan blogspot

DONASI VIA PAYPAL Bantu berikan donasi jika esai bermanfaat. Donasi akan digunakan sebaik mungkin buat kepentingan renovasi-otak.blogspot.com. Terimakasih.

oke pembahasan tentang Membuat Widget Subscription Box untuk Blogger semoga artikel ini menambah wawasan salam

tulisan ini diposting pada label renovasi otak lyrics, blogger sign, kunci gitar renovasi otak, , tanggal 27-09-2019, di kutip dari https://renovasi-otak.blogspot.com/2019/07/widget-subscription-box-blogger.html

Label:

Komentar

Posting Komentar

Postingan populer dari blog ini

Cara Mengunci Halaman Blog yang Bersifat Privasi

Hohoho, selamat sore, pada kali ini akan membawa pembahasan mengenai blogger template Cara Mengunci Halaman Blog yang Bersifat Privasi simak selengkapnya  Jika sebelumnya admin telah membagikan  cara basmi bulan dan tahun atas url blogger , kali ini admin akan membagikan cara  cara mengunci jerambah blog dengan javascript . Cara ini dianjurkan untuk blogger yang memiliki jerambah yang bersifat privasi. Dengan hanya menggunakan JavaScript, anda telah bisa mengunci jerambah blog tersebut dan tidak perlu khawatir lagi andaikan siap orang lain yang mengunjungi jerambah isolasi kita. Contoh, jerambah yang berisi foto(Galery), ataupun jerambah yang berisi kode-kode penting yang siap di blog kita, dan lain sebagainya. Ketika anda telah memasang script, orang yang mengunjungi jerambah tersebut akan diminta memasukkan password yang telah tercantum atas script tersebut. Cara Mengunci Halaman Blog dengan JavaScript <script language="JavaScript"> var password; var pass1=...
Posting Komentar
Baca selengkapnya

Tutorial HTML dan CSS: Membuat Tombol Download Menarik

Hallo, bertemu kembali, pada kali ini akan membawakan tentang renovasi otak - dialog dini hari Tutorial HTML dan CSS: Membuat Tombol Download Menarik simak selengkapnya  Renovasi Otak  - Bagi blog yang berisi tentang berbagi file, mencadangkan link download untuk artikel yang dibuat. Untuk membuat link tersebut menjadi menarik, alangkah baiknya kalian menggantinya dengan benjol download agar terlihat lebih profesional. Baca Juga:   Cara Mengubah Desain Table dengan CSS Pada kesempatan kali ini, admin hendak berbagi tutorial membuat benjol download elegan dengan css. Dengan tampilan yang simple dan keren, pastinya hendak membuat pelanggan setia anda tertarik untuk mendownloadnya. Untuk tutorial membuatnya, kalian tinggal ikuti langkah demi langkah dibawah ini. Cara Membuat Tombol Download Keren dengan CSS 1. Login ke akun Blogger kalian 2. Masuk ke menu  Template   ➤   Edit HTML  3. Letakkan asas CSS dibawah ini tepat DIATAS asas ]]></b:skin> atau </style> /* ...
Posting Komentar
Baca selengkapnya

Tutorial CSS: Mengubah Design Table HTML Keren

Hi, selamat pagi, sesi kali ini akan membawakan tentang lagu renovasi otak Tutorial CSS: Mengubah Design Table HTML Keren simak selengkapnya  Renovasi Otak  - Table merupakan element yang paling penting dengan paling sering kita gunakan buat menampilkan data misalnya. Selain menampilkan data dalam bentuk list, kita juga bisa menampilkan data dalam bentuk table. Data yang ditampilkan dalam bentuk table sangatlah sederhana dengan tidak memiliki warna. Jadi alangkah baiknya table tersebut kita design agar lebih menarik dengan enak dipandang. Masih sekitar CSS, kali ini admin akan membagikan cara melahirkan design table dengan css. Langsung saja simak penjelasan berikut ini. Cara Membuat Design Table dengan CSS Perhatikan contoh penulisan table dibawah ini index.html <!DOCTYPE html> <html> <head> <title>Renovasi Otak | Cara Membuat Design Table dengan CSS</title> <link rel="stylesheet" type="text/css" href="style....
Posting Komentar
Baca selengkapnya