Cara Memasang Widget Langganan Tulisan RSS Feed pada Blog

Cara Memasang Widget Langganan Tulisan RSS Feed pada Blog

 
Untuk bisa memasang widet langganan tulisan RSS Feed ini blog anda harus didaftarkan dulu ke situs feedburner.com. Caranya bisa anda pelajari. 

Setelah itu baru bisa anda lakukan beberapa langkah berikut:

Pertama loginlah ke halaman dasbor feedburner anda. 
Lalu kliklah nama blog anda, sehingga muncul tampilan seperti gambar dibawah ini:

Kliklah menu Publicize.

Kemudian klik menu Email Subscriptions.

Kliklah tombol Active.

Pastikan jenis platform blog anda sudah disesuaikan, dengan cara mengklik tanda segituga kecil pada pilihan yang sudah tersedia. Pada contoh ini saya menggunakan blogger (lihat no.1). Selanjutnya ada 2 cara yang bisa anda lakukan. Pertama anda bisa mencopy kode yang sudah tersedia (lihat no.2) kemudian mempastekannya pada widget HTML di halaman Rancangan dasbor blog anda. Dan cara kedua yaitu dengan mengklik tombol GO (lihat no.3), seperti yang saya lakukan pada contoh ini.

Maka anda akan dibawa langsung ke tampilan seperti diatas.
No.1 adalah nama blog anda sedang pada no.2 adalah nama judul dari widget langganan RSS feed blog anda. Dan nama itu bisa anda ganti sesuai keinginan anda. Kemudian jangan lupa klik tombol MENAMBAH WIDGET. 

Secara otomatis kemudian anda akan langsung dibawa ke halaman Rancangan dasbor blog anda. Dan tampak widget langganan RSS feed blog sudah terpasang. Sekarang anda sudah bisa melihat tampilannya dengan mengklik menu Lihat Blog. 

Sebagai contoh hasilanya akan tampak seperti ini:

Nah, sampai disini maka widget langganan RSS feed blog sudah terpasang. Selanjutnya anda tinggal mengunggu para pengunjung yang tertarik untuk berlangganan setiap konten terbaru blog anda. Kemudian untuk mengetahui perkembangan berapa jumlah pelanggan tulisan blog anda dari waktu ke waktu secara otomatis, maka anda bisa pelajari caranya. 

Lebih Banyak

Cara Memasang Tombol Kembali Ke Atas Dan Kembali Turun Pada Blog

Cara Memasang Tombol Kembali Ke Atas Dan Kembali Turun Pada Blog

Kali ini saya sedikit share Cara Memasang Tombol Kembali Ke Atas Dan Kembali Turun Pada Blog  yang lengkap dengan tombol kembali ke beranda / home dan muat ulang / reload yang saya dapat dari salah satu blog / website dengan alamat urlwww.ozanhacker.com.

Tips dan trick ini sudah saya peragakan disalah satu blog saya. singkat cerita mari kita simak saja Cara Memasang Tombol Kembali Ke Atas Dan Kembali Turun Pada Blog berikut ini.

Cara Memasang Tombol Back to Top

Memasang tombol kembali ke atas atau memasang tombol back to top ini mungkin bagi blog saya ini sangat diperlukan, karena untuk menyikapi blog yang terlalu memanjang kebawah, mungkin masalah ini tidak akan ditemui jika kita memasang template yang sudah menyertakan widget ini, tetapi jika belum ada kita bisa memasangnya sendiri, karena jika tidak ada tombol back to top akan membosankan pembaca blog kita, apalagi jika menggunakan mouse yang kebetulan keadaannya sudah letoy (hehe…) atau lebih parahnya lagi sudah tidak ada scroll nya lagi, itu akan membuat mereka capek untuk mengakses blog kita, maka alternatifnya adalah membuat tombol back to top atau tombol kembali ke atas.

Ada dua cara pembuatan tombol back to top ini, berikut penjelasannya:
(Sebelum memasuki penjelasan, download terlebih dahulu template anda, sebagai asuransi tamplate anda...hehe...)

Cara Pertama:
Untuk cara pertama ini sangat simple, karena tampilannya sederhana, anda hanya perlu menambahkan kode berikut sebelum kode </body>


<!-- Bact to top By Ozan Hacker -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='http://3.bp.blogspot.com/-tIcrAJXd0SQ/TbbzlODegZI/AAAAAAAAAeo/JFTR2FkHHTw/s1600/Untitled-2.png'/></a>



