Friday 24 January 2014

Cara Menambahkan Kotak Subscribe Pada Blogger/Website

Dalam tutorial ini, saya akan menjelaskan kepada kalian untuk bagaimana membuat kotak subscribe(berlangganan) dengan Feedburner Email berlangganan, langganan Feed dan tombol jaringan sosial seperti(Digg, Twitter, Facebook, Stumbleupon, Delicious). Kalian dapat dengan mudah menambah atau menghapus tombol sosial untuk widget ini.Jika kalian ingin menambahkan widget ini ke blog atau website Anda, maka ikuti langkah-langkah di bawah ini :

Screanshot:


1.Pertaman Login ke akun Blogger kalian lalu ke dashboard--> Tata Letak.

2.Lalu Tambahkan Gadgetnya (Add a Gadget/Tambahkan Gadget)


3.Pilih fitur 'HTML/Javascript' dan tambahkan code Javascript tersebut yang telah saya berikan kemudian Simpan atau Save

Code :

<style type="text/css">
#subscribe-box {
      overflow: hidden;
      margin: 10px 0 0 0;
      }

#subscribe-box a.subscribe-sec {
      display: inline-block;
      display: -moz-inline-stack;
      width: 40px;
      padding-top: 38px;
      zoom: 1;
      }

#subscribe-box a.subscribe-sec:hover {
      color: #660000;
      }
</style>

<form action="http://feedburner.google.com/fb/a/mailverify" style="border:1px solid #ccc;padding:3px;" target="popupwindow" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=FEEDBURNER-ID', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><p>Get Notified When We Update !!!</p><p><input style="width:180px" name="email" type="text" value="Enter your email address:" onclick="this.value=&#39;&#39;;" /><input value="FEEDBURNER-ID" name="uri" type="hidden" /><input value="en_US" name="loc" type="hidden" /><input value="Subscribe" type="submit" /></p>

<p><div id="subscribe-box">
<a title="Delicious" href="http://delicious.com/DELICIOUS-USERNAME" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKEN23LVzL3a9hH79RUjSU6lhrdp7-IV36JsKyC_bhocaaLMCoZw6E0O97inUdBTW1kFYIolUAKZfpberwqc3EDAh8iRows-8Dlc1qXBLBgvxilylyJP74bbBF7QgPB5pYcTsCyYCg55xb/s1600/delicious.png) center top no-repeat"></a>
<a title="Twitter" href="http://twitter.com/TWITTER-USERNAME" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEpgKDmALznp7AqDofzwQOVkdsk-02poopNhNYgXc7IlObniWJCi3jtZwFLuWXlOC2GA6fxWiK8YKH1j-6pQvLRnXdbOWal5KyhaItS0khGWJmlsPYpXQPZGM6QcorNM3UYFhkuKYi6S0b/s1600/twitter.png) center top no-repeat"></a>
<a title="Digg" href="http://digg.com/users/DIGG-USERNAME" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIzqtbYTSdQQMBOmmx359KYc7R97RTRm7fSNgcU7naBq4fGwZN3Pn3U02QjwHQuCJ7J8CDc-u4kUjZXTJX1VLzzMniYT5dSeaH24KcW5Piyf8IcXJYYWzeHJMpC-N_7lrTJ5h3-k7JR5os/s1600/digg.png) center top no-repeat"></a>
<a title="Facebook" href="http://www.facebook.com/FACEBOOK-USERNAME" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvplKI4nJke1KBy_uEfgQ1cMuWOT97SnzptOlvLdXavE1n5AwnyFfiLcqBzzw3HgT74P4x58jJUhJrbjq96DPIj-Rz8T3O9bcPbBOi414xTKBrmvA90j6NXnDqXCnDXZtxX5PQCFu3V40X/s1600/facebook.png) center top no-repeat"></a>
<a title="Stumbleupon" href="http://www.stumbleupon.com/stumbler/STUMBLEUPON-USERNAME" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEht26X3xufhQwkcTQpnyGrC3illO2Id_ZXlWWmVMzMIaBqxqAYtH7_yz_DuJcxMKCtAuPPOOTFZr25bHm14EYpz45MPF7nhA8OflP4p8rPClQHffeLpG7WV6rd9S26HtFspdMxVlpup2XAV/s1600/stumbleupon.png) center top no-repeat"></a>
<a title="RSS Feed" href="http://feeds.feedburner.com/FEEDBURNER-ID" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFRYtJZeFcYhrS0N3B977nyBBL1Xhu1Xn7KsvZTzJfJ-Wsr09eTnF_0evuOo_fLuoGmmA9ypPz91eBxm_8I-2j43M-KVZmXQ7NOEClKexTJr7SjzEPk1FYp178lgs9sHhTAx_ISwDrft2Q/s1600/rss.png) center top no-repeat"></a>
</div></p>

</form>



NB : Text MERAH : Isikan sesuai Identitas Kalian , Text BIRU : Edit Sesuka Kalian

4. Setelah itu Pratinjau atau Lihat blog kalian . Finish !

Blog kalian telah terdapat Subcribe yang biasanya digunakan untuk mempermudah pengunjung berlanggan . Sekian dari saya ..








Labels: ,

0 Comments:

Post a Comment

Subscribe to Post Comments [Atom]

<< Home