Advertise Here
Diberdayakan oleh Blogger.
Tampilkan postingan dengan label blog. Tampilkan semua postingan
Tampilkan postingan dengan label blog. Tampilkan semua postingan

Selasa, 20 Januari 2015

Widget Headline News untuk blog

Widget Headline News untuk blog






Malam semuanya,kali ini saya akan membagikan widget keren yang sangat cocok untuk sobat yaitu widget headline news.Apa itu widget headline news?widget headline news adalah widget yang menampilkan postingan pada blog sobat yang terbaru alias baru dibuat.




Jika sobat tertarik silahkan ikuti cara-cara dibawah :





  1. Masuk ke blogger
  2. Lalu pilih Tata letak-tambah gadget-HTML/JavaScript



Widget Headline News untuk blog






     3.Jika sudah copy kode berikut








     4.Terakhir simpan template





Mudah sekali bukan?namun perlu diingat,jangan terlalu banyak memasang gadget pada blog karena dapat memperlambat loading blog.

Happy blogging!!

Minggu, 18 Januari 2015

Melindungi blog dari Ctrl+U

Melindungi blog dari Ctrl+U





Halo sahabat blogger,bagaimana kabarnya?pasti apek-apek wae to?hahaha.Kali ini saya akan memposting bagaimana cara melindungi blog dari "Plagiat" alias tukang clone/peniru template orang lain yaang biasanya dilakukan dengan Ctrl+U untuk melihat source kode pada template.Saya mendapat script ini dari kang ismet

Jika sobat telah lama membuat template sendiri dengan susah payah kemudian dijiplak orang lain,gimana perasaan sobat coba?jika sobat ingin agar template sobat tidak dilihat orang lain ikuti langkah berikut :



  1. Masuk ke blogger
  2. Pilih template-Edit HTML lalu cari kode </body>
  3. Kemudian sobat copy kode berikut diatas kode </body>









NB : Ganti alamat http://heroesman.blogspot.com/p/blog-page_18.html dengan alamat blog sobat yang nantinya sebagai halaman untuk redirect Ctrl+U




     4.Simpan template






Nah,sekarang template sobat telah diamankan dari para Jiplaker,namun perlu diperhatikan ini hanya cara untuk meminimalisir Jiplaker dan bukannya menghentikan aksi para Jiplaker lho..
Sobat juga dapat melihat hasilnya dengan menekan kombinasi Ctrl+U pada blog saya ini

Jumat, 16 Januari 2015

Cara membuat halaman Full Screen pada blog






Selamat malam semua,setelah lama tidak meng-update blog tercinta akhirnya saya punya kesempatan juga.kali ini saya akan memberikan cara membuat halaman Full pada blog.Sobat mungkin pernah berpikir bagaimana cara membuat halaman pada blog Full Screen untuk membuat postingan khusus seperti "Photoshop Online" atau yang lain.


Langkah yang dilakukan cukup menambahkan sedikit kode HTML pada blog,silahkan disimak :




  1. Masuk ke blogger
  2. Kemudian masuk ke Template-Edit HTML
  3. Jika sudah,cari kode </head> gunakan Ctrl+F
  4. Copy kode berikut diatas kode </head>







NB:
  • Ganti alamat http://heroesman.blogspot.com/p/photoshop-online.html dengan alamat yang ingin sobat buat Full Screen
  • Ganti angka 870 dengan ukuran yang pas dengan blog sobat





     5.Terakhir simpan template






Sekarang sobat coba dulu halaman Full Screen nya pada blog sobat,jika sobat menemui kendala jangan ragu-ragu untuk berkomentar dibawah...
Berhubung jam sudah menunjukan pukul 9 malam waktunya saya untuk tidur dulu

Minggu, 11 Januari 2015

Cara update JQuery pada blog

update JQuery






Bagi para programmer pasti sudah tidak asing lagi dengan JQuery,namun jika sobat belum tahu apa itu JQuery maka saya akan menjelaskannya. JQuery adalah kumpulan JavaScript kecil bersumber terbuka yang menekankan pada interaksi antara JavaScript dan HTML. Pustaka ini dirilis pada Januari 2006 di BarCamp NYC oleh John Resig dan berlisensi ganda di bawah MITdan GPL.


Kita harus selalu meng-update JQuery pada blog kita untuk selalu menutup celah/bug yang terdapat pada JQuery versi sebelumnya.



Ikuti langkah-langkah berikut :



  1. Login ke blogger
  2. Pilih template-Edit HTML lalu cari kode https://ajax.googleapis.com/ajax/libs/jquery/ (Gunakan Ctrl+F untuk mempermudah)
  3. Jika sudah ganti versi JQuery dengan versi yang terbaru.Saat ini JQuery sudah dalam versi 2.1.1