Untuk penjelasannya, anda login dulu ke blogger anda lalu Ikuti tahap-tahap berikut ini:

1.      Pilih Rancangan
2.      EDIT HTML ( Centang Expand Template Widget )
3.      Cari Kode </body> ( Untuk lebih cepat mencari gunakan Ctrl+F )
4.      Simpan kode berikut sebelum atau di atas kode </body>


<!-- Bact to top By Ozan Hacker -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='http://3.bp.blogspot.com/-tIcrAJXd0SQ/TbbzlODegZI/AAAAAAAAAeo/JFTR2FkHHTw/s1600/Untitled-2.png'/></a> 



5.      Lalu simpan tamplate, SELESAI dan lihat hasilnya…

Keterangan:

• Kode warna kuning adalah posisi tombol berada
• Kode warna merah adalah URL gambar tombol (silahkan anda ganti dengan URL gambar anda bila ingin menyesuaikan  gambarnya dengan selera anda)

Cara Kedua:
Tombol back to top pada cara pertama hanya tombol back to top biasa, jika anda ingin yang lebih komplit, anda bisa memekai cara kedua ini:

Tahap-tahapnya sama dengan yang diatas, cuma sekarang anda harus menambahkan kode CSS sebelum kode ]]></b:skin>, berikut penjelasannya:

1.      Cari kode ]]></b:skin> lalu sisipkan CSS berikut sebelum atau diatasnya.

    #Enjoy{display:scroll;position:fixed;bottom:1px;right:1px;z-index:99}
    #Enjoy a{filter:alpha(opacity=65);-moz-opacity:0.65;opacity:0.65;border:0}
    #Enjoy img{border:0}
    #Enjoy a:hover{filter:alpha(opacity=100);-moz-opacity:1;opacity:1}

2.      Kemudian sisipkan kode berikut ini setelah atau dibawah kode <body>

    <div id='Enjoy'>
    <a href='#' onClick='window.location.reload()' title='Reload page'>
    <img src='http://i580.photobucket.com/albums/ss248/z33s/refresh.png'/></a>
    <a expr:href='data:blog.homepageUrl'><img src='http://i580.photobucket.com/albums/ss248/z33s/house.png'/></a>
    <a href='#' title='Ke Atas Halaman'><img src='http://i580.photobucket.com/albums/ss248/z33s/topopg.png'/></a>
    <a href='#footbar' title='Ke bawah halaman'>
    <img src='http://i580.photobucket.com/albums/ss248/z33s/down.png'/></a>
    </div>

3.      Lalu simpan tamplate anda, dan lihat hasilnya…

Keterangan:
=> Warna merah adalah gambar untuk tombol-tombolnya
=> Warna kuning adalah posisi tombol

apabila tombol down / ke bawah tidak berfungsi silakan ganti kode yang berwana hijau seperti ketyerangan di bawah:

=> Untuk kode #footbar anda ganti dengan #footer atau #copyright sesuaikan dengan HTML template anda.

Sedikit tambahan lagi untu menentukan tempat tombol berada di sebelah kanan atau kiri blog silakan ganti kode yang berwarna orange left (untuk sebelah kiri) right (untuk sebelah kanan blog anda).

Jangan lupa komentarnya… Untuk artikel ini jika ada yang mau menambahkan cara yang lainnya aku tunggu…

Lebih Banyak

Cara Memasang Tombol Kembali Ke Atas Dan Kembali Turun Pada Blog

Cara Memasang Tombol Kembali Ke Atas Dan Kembali Turun Pada Blog

Kali ini saya sedikit share Cara Memasang Tombol Kembali Ke Atas Dan Kembali Turun Pada Blog  yang lengkap dengan tombol kembali ke beranda / home dan muat ulang / reload yang saya dapat dari salah satu blog / website dengan alamat urlwww.ozanhacker.com.

Tips dan trick ini sudah saya peragakan disalah satu blog saya. singkat cerita mari kita simak saja Cara Memasang Tombol Kembali Ke Atas Dan Kembali Turun Pada Blog berikut ini.

Cara Memasang Tombol Back to Top