update JQuery





     4.Terakhir simpan




Penting sebelum melakukan pengeditan tersebut alangkah baiknya jika sobat melakukan back-up template dulu jika terjadi sesuatu yang tidak diinginkan

Cara menghilangkan tombol Tang & Obeng di blog

Cara menghilangkan tombol Tang & Obeng di blog






Pasti kalian bertanya-tanya bagaimana sih cara menghilangkan tombol dengan gambar obeng dan tang pada blog?kalian peru tahu terlebih dulu jika nama tombol tersebut adalah "Quick Edit" yang sengaja disediakan pihak blogger untuk mempermudah kita dalam mengatur widget tertentu dalam sebuah blog.


Jika sobat tidak suka tombol ini,maka sobat bisa menyembunyikan dengan sedikit CSS saja,ikuti langkah berikut :



  1. Masuk ke blogger
  2. Lalu pilih Template-Edit HTML lalu cari kode ]]></b:skin>
  3. Jika sudah maka sobat pastekan kode berikut diatas ]]></b:skin>









     4.Terakhir simpan







Sangat mudah bukan?kita hanya meletakkan secuil kode CSS maka Quick Edit sudah hilang.Namun jika sobat menghadapi kendala dapat berkomentar dibawah ya..

Kamis, 08 Januari 2015

Mempercepat loading website dengan HTML Optimizer

HTML Optimizer






Setelah lama tidak melakukan aktivitas blogging akhirnya saya ada waktu luang untuk memberikan pengetahuan saya tentang bagaimana cara Mempercepat loading website dengan HTML Optimizer.
Jika sobat merasa kalau blognya loadingnya lama maka baca langkahnya berikut ini :




  1. Sebelumnya sobat cek kecepatan blog sobat diSINI
  2. Jika sudah buka dasbor-template-edit HTML
  3. Cari kode </head> dan </body> kemudian copy semua kode HTML blog sobat diantara </head> dan </body>
  4. Pastekan semua kode  yang telah sobat copy tadi dibawah ini






Insert HTML Code to Optimize
Powered by: WebToolHub.com




     5.Ganti kode antara </head> dan </body> yang ada di template blog sobat tadi dengan kode yang telah di Optimize
     6.Terakhir coba cek lagi loading blog sobat diSINI





WARNING!!!

Selalu lakukan Back-Up template sebelum melakukan Optimize HTML karena mungkin bisa jadi sebagian template blog akan menjadi "Error"







Bagaimana sobat,sudah bertambah cepat belum?namun perlu diingat faktor yang menyebabkan blog lambat mungkin karena sobat terlalu banyak memasang gadget sehingga membuat beban pada blog sobat

Sabtu, 03 Januari 2015

Cara Membuat Halaman Error 404 di Blog ala Kang Rian

Halaman Error 404






Siapa yang tidak tahu apa itu 404 not found?404 not found adalah suatu peristiwa dimana kata kunci yang kita cari tidak kita temukan.Tutorial yang satu ini saya dapatkan dari blognya kang Rian yang dapat diakses lewat SINI.
Jika ingin melihat demonya bisa klik diSINI


Oke tanpa basa-basi kita langsung mulai...



  1. Pertama login dulu ke blogger
  2. Buka template-Edit HTML lau copykan kode berikut dibawah kode <body>


<b:if cond='data:blog.pageType != &quot;error_page&quot;'>




     3.Lalu copy kode berikut diatas kode </body>









     4.Terakhir simpan template








Selain menambah blog sobat keren dengan efek 3D juga support CSS3 dan Responsive pastinya .Jika menemui kendala dapat langsung berkomentar...

Jumat, 02 Januari 2015

Cara membuat tombol Subscription keren pada blog

Cara membuat tombol Subscription keren pada blog







Gadget satu ini merupakan salah satu gadget terpenting yang harus dipasang di blog sobat.Gadget ini berfungsi untuk pembaca yang ingin dikirimkan artikel pada blog sobat ke alamat E-mail pembaca.Namun bagaimana bisa dipasang jika ruang blog sobat sudah penuh?tenang,yang saya akan bahas kali ini bersifat auto-hide jadi dapat menghemat ruang blog sobat.


Oke kita langsung mulai tutorialnya :




  1. Pertama masuk ke blogger
  2. Lalu buka Tata letak-tambah gadget-HTML/JavaScript



Cara membuat tombol Subscription keren pada blog





     3.lalu copy kode berikut pada kotak dialog







NB : ganti kata Heroesman dengan ID RSS feed sobat masing-masing






     4.Lalu simpan pada blog sobat






Bagaimana sobat,sangat mudah kan?namun jika sobat menemukan kendala bisa komentar pada kolom dibawah

Selasa, 30 Desember 2014