Memasang tombol kembali ke atas atau memasang tombol back to top ini mungkin bagi blog saya ini sangat diperlukan, karena untuk menyikapi blog yang terlalu memanjang kebawah, mungkin masalah ini tidak akan ditemui jika kita memasang template yang sudah menyertakan widget ini, tetapi jika belum ada kita bisa memasangnya sendiri, karena jika tidak ada tombol back to top akan membosankan pembaca blog kita, apalagi jika menggunakan mouse yang kebetulan keadaannya sudah letoy (hehe…) atau lebih parahnya lagi sudah tidak ada scroll nya lagi, itu akan membuat mereka capek untuk mengakses blog kita, maka alternatifnya adalah membuat tombol back to top atau tombol kembali ke atas.

Ada dua cara pembuatan tombol back to top ini, berikut penjelasannya:
(Sebelum memasuki penjelasan, download terlebih dahulu template anda, sebagai asuransi tamplate anda...hehe...)

Cara Pertama:
Untuk cara pertama ini sangat simple, karena tampilannya sederhana, anda hanya perlu menambahkan kode berikut sebelum kode </body>


<!-- Bact to top By Ozan Hacker -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='http://3.bp.blogspot.com/-tIcrAJXd0SQ/TbbzlODegZI/AAAAAAAAAeo/JFTR2FkHHTw/s1600/Untitled-2.png'/></a>



Untuk penjelasannya, anda login dulu ke blogger anda lalu Ikuti tahap-tahap berikut ini:

1.      Pilih Rancangan
2.      EDIT HTML ( Centang Expand Template Widget )
3.      Cari Kode </body> ( Untuk lebih cepat mencari gunakan Ctrl+F )
4.      Simpan kode berikut sebelum atau di atas kode </body>


<!-- Bact to top By Ozan Hacker -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='http://3.bp.blogspot.com/-tIcrAJXd0SQ/TbbzlODegZI/AAAAAAAAAeo/JFTR2FkHHTw/s1600/Untitled-2.png'/></a> 



5.      Lalu simpan tamplate, SELESAI dan lihat hasilnya…

Keterangan:

• Kode warna kuning adalah posisi tombol berada
• Kode warna merah adalah URL gambar tombol (silahkan anda ganti dengan URL gambar anda bila ingin menyesuaikan  gambarnya dengan selera anda)

Cara Kedua:
Tombol back to top pada cara pertama hanya tombol back to top biasa, jika anda ingin yang lebih komplit, anda bisa memekai cara kedua ini:

Tahap-tahapnya sama dengan yang diatas, cuma sekarang anda harus menambahkan kode CSS sebelum kode ]]></b:skin>, berikut penjelasannya:

1.      Cari kode ]]></b:skin> lalu sisipkan CSS berikut sebelum atau diatasnya.

    #Enjoy{display:scroll;position:fixed;bottom:1px;right:1px;z-index:99}
    #Enjoy a{filter:alpha(opacity=65);-moz-opacity:0.65;opacity:0.65;border:0}
    #Enjoy img{border:0}
    #Enjoy a:hover{filter:alpha(opacity=100);-moz-opacity:1;opacity:1}

2.      Kemudian sisipkan kode berikut ini setelah atau dibawah kode <body>

    <div id='Enjoy'>
    <a href='#' onClick='window.location.reload()' title='Reload page'>
    <img src='http://i580.photobucket.com/albums/ss248/z33s/refresh.png'/></a>
    <a expr:href='data:blog.homepageUrl'><img src='http://i580.photobucket.com/albums/ss248/z33s/house.png'/></a>
    <a href='#' title='Ke Atas Halaman'><img src='http://i580.photobucket.com/albums/ss248/z33s/topopg.png'/></a>
    <a href='#footbar' title='Ke bawah halaman'>
    <img src='http://i580.photobucket.com/albums/ss248/z33s/down.png'/></a>
    </div>

3.      Lalu simpan tamplate anda, dan lihat hasilnya…

Keterangan:
=> Warna merah adalah gambar untuk tombol-tombolnya
=> Warna kuning adalah posisi tombol

apabila tombol down / ke bawah tidak berfungsi silakan ganti kode yang berwana hijau seperti ketyerangan di bawah:

=> Untuk kode #footbar anda ganti dengan #footer atau #copyright sesuaikan dengan HTML template anda.

Sedikit tambahan lagi untu menentukan tempat tombol berada di sebelah kanan atau kiri blog silakan ganti kode yang berwarna orange left (untuk sebelah kiri) right (untuk sebelah kanan blog anda).

Jangan lupa komentarnya… Untuk artikel ini jika ada yang mau menambahkan cara yang lainnya aku tunggu…

Lebih Banyak

Cara Lengkap Membuat Efek Lipatan Kertas Di Ujung Blog

Cara Lengkap Membuat Efek Lipatan Kertas Di Ujung Blog

Berbagi pengalaman pribadi membuat efek lipatan kertas pada ujung kanan blog yang menurut saya agak lumayan bikin pusing sob, maklumlah masih pemula,, heheheheee,,,,

Setelah berkali-kali mencoba merubah kode java scriptnya, akhirnya selesai juga, dan lihat hasilnya di ujung kanan blog KTB, [sedikit pamer, heheheheee,, ]

bagi sobat yang berminat untuk membuat lipatan kerta pada ujung blog seperti blog KTB [tenag aja yang saya bagi tidak ada foto jelek saya kok,, heheheheee,,, ] silakan ikuti lankah-langkah berikut ini ya sobat:

1. Silahkan Login ke akun blogger anda.

2. Lalu masuk ke design Template, klik Edit HTML

3. Seperti Biasa Centang Expand Template Widget

4. Kemudian cari kode berikut </body>

5. Setelah ketemu silakan Sobat copy dan letakkan kode di bawah ini tepat di atas kode  </body>

<script type='text/javascript'>var tujuan =&#39;http://Alamat Url Feeds Sobat&#39;</script>

<script src='http://petir-project.googlecode.com/files/ktb4.js' type='text/javascript'/>

6. Coba sobat pertinjau terlebih dahulu (Sekiranya sudah yakin baru di save ya sob)

Keterangan:

Kode warna hijau: ganti dengan URL Feeds sobat

Kode warna putih: ganti apabila sobat ingin mengganti gambar sesuai selera sobat.

Ikuti langkah-langkah berikut ini bila sobat ingin mengganti gambarnya.

Bagi sobat yang ingin mengganti gambarnya silakan download dulu scriptnya disini.

1. Setelah sobat selesai download silakan sobat buka script tersebut dengan Notepad.

2. Untuk merubah gambar yang berukuran kecil (gambar saat lipatan tertutup) sobat cari url berikut dalam text dan silakan ubah dengan url gambar sobat:

http://petir-project.googlecode.com/files/fedkcl.png

(Upload gambar di code.google.com atau situs upload lainya untuk mendapatkan URL gambar)

3. Untuk merubah gambar yang berukuran besar (gambar saat lipatan terbuka) sobat ubah url berikut dengan url gambar sobat:

http://petir-project.googlecode.com/files/feed.png

4. Setelah selesai merubah kode URL gambar tersebut Sobat Save Text, selanjutnya silakan sobat upload text tersebut dan ganti URL http://petir-project.googlecode.com/files/ktb4.js dengan URL hasil upload sobat tadi.

NB: sedikit saran apabila sobat ingin merubah gambar, sebaiknya ukuran gambar harus sesuai dengan gambar semula untuk hasil yang lebih baik.

Selamat mencoba ya sobat,,

Lebih Banyak

Cara Lengkap Membuat Efek Lipatan Kertas Di Ujung Blog

Cara Lengkap Membuat Efek Lipatan Kertas Di Ujung Blog

Berbagi pengalaman pribadi membuat efek lipatan kertas pada ujung kanan blog yang menurut saya agak lumayan bikin pusing sob, maklumlah masih pemula,, heheheheee,,,,

Setelah berkali-kali mencoba merubah kode java scriptnya, akhirnya selesai juga, dan lihat hasilnya di ujung kanan blog KTB, [sedikit pamer, heheheheee,, ]

bagi sobat yang berminat untuk membuat lipatan kerta pada ujung blog seperti blog KTB [tenag aja yang saya bagi tidak ada foto jelek saya kok,, heheheheee,,, ] silakan ikuti lankah-langkah berikut ini ya sobat:

1. Silahkan Login ke akun blogger anda.

2. Lalu masuk ke design Template, klik Edit HTML

3. Seperti Biasa Centang Expand Template Widget

4. Kemudian cari kode berikut </body>

5. Setelah ketemu silakan Sobat copy dan letakkan kode di bawah ini tepat di atas kode  </body>

<script type='text/javascript'>var tujuan =&#39;http://Alamat Url Feeds Sobat&#39;</script>

<script src='http://petir-project.googlecode.com/files/ktb4.js' type='text/javascript'/>

6. Coba sobat pertinjau terlebih dahulu (Sekiranya sudah yakin baru di save ya sob)

Keterangan:

Kode warna hijau: ganti dengan URL Feeds sobat

Kode warna putih: ganti apabila sobat ingin mengganti gambar sesuai selera sobat.

Ikuti langkah-langkah berikut ini bila sobat ingin mengganti gambarnya.

Bagi sobat yang ingin mengganti gambarnya silakan download dulu scriptnya disini.

1. Setelah sobat selesai download silakan sobat buka script tersebut dengan Notepad.

2. Untuk merubah gambar yang berukuran kecil (gambar saat lipatan tertutup) sobat cari url berikut dalam text dan silakan ubah dengan url gambar sobat:

http://petir-project.googlecode.com/files/fedkcl.png

(Upload gambar di code.google.com atau situs upload lainya untuk mendapatkan URL gambar)

3. Untuk merubah gambar yang berukuran besar (gambar saat lipatan terbuka) sobat ubah url berikut dengan url gambar sobat:

http://petir-project.googlecode.com/files/feed.png

4. Setelah selesai merubah kode URL gambar tersebut Sobat Save Text, selanjutnya silakan sobat upload text tersebut dan ganti URL http://petir-project.googlecode.com/files/ktb4.js dengan URL hasil upload sobat tadi.

NB: sedikit saran apabila sobat ingin merubah gambar, sebaiknya ukuran gambar harus sesuai dengan gambar semula untuk hasil yang lebih baik.

Selamat mencoba ya sobat,,

Lebih Banyak

Cara Membuat widget SMS di bloger dan wordpress

Cara Membuat widget SMS di bloger dan wordpress

Berikut ini langkah-langkah memasang widget sms gratis pada Blogger dan WordPress:

Widget SMS Gratis untuk Blogger
1. Pertama login ke akun blogger Anda
2. Klik menu rancangan
3. Klik ‘Tambah Gadget’ pilih HTML/Javascript
4. Copylah script / kode berikut 

<iframe name="widgetsms" src="http://www.sms-online.web.id/widget/" width="270"height="350" frameborder="0"></iframe>

5. Jangan lupa Save. Lalu lihat hasilnya.

Widget SMS Gratis untuk WordPress
1. Pada halaman Dashboard, klik submenu ‘Widgets’ pada menu ‘Appearance’
2. Tarik widgets “Text” ke posisi yang diinginkan (biasanya ditarik ke sidebar)
3. Masukkan kode dibawah ini, 

<iframe name="widgetsms" src="http://www.sms-online.web.id/widget/" width="270"height="350" frameborder="0"></iframe>

4. Kemudian tekan tombol ‘Save’

Catatan:
Anda Bisa mengubah ukurannya dengan mengatur width=”270″ height=”350″
width=”lebar” height=”tinggi”

Itulah Cara Memasang Widget SMS Gratis pada Blog. Selamat Blog anda telah terpasang Widget SMS Gratis dan pergunakan fasilitas widget sms gratis ini sebijaksana mungkin.

Lebih Banyak

Cara Membuat widget SMS di bloger dan wordpress

Cara Membuat widget SMS di bloger dan wordpress

Berikut ini langkah-langkah memasang widget sms gratis pada Blogger dan WordPress:

Widget SMS Gratis untuk Blogger
1. Pertama login ke akun blogger Anda
2. Klik menu rancangan
3. Klik ‘Tambah Gadget’ pilih HTML/Javascript
4. Copylah script / kode berikut 

<iframe name="widgetsms" src="http://www.sms-online.web.id/widget/" width="270"height="350" frameborder="0"></iframe>

5. Jangan lupa Save. Lalu lihat hasilnya.

Widget SMS Gratis untuk WordPress
1. Pada halaman Dashboard, klik submenu ‘Widgets’ pada menu ‘Appearance’
2. Tarik widgets “Text” ke posisi yang diinginkan (biasanya ditarik ke sidebar)
3. Masukkan kode dibawah ini, 

<iframe name="widgetsms" src="http://www.sms-online.web.id/widget/" width="270"height="350" frameborder="0"></iframe>

4. Kemudian tekan tombol ‘Save’

Catatan:
Anda Bisa mengubah ukurannya dengan mengatur width=”270″ height=”350″
width=”lebar” height=”tinggi”

Itulah Cara Memasang Widget SMS Gratis pada Blog. Selamat Blog anda telah terpasang Widget SMS Gratis dan pergunakan fasilitas widget sms gratis ini sebijaksana mungkin.

Lebih Banyak