Cara Membuat Widget Contact Form Keren

Cara Membuat Widget Contact Form Keren








Widget yang satu ini dapat sobat letakkan pada halaman "Contact Us" pada blog.Widget satu ini sangat berguna untuk sarana interaksi antara penulis dan pembaca selain melalui kolom komentar.Widget buatan www.bloggertut.com menggunakan CSS yang pastinya keren.


Baiklah langkah ada dibawah :



  1. Tambahkan Widget Formulir Kontak bawaan blogger yang nantinya akan disembunyikan dengan CSS

Cara Membuat Widget Contact Form Keren






     2.Setelah itu buatlah halaman baru yang nantinya akan dijadikan halaman Contact Us                     kemudian pilih mode HTML bukan compose lalu copy kode berikut :



<div id="contact_wrap"> <h3> Hubungi Kami</h3> <form name="contact-form"> <input id="ContactForm1_contact-form-name" name="name" placeholder="Nama" size="30" type="text" value="" /> <input id="ContactForm1_contact-form-email" name="email" placeholder="Email" size="30" type="text" value="" /> <textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" placeholder="Pesan" rows="5"></textarea> <input id="ContactForm1_contact-form-submit" type="button" value="Kirim" /> <div style="max-width: 222px; text-align: center; width: 100%;"> <div id="ContactForm1_contact-form-error-message"> </div> <div id="ContactForm1_contact-form-success-message"> </div> </div> </form> </div> <style type="text/css"> /* Menyembunyikan elemen dalam postingan */ #comments, #blog-pager, .breadcrumbs, .post-footer{display:none} </style>







     3.Lalu tambahkan kode CSS berikut diatas kode ]]></b:skin> atau bisa di Template-                     Sesuaikan-Tingkat lanjut-Tambahkan CSS



Light Mode (untuk blog dengan template cerah)







Dark Mode (untuk blog dengan template gelap)









     4.Kemudian simpan



Sekarang sobat test kontak form-nya.Jika belum berhasil bisa komentar dibawah

Minggu, 28 Desember 2014

Cara membuat tombol "Back to Top" pada blog

Cara membuat tombol "Back to Top" pada blog






Siapa yang enggak kenal gadget satu ini?gadget satu ini sudah biasa kita temui ketika kita sedang browsing sesuatu.Sebagai seorang blogger gadget Back to top ini merupakan salah satu gadget penting untuk memudahkan pengunjung untuk kembali ke atas halaman blog kita


Jika sobat seorang blogger dan belum memiliki gadget ini,pasang sekarang juga agar pengunjung blog sobat merasa betah dan ingin terus kembali ke blog sobat..



Caranya kita baca sama-sama yuk





  1. Masuk dulu ke blogger
  2. lalu pilih tata letak - tambah gadget - HTML/JavaScript



Cara membuat tombol "Back to Top" pada blog




     3.Lalu copy kode berikut







NB : ganti kata URL Gambar Back To Top dengan URL gambar sobat






     4.Terakhir,simpan di blog sobat






Bagaimana?Tombol Back to Top satu ini beda dengan biasanya karena ini menggunakan JQuery smooth jadi efek yang ditimbulkan adalah pelan dan anggun hehehe 

Jumat, 26 Desember 2014

Cara membuat like Facebook Autohide pada blog

like Facebook Autohide







Siang semua!kali ini saya akan posting tentang cara membuat like Facebook Autohide pada blog yang pastinya sangatlah mudah.Langkah ini sangat efektif dalam rangka untuk mempromosikan fans page dari blog kita.Hal baiknya gadget ini tidak menimbulkan efek berat pada blog,sehingga sobat bisa tenang tanpa memikirkan efek loading blog yang ditimbulkan setelah memasang gadget ini.



Oke kita langsung mulai saja tutorialnya :




  1. pertama masuk dulu ke blogger
  2. Jika agan belum memasang JQuery pada blog,pasang dulu JQuery diatas kode <head> pada edit HTML








     3.jika sudah pilih tata letak-tambah gadget-HTML/JavaScript




like Facebook Autohide





     4.lalu copy kode berikut di dalam kotak dialog HTML/JavaScript









NB : Ganti kata www.facebook.com%2Fsyafiqnewbie dengan alamat Fans Page anda sendiri






Sekian postingan dari saya,namun jika sobat merasa kesulitan saya akan memberikan Alamat untuk meregenerator gadget satu ini diSINI yang dijamin sangat gampang untuk diterapkan dan jangan lupa untuk like fans page saya diSINI ya..

Sabtu, 20 Desember 2014

cara mengganti tombol scrollbar pada blog

cara mengganti tombol scrollbar pada blog






Lama tidak berjumpa,maaf bila saya jarang update belakangan ini soalnya komputer saya lagi diperbaiki.tutorial kali ini sebetulnya sudah ingin saya posting dari kemarin yaitu cara mengganti tombol scrollbar pada blog yang pastinya akan membuat blog anda jadi dinamis.ingat,script ini hanya akan bekerja pada browser berbasis web-kit seperti google chrome jadi firefox tidak bisa menjalankan scriptnya




Tutorialnya ada dibawah,silahkan menyimak :



  1. masuk dulu ke blogger
  2. klik template kemudian edit HTML



cara mengganti tombol scrollbar pada blog




     3.kemudian cari kode ]]></b:skin> menggunakan Ctrl+F kemudian copy kode berikut








NB : scrollbar punya saya ini berwarna hijau-hitam,jika ingin mengganti warna silahkan ganti kode hex warna sesuai selera agan.Untuk melihat kode warna klik diSINI




     4.terakhir simpan template





Nah,sekarang agan memiliki blog yang berbeda dari yang lain dan lebih keren pastinya,namun perlu diingat bahwa ini akan bekerja hanya pada browser berbasis webkit saja.
happy blogging!

Minggu, 14 Desember 2014

Cara memasang komentar Facebook pada blog

komentar Facebook







Komentar merupakan hal yang umum terdapat pada blog,komentar juga merupakan media bagi para blogger kepada para pembaca untuk saling berinteraksi.Apalagi kalau komentarnya bisa terhubung dengan facebook,kita semua tahu kan kalau facebook merupakan media sosial yang paling umum dimiliki oleh kalangan masyarakat.hal ini tentu saja mempermudah pembaca untuk mengomentari postingan pada blog anda.



Tampilan komentar facebook pada blog :




komentar Facebook





Dibawah ini uraian mengenai cara memasang komentar facebook pada blog :




  1. masuk ke blog kemudian klik Template-Edit HTML



komentar Facebook




     2.kemudian cari kode <div class='comments' id='comments'> gunakan kombinasi Ctrl+F
     3.setelah itu copy kode berikut dibawah kode <div class='comments' id='comments'>










NB : ganti tulisan ID FACEBOOK KAMU dengan ID facebook masing-masing



     4.terakhir jangan lupa untuk disimpan






Sekarang silahkan dicek pada blog masin-masing,bagaimana mudah bukan?jika sobat sekalian merasa kebingungan bisa komentar dibawah dan terus kunjungi heroesman blog.jika bermanfaat mohon untuk dishare ya..

Rabu, 10 Desember 2014

cara melakukan Ekspor Impor blog dengan mudah

Ekspor Impor blog








Ekspor dan Impor blog merupakan kegiatan membackup dan mengembalikan pos atau artikel pada blog seperti semula.hal ini sangat penting dilakukan jika suatu saat agan tidak punya akses lagi ke blog atau secara tidak sengaja agan menghapus isi pos atau artikel pada blog agan.




Caranya pun sangat mudah,silahkan menyimak :




  1. pertama sekali buka dulu blogger
  2. lalu pilih setelan-lainnya



Ekspor Impor blog





     3.lalu klik ekspor jika agan ingin membackup isi artikel blog,file akan didownload dalam                   bentuk .xml (file mungkin hanya berukuran sekitar 840 KB)




Ekspor Impor blog





     4.jika ingin mengembalikan artikel yang sudah didownload,klik Impor blog




Ekspor Impor blog








Sangat mudah bukan?sekarang agan bisa agak tenang jika artikel blog secara tidak sengaja terhapus dan cara ini dapat diterapkan antar CMS yang berbeda seperti blogger dengan wordpress dan sebagainya.jika masih bingung silahkan komentar dibawah dan jangan lupa untuk membaca postingan menarik lainnya

Minggu, 07 Desember 2014

cara mengubah tombol next page menjadi nomer pada blog

cara mengubah tombol next page menjadi nomer pada blog







Sore gan!waktu luang kaya gini enaknya buka blog.apalagi ane punya script keren kali ini yaitu cara mengubah tombol next page menjadi tombol yang pastinya mempermudah pengunjung untuk berpindah dari page satu ke page lainnya.


Screenshot pada blog ane :


tombol next page


Oke,kita langsung ke tutorialnya :



  1. buka blogger
  2. pilih template lalu klik edit HTML


cara mengubah tombol next page menjadi nomer pada blog



     3.cari kode ]]></b:skin> pakai Ctrl+F kemudian copykan kode berikut diatasnya









     4.setelah itu cari </body> kemudian copykan kode berikut diatasnya








     5.sebelum disimpan,lakukan preview atau pratinjau terlebih dahulu kalo ada kesalahan






Sudah deh gan,sekarang blog agan jadi terlihat semakin keren dan dinamis.pengunjung pun menjadi nyaman berkunjung ke blog agan..