Nulis-Ilmu.com

Tutorial Elektronika dan Komputer

  • Home
  • Elektronika
  • Komputer
  • Javascript

Kriteria Memilih Template Blog

25 April 2015 By Eko Purnomo

Kriteria Memilih Template Blog

Template adalah kerangka tampilan sebuah blog. Template yang baik merupakan faktor utama yang menentukan performa dan kinerja sebuah blog. Saat mmencari template, ada banyak sekali pilihan template yang tersedia sehingga membuat bingung kita untuk memilihnya. Sebenarnya ada beberapa kriteria yang bisa dijadikan panduan dalam memilih sebuah template untuk blog seperti tampilan, fitur, kecepatan, seo, responsive dan mobile friendly.

1. Tampilan

Biasanya ini adalah faktor utama yang menarik kita dalam menentukan akan menggunakan sebuah template atau tidak. Tampilan menarik serta navigasi yang jelas dan mudah akan membuat pengunjung betah berlama-lama pada blog kita. Kemudahan akses terhadap konten membuat pengunjung dapat mengeksplorasi blog kita secara utuh sehingga meningkatkan pageview.

Kita bisa memilih tampilan blog berdasarkan beberapa kriteria seperti berikut ini:

  • Warna background, pilihlah template dengan warna background netral seperti putih dan abu-abu.
  • Font, pilihlah template dengan font yang mudah dibaca dan disupport oleh kebanyakan browser.
  • Navigasi, pilihlah template dengan navigasi jelas dan mudah diakses seperti menu dibawah header atau disamping.
  • Tata letak/Layout, pilihlah template dengan tata letak widget yang menarik dan mengedepankan artikel sebagai area yang dominan. Template dengan dua kolom dengan sidebar di sebelah kanan saya rekomendasikan untuk dipilih.
  • Menarik, pilihlah template yang menarik, minimal menarik untuk kita sendiri. Yang saya maksud kriteria menarik disini adalah penggunaan seni artistik pada template seperti komposisi warna, penggunaan font, gambar latar belakang dan sebagainya. Template yang menarik sedikit banyak akan menyenangkan pengunjung blog.

2. Fitur

Setelah faktor tampilan, selanjutnya kita harus memperhatikan fitur yang disediakan oleh sebuah template. Fitur-fitur ini nantinya yang akan menunjang kinerja blog kita. Pilihlah template dengan banyak fitur namun ringan. Jangan sampai banyak fitur membuat blog kita berat dan berakibat lamanya proses loading blog.

Berikut ini beberapa kriteria fitur template blog yang bisa dijadikan syarat:

  • Artikel Terkait (Related Post), fitur ini menawarkan kepada pengunjung untuk membaca artikel dengan topik materi atau label yang sama. Fitur artikel terkait diharapkan meningkatkan jumlah pageview sebuah blog.
  • Auto readmore, fitur ini memotong artikel pada jumlah kata tertentu sehingga tampak rapi dihalaman indeks. Fitur auto readmore akan membuat blog terlihat profesional.
  • Pagination, fitur ini membuat navigasi perhalaman mirip dengan pencarian pada google. Dengan fitur ini pengunjung akan mudah menuju ke postingan lama kita.
  • Social Media, adalah fitur untuk mengaitkan blog dengan situs media sosial seperti Google+, Facebook, Twitter dan lain-lain. Fitur social media yang populer adalah berbagi artikel(share) dan menyukai (like).
  • Breadcrumbs, fitur ini membuat urutan navigasi pada tiap halaman posting mulai dari indeks sampai judul artikel. Contoh breadcrumbs seperti berkut ini:
    Home » Label » Nama Artikel
  • Pencarian (Search), fitur ini memungkinkan pengguna untuk mencari artikel pada blog kita. Fitur ini sebaiknya berada ditempat yang mudah terlihat seperti pada posisi menu atau side bar.

3. Kecepatan

Yang dimaksud dengan kecepatan disini adalah kecepatan loading sebuah blog saat dibuka. Tampilan blog yang menarik dengan banyak fitur biasanya berbanding terbalik dengan kecepatan loading sebuah blog. Template yang menarik dengan banyak widget dan javascript akan berakibat lama dibuka karena ukuran halaman yang otomatis menjadi lebih besar.

Template yang baik bisa memadukan faktor tampilan, fitur dan kecepatan secara selaras dengan tidak mengorbankan satu sama lain. Ada beberapa teknik untuk mempercepat loading sebuah blog seperti penggunaan cache browser, penggunaan asyncronous javascript dan optimalisasi image. Untuk mengecek kecepatan sebuah template bisa menggunakan tool seperti Google Pagespeed atau GTMetrix. Pilihlah template dengan minimal grade B.

4. SEO Friendly

Adalah kriteria yang terkait dengan penggunaan aturan SEO pada sebuah blog. Template yang SEO Friendly akan mendukung optimalisasi SEO pada halaman blog (SEO On Page). Banyak sekali template yang menawarkan beberapa optimalisasi SEO, pilihlah yang terbukti meningkatkan kualitas SEO sebuah blog berdasarkan testimoni atau cek implementasi template pada blog lain yang sudah menggunakan lebih dulu.

Ada beberapa ciri template yang SEO Fiendly seperti misalnya :

  • Komposisi title menggunakan urutan Nama artikel baru nama blog, seperti misalnya Cara Membuat Blog – Nulis Ilmu.
  • Penggunaan CSS yang baik untuk Heading H1, H2, H3 dan seterusnya.
  • Memiliki ukuran yang besar untuk area posting.
  • Meletakkan widget setelah area posting, seperti disebelah kanan atau bawah.
  • Menempatkan data-data untuk webmaster seperti penulis (author) dan tanggal update.
  • Memiliki dukungan meta data dinamis terutama keyword. Ini memudahkan kita  sehingga tidak harus membuat meta data untuk setiap postingan.
  • Validitas HTML dan CSS, ini penting untuk membuat blog kita bagus di mata mesin pencari dan pemeringkat blog seperti Google dan Alexa.

5. Responsive

Ini sebenarnya merupakan bagian dari fitur namun saya tempatkan pada pembahasan tersendiri karena sifatnya yang sangat penting terutama di era komputer tablet dan smartphone sekarang. template yang responsive akan mengikuti ukuran dan posisi layar browser client. Sebuah template yang reposnsive akan tampak bagus pada segala posisi dan dapat menyesuaikan secara cepat dan otomatis terhadap perubahan ukuran layar.

Cara kerja template yang responsive terletak pada kemampuannya dalam menyesuaikan tampilan terhadap perubahan layar. Letak kecanggihannya terdapat pada pengaturan kode CSS untuk mendeteksi ukuran dan dimensi layar. Dengan fitur ini beberapa komponen pda halaman yang tampil akan ditampilkan secara dinamis mengikuti ukuran layar.

6. Mobile Friendly

Ini adalah fitur baru yang disematkan pada pencarian google melalui perangkat mobile seperti smartphone. Fitur mobile friendly sebenarnya sudah ada pada platform seperti blogger dan wordpress namun sangat sederhana dan blog terlihat kurang menarik.

Dengan menerapkan fitur responsive pada template sedikit banyak akan membantu meningkatkan tampilan blog agar mobile friendly. Tanpa mobile friendly, sebuah blog akan terlihat kecil pada perangkat smartphone, karena harus merender piksel seukuran layak komputer yang rata-rata minimal 1024×768.

Itulah beberapa kriteria yang bisa dijadikan pedoman dalam memilih template blog kita. Sebenarnya ada satu kriteria lagi yaitu harga. Untuk pemula memang masih menggunakan template gratis, cirinya tuh ada credit link dibawahnya. Namun untuk blog yang disiapkan dan dikelola secara profesional tidak ada salahnya untuk membeli template yang premium karena akan lebih profesional dan didukung secara penuh oleh pengembang template.

Filed Under: Blogging

Mesin Pencari Tetap Nomor Satu

28 Februari 2015 By Eko Purnomo

Jika pada artikel sebelumnya saya menulis tentang VIVAlog, maka pada tulisan ini anda akan saya ajak untuk ke dunia nyata, yaitu realita dari sebuah blog yang sebenarnya. Yaitu kenyataan bahwa traffic pengunjung blog yang alami sebagian besar dihasilkan dari mesin pencari. Artinya apa, pengunjung menemukan blog kita saat dia mencari dengan sebuah kunci pada mesin pencari.

Pada tulisan sebelumnya saya sampaikan jika sebuah artikel berhasi dimuat pada VIVAlog maka dipastikan akan ada tambahan pengunjung khususnya pada saat artikel itu dipublikasikan. Ini memang benar adanya dan sudah saya buktikan. Namun apakah hal itu akan abadi, ternyata tidak.

statistik blog nulis-ilmu
Statistik blog nulis-ilmu per 28-02-2015

Pada statistik diatas terlihat pada tanggal 27-02-2015 terjadi lonjakan traffic yang luar biasa dari hari-hari sebelumnya. Ini terjadi karena saat itu artikel saya tentang “3 Tips Sederhana Membuat Battery Laptop Panjang Umur” diterima dan ditampilkan di VIVAlog. Tapi yang terlihat setelahnya adalah traffic kembali “normal” ke masa-masa seperti sebelumnya.

Hal ini terjadi karena pengunjung VIVAlog membaca artikel yang “disuguhkan”, bukan karena dia mencari. Dan ketika masa tayang artikel kita sudah bergeser dari halaman depan, maka traffic akan menurun dengan sendirinya. Untuk bisa setiap hari menayangkan artikel di VIVAlog rasanya kurang realistis terutama untuk blogger pemula dan masih awam seperti saya.

Trafic sebuah blog yang alami adalah yang dihasilkan dari mesin pencari. Mengapa demikian, ini berkaitan dengan prinsip dasar kehidupan yaitu saling tolong menolong. Artinya disaat seseorang mencari solusi atau pencerahan terhadap sebuah masalah di internet maka dia akan mencari di mesin pencari. Bagi siapapun yang tampil teratas dalam pencarian, itulah dianggap paling relevan dengan masalah yang dia hadapi dan tentunya akan di-klik dan dibaca.

Oleh sebab itu faktor optimisasi mesin pencari (SEO) sebuah artikel sangatlah penting, karena jika kita berhasil tampil teratas untuk banyak kata kunci pada mesin pencari maka dipastikan pengunjung kita akan naik. Untuk optimisasi mesin pencari atau SEO dapat dibaca pada artikel tentang apa itu SEO dan penerapannya pada blog.

Jadi meskipun hal-hal seperti membagikan artikel di VIVAlog, Facebook dan Twitter dapat meningkatkan kunjungan di blog, namun tetap saja faktor mesin pencari masih menjadi nomor satu dalam mendatangkan pengunjung ke blog kita. Untuk itu tetaplah konsisten menulis artikel dengan memperhatikan faktor SEO agar “menang” di mesin pencari.

*) sumber gambar ilustrasi SEO = //sunshinecoastseo.com

Filed Under: Blogging

7 Resep Jitu Artikel diterima VIVAlog

28 Februari 2015 By Eko Purnomo

logo vivalog

Pusing karena beberapa artikel yang kita kirim ke VIVAlog tidak juga diterima dan ditampilkan? Mungkin tulisan berikut ini bisa memberi gambaran dan panduan bahwa redaksi VIVAlog tidak sekejam yang kita bayangkan dan masih mau approve artikel dari para blogger pemula seperti saya misalnya.

Memang ada kriteria-kriteria tertentu yang membuat tulisan kita diterima untuk kemudian ditampilkan pada halaman VIVAlog. Namun apakah itu tentu hanya redaksi VIVAlog yang tahu. Yang pasti kita hanya diberi bahwa VIVAlog akan langsung menolak artikel yang mengandung unsur-unsur SARA, pornografi, kekerasan, tindakan provokasi yang merugikan orang lain dan menyiarkan kebencian.

Namun mengapa artikel kita yang tidak mengandung hal-hal tersebut masih saja tidak diterima oleh VIVAlog?

Berikut ini tujuh resep jitu agar artikel kita diterima dan ditampilkan di halaman VIVAlog :

1. Buatlah tulisan yang sesuai dengan kategori pada VIVAlog

Untuk bisa ditampilkan pada halaman VIVAlog, artikel kita harus merupakan salah satu dari 19 kategori yang disediakan oleh VIVAlog. Kategori itu adalah Teknologi, Gadget, Tips Blog, Sosial, Budaya, Sejarah, Sastra, Dunia, Politik, Ekonomi, Entertainment, Lifestyle, Kesehatan, Fashion, Wisata, Sport, Otomotif, Info Vivalog, Lainnya.

Jadi sebelum kita mulai menulis artikel, sebaiknya tentukan artikel yang akan kita tulis masuk pada kategori yang mana. Jika kita memang berniat akan menulis artikel dengan kategori Lainnya, sebaiknya pertimbangkan dulu tentang materi yang akan kita tulis apakah sesuai dengan kapasitas VIVAnews sebagai situs berita. Karena kita tahu bahwa VIVAlog merupakan bagian dari VIVAnews.

2. Buatlah tulisan yang up to date, unik, menarik dan informatif

VIVAlog sebagai bagian dari VIVAnews adalah situs komersial, jadi bagaimanapun tulisan kita akan dilihat dari segi bisnis khususnya pada minat baca pengunjung. Perlu diketahui bahwa hampir sebagian besar pengunjung VIVAlog berasal dari pengunjung yang membuka VIVAnews atau VIVA.co.id. Dan apa yang mereka cari saat membuka VIVAnews, Sudah tentu berita dan informasi yang unik, menarik dan informatif bukan?

Memang tidak mudah membuat artikel yang memenuhi empat unsur diatas, namun jika kita mau berusaha menggali potensi dalam diri kita dan mau memahamiinformasi yang dibutuhkan pembaca maka insyaAllah artikel kita akan diterima. Salah satu kriteria artikel yang baik adalah yang update terhadap situasi terkini dan merupakan hal baru yang bisa membuat orang penasaran untuk membacanya. Dengan banyak belajar, yakinlah kita mampu untuk membuat artikel yang demikian.

3. Buatlah tulisan dengan panjang proporsional

Ini sebetulnya terkait dengan unsur informatif sebuah artikel yang ada pada poin dua. Saya tekankan lagi karena artikel yang terlalu pendek terlihat kurang tuntas dalam menyampaikan informasi dan mengupas masalah serta memberi solusi.

Membuat artikel dengan panjang setidaknya 400 kata mungkin bisa dijadikan bahan referensi. Artikel dengan panjang segitu juga dianggap memenuhi unsur dalam SEO (Search Engine Optimization). Jadi buatlah artikel yang lengkap dengan poanjang proporsional sehingga informasi yang akan kita sampaikan dapat benar-benar dimengerti oleh pembaca khususnya pengunjung VIVAlog.

4. Belajarlah dari artikel yang sudah diterima VIVAlog 

Perhatikan saat kita membaca tulisan-tulisan yang ada di VIVAlog lalu resapi lebih dalam bagaimana rasa interest kita terhadap artikel tersebut. Yang pertama kali kita tangkap tentu judul artikel. Judul artikel yang menarik akan memancing pengunjung untuk meng-klik sebuah artikel dan kemudian membacanya. Jadi poinyang kita dapatkan disini adalah buatlah judul yang menarik hati pengunjung.

Setelah melihat judul artikel, selanjutnya kita mulai melihat pada paragraf pertama. Ini merupakan deskripsi singkat yang membuat pembaca memperoleh gambaran dari judul tadi. Paragraf pertama yang cantik akan membuat hasrat ingin membaca (desire to read) dari pengunjung menjadi terpancing dan seterusnya dilanjutkan dengan membaca keseluruhan isi artikel.

Perhatikan bagaiman mereka yang diterima di VIVAlog membuat paragraf pertama. Ini akan baik untuk pertimbangan artikel kita diterima dan ditampilkan di halaman VIVAlog.

Yang terakhir tentu isi artikel secara utuh, ini merupakan inti yang sebenarnya dari sebuah halaman website. Perhatikan gaya mereka yang diterima di VIVAlog dalam menyampaikan kata demi kata, paragraf demi paragraf pada sebuah artikel. Pelajari bagaimana mereka mampu menuliskan informasi secara runtut dan menarik sehingga pembaca tidak bosan dan melanjutkan sampai akhir tulisan.

5. Hindari hal-hal yang dilarang

Yang saya maksud disini bukan hanya larangan dari VIVAnews yang telah disebutkan diatas melainkan hal-hal terlarang dalam dunia blogging termasuk didalamnya tentang aturan kopi paste dan pelanggaran hak cipta. Jika artikel yang kita kirim merupakan artikel kopi paste, sudah tentu redaksi VIVAlog akan menolaknya.

Patuhi aturan-aturan dalam dunia blogging, jika seandainya kita mengambil materi dari blog lain sebaiknya berikan link sumber yang jelas. Jangan pernah berfikir untuk mengakali redaksi VIVAlog, bagaimanapun mereka orang-orang ahli yang sudah mempunyai sistem untuk menjaga konten pada website VIVAlog.

6. Pasanglah Iframe VIVAlog pada blog kita

Resep ini mengacu pada informasi yang diberikan oleh pihak VIVAlog. Informasi tersebut kurang lebih isinya VIVAlog lebih mengutamakan artikel dari blog yang sudah memasang Iframe VIVAlog. Jadi sebelum mengirim artikel, sebaiknya kita sudah memasang Iframe VIVAlog lebih dahulu.

Mengingat akan besarnya potensi pengunjung yang diberikan oleh VIVAlog, sebaiknya setelah artikel diterima kita tetap memasang Iframe VIVAlog ini. Akan sangat penting dan baik pada perkembangan blog jika dapat mengirim dan menampilkan artikel secara kontinyu di VIVAlog.

Buat para publisher Google Adsense, jangan takut memasang Iframe akan melanggar TOS. Pihak VIVAlog sebelumnya sudah mengkonsultasikan dengan pihak Google dan hal ini diperbolehkan.

7. Pastikan kita mengisi data dengan lengkap

Ini adalah yang tidak boleh tidak dilakukan. Saat mengirim artikel, kita harus mengerti bahwa Judul, isi dan URL Blog adalah wajib. Sudah tentu artikel kita tidak bisa diterima jika salah satu dari tiga hal tersebut kosong. Jadi pastikan mengisi data dengan lengkap sebelum mengirim artikel.

Untuk kolom file dan keterangan file tidak wajib diisi, jadi jangan beranggapan kalau artikel kit ditolak karena tidak menyertakan file gambar dan keterangannya.

Demikian beberapa resep agar artikel kita diterima dan ditampilkan pada situs VIVAlog. Bagaimana mengolah ketujuh resep ini sangat bergantung dari diri kita masing-masing. Kemampuan dan gaya menulis tiap-tiap orang memang berbeda namun satu tujuan yang pasti adalah niat kita untuk menulis artikel adalah berbagi informasi yang bermanfaat kepada pembaca.

Selamat berusaha dan jangan menyerah untuk bisa tampil di VIVAlog. Salam Blogger Indonesia.

Filed Under: Blogging

Cara Daftar dan Kirim Artikel di Vivalog

28 Februari 2015 By Eko Purnomo

logo vivalog

Bagi yang belum tahu cara mendaftar dan mengirim artikel di Vivalog, tulisan ini akan menjelaskan bagaimana prosesnya mulai dari awal sampai akhir. Vivalog adalah layanan social bookmark yang dimiliki oleh Viva.co.id. Dengan Vivalog kita bisa mempromosikan artikel kepada ribuan pengunjung Viva.co.id tiap harinya. Pengunjung yang banyak ini berpotensi meningkatkan traffic ke blog kita melalui artikel yang kita kirim di Vivalog tadi.

Pengalaman saya setelah kirim artikel ke Vivalog dan berhasil ditayangkan, pengunjung blog (Visitor) dan tayang halaman (Pageviews) naik hampir 3 kali lipat dari sebelumnya. Memang tidak semua artikel yang dikirim ke Vivalog akan ditayangkan, namun kita harus terus mencoba. Poin positifnya anggap saja ini sebagai ujian/test untuk mengetahui sampai dimana kemampuan menulis kita.

Cara daftar di Vivalog

Proses pendaftaran di Vivalog relatif mudah, cepat dan gratis. Kita hanya perlu melakukan registrasi pada halaman pendaftarn Vivalog, kemudian melakukan aktivasi akun dengan klik link verifikasi yang di kirim lewat email. Setelah akun kita aktif, selanjutnya kita langsung bisa login dan mulai mengirim artikel.

Berikut ini urutan proses pendaftaran akun di Vivalog :

  • Buka website Vivalog di alamat //log.viva.co.id, lalu klik tombol Kirim Blog yang ada di sebelah kanan agak ke bawah.
    halaman vivalog
  • Atau bisa juga dengan cara singkat langsung klik alamat //log.viva.co.id/form.
    daftar vivalog
  • Klik tombol Daftar yang ada dibawah.

  • Kemudian akan tampil form registrasi anggota, silahkan isi semua data dengan lengkap dan benar.
    form registrasi anggota vivalog
  • Jangan lupa centang juga tanda persetujuan yang ada paling bawah form.
    form registrasi anggota vivalog 2
  • Setelah selesai proses pengisian data, silahkan klik tombol daftar yang ada di bagian bawah.
  • Jika pengisian data benar akan tampil notifikasi pendaftaran berhasil dan kita diminta untuk melakukan konfirmasi sesuai petunjuk yang dikirim melalui email.
    selesai registrasi vivalog
  • Buka akun email dan cek apakah email aktivasi akun sudah ada atau tidak. Jika tidak ada, coba buka folder spam, barangkali ada disitu.
    email konfirmasi registrasi vivalog
  • Silahkan buka email tersebut lalu klik link aktivasi yang dikirim oleh admin vivanwes.
    isi email konfirmasi registrasi vivalog
  • Jika benar akan tampil halaman selamat datang seperti ini.
    proses verifikasi vivalog berhasil
  • Proses pendaftaran akun vivalog selesai sampai disini.

Cara Mengirim artikel di Vivalog

Setelah berhasil mendaftar di Vivalog, selanjutnya kita bisa mulai mengirim artikel. Kita bebas mengirim artikel apa saja ke Vivalog selama sesuai dengan aturan dan kategori yang telah ditetapkan oleh Vivalog. Tentu kita tidak bisa mengirim artikel terlarang seperti yang berbau pornografi, penipuan atau hal-hal yang dilarang lainnya.

Artikel yang dikirim ke Vivalog tidak langsung ditampilkan begitu saja pada halaman Vivalog. Setiap artikel yang dikirim ke Vivalog akan dikoreksi dan kalau perlu diedit oleh redaksi Vivalog. Jika artikel memenuhi syarat akan diinformasikan melalui email dan tentu akan tampil pada halaman Vivalog.

Untuk dapat diterima, artikel kita harus menarik, unik dan informatif tentunya. Hal ini terkait dengan kapasitas Vivanews sebagai induk dari Vivalog yang basicnya merupakan situs berita. Kita tidak seharusnya mengirim artikel yang biasa-biasa saja seperti misalnya cara membuat email, cara membuat facebook dan sebagainya karena kemungkinan akan ditolak oleh redaksi Vivalog.

Jika semua hal diatas telah kita lakukan berarti artikel kita siap dikirim ke redaksi Vivalog. Namun sebelum itu ada satu hal lagi yang perlu dan sebaiknya kita lakukan mengingat agar artikel kita diterima oleh redaksi Vivalog, yaitu memasang frame Vivalog di blog kita.

Untuk memasang script iframe Vivalog silahkan copy paste script dari halaman Vivalog lalu taruh pada blog kita. Bagi yang bingung nyari scriptnya, berikut ini script ifreme Vivalog yang saya kopi dari situs Vivalog.

 <iframe style="width:100%; height:100%; border:none; margin:0; padding:0; min-height: 225px;" src="//log.viva.co.id/iframe" scrolling="no"></iframe> 

Setelah semua siap, silahkan kirim Vivalog dengan cara seperti ini:

  1. Silahkan login ke Vivalog dengan akun yang telah kita buat tadi pada alamat //log.viva.co.id/form.
    login vivalog
  2. Jika proses login berhasil, kita akan langsung diarahkan pada halaman kirim artikel seperti ini.
    isi artikel vivalog
  3. Isi parameter-parameter yang dibutuhkan seperti Judul Blog, Kategori, isi Blog dan URL Blog.
  4. Untuk parameter file bersifat opsional dan boleh tidak diisi.
  5. Selanjutnya silahkan isi kode chapcta pada fitur keamanan sesuai gambar diatasnya.
  6. Setelah selesai, silahkan centang persetujuan Syarat dan Ketentuan lalu Klik Kirim Blog.
    syarat dan ketentuan vivalog
  7. Selanjutnya artikel yang kita kirim harus antri untuk mendapat koreksi persetujuan dari redaksi Vivalog.
  8. Proses ini bisa mencapai  beberapa hari seperti misalnya pengalaman saya bisa mencapai 5 hari.
  9. Jika artikel kita diterima, kita akan memperoleh pemberitahuan melalui email. Namun sebaliknya jika artikel kita ditolak, kita tidak akan memperoleh pembaritahuan melalui email.
Bagaimana, mudah kan cara mendaftar dan mengirim artikel diVivalog ? Ya iyalah, yang sulit itu gimana caranya membuat artikel kita diterima, betul tidak? Nah pada artikel selanjutnya insyaAllah akan saya bagikan beberapa tips agar artikel kita diterima di Vivalog.

Filed Under: Blogging

Trik Mengatur Tampilnya Widget pada Blogspot

23 Februari 2015 By Eko Purnomo

Widget adalah sebuah bagian dari tata letak blog yang memiliki fungsi tertentu untuk mendukung kinerja blog. Widget yang sering kita lihat diantaranya tulisan populer, tulisan terbaru, archive dan juga tentunya iklan seperti Google Adsense. Pada tulisan ini akan saya sharingkan pengalaman trik mengatur tampilnya widget breaking news yang tidak saya tampilkan di halaman depan.

Ada beberapa trik yang bisa dipakai untuk menampilkan widget hanya pada halaman tertentu atau tidak menampilkan widget pada halaman tertentu. Script yang kita pakai untuk melakukan trik ini adalah logika b:if yang merupakan logika penyeleksian pada blogger.

Berikut ini beberapa trik untuk mengatur tampilnya widget pada blogspot:

1. Hanya menampilkan widget di Home/Beranda

Dengan cara ini widget akan tampil pada halaman depan atau home saja. Home atau Beranda adalah halaman yang tampil saat sebuat blog diakses secara langsung dari alamatnya, misalnya //nulis-ilmu.blogspot.com.

Script hanya menampilkan widget di Home/Beranda :
<b:if cond=’data:blog.url == data:blog.homepageUrl’>
       . . . .   //script widget ditaruh disini
</b:if>

2. Menampilkan widget di semua halaman kecuali Home/Beranda

Dengan cara ini widget tidak akan tampil pada halaman depan, namun tampak pada halaman lain seperti pada artikel/pos, laman/page, archive dan pencarian.

Script menampilkan widget kecuali di Home/Beranda :
<b:if cond=’data:blog.url != data:blog.homepageUrl’>
      . . . .   //script widget ditaruh disini
</b:if>

3. Hanya menampilkan widget di halaman artikel (pos)

Dengan cara ini widget hanya akan tampil saat blog menampilkan halaman artikel atau posting saja. Selain halaman post, widget tidak ditampilkan.

Script hanya menampilkan widget di halaman posting :
<b:if cond=’data:blog.pageType == &quot;item&quot;’>
      . . . .   //script widget ditaruh disini
</b:if>

4. Menampilkan widget di semua halaman, kecuali halaman artikel (pos)

Kebalikan dari cara ketiga, widget tidak akan tampil pada halaman artikel atau posting, tapi tampil pada halaman yang lain termasuk Home/Beranda.

Script menampilkan widget kecuali di halaman posting :
<b:if cond=’data:blog.pageType != &quot;item&quot;’>
      . . . .   //script widget ditaruh disini
</b:if> 

5. Hanya menampilkan widget di halaman statik (page/laman)

Dengan cara ini widget hanya akan tampil saat blog menampilkan halaman statik atau static page saja. Selain halaman statik (page), widget tidak ditampilkan.

Script hanya menampilkan widget di halaman statik :
<b:if cond=’data:blog.pageType == &quot;static_page&quot;’>
      . . . .   //script widget ditaruh disini
</b:if>

6. Menampilkan widget di semua halaman, kecuali halaman statik (page/laman)

Kebalikan dari cara kelima, widget tidak akan tampil pada halaman statik atau static page, tapi tampil pada halaman yang lain termasuk Home/Beranda.

Script menampilkan widget kecuali di halaman statik :
<b:if cond=’data:blog.pageType != &quot;static_page&quot;’>
      . . . .   //script widget ditaruh disini
</b:if> 

7. Hanya menampilkan widget di halaman archive

Dengan cara ini widget hanya akan tampil saat blog menampilkan arsip blog (archive) saja. Selain itu, widget tidak ditampilkan.

Script hanya menampilkan widget di halaman arsip (archive) :
<b:if cond=’data:blog.pageType == &quot;archive&quot;’>
      . . . .   //script widget ditaruh disini
</b:if>

8. Menampilkan widget di semua halaman kecuali halaman archive

Kebalikan dari cara ketujuh, widget tidak akan tampil pada halaman arsip atau archive, tapi tampil pada halaman yang lain termasuk Home/Beranda.

Script menampilkan widget kecuali di halaman arsip (archive) :
<b:if cond=’data:blog.pageType != &quot;archive&quot;’>
      . . . .   //script widget ditaruh disini
</b:if>

9. Hanya menampilkan widget di alamat URL artikel tertentu

Dengan cara ini widget hanya akan tampil saat alamat artikel tertentu saja. Selain itu, widget tidak ditampilkan.

<b:if cond=’data:blog.pageType == &quot;alamat-url-artikel&quot;’>
      . . . .   //script widget ditaruh disini
</b:if>

10. Menampilkan widget di semua halaman kecuali alamat URL artikel tertentu

Kebalikan dari cara kesembilan, widget tidak akan tampil pada alamat artikel tertentu, tapi tampil pada halaman yang lain termasuk halaman postingan.

<b:if cond=’data:blog.pageType != &quot;alamat-url-artikel&quot;’>
      . . . .   //script widget ditaruh disini
</b:if>

Contoh Trik Mengatur Tampilnya Widget pada Blogspot

Contoh berikut ini mengatur widget breaking news agar tidak tampil dihalaman depan

 <b:if cond='data:blog.url != data:blog.homepageUrl'>  
<div class='newspic'>
<div style='float:left;width:650px;padding:1px 0 6px 130px; position:relative; overflow:hidden;'>
<script type='text/javascript'>
var cssfeed=new gfeedrssticker(&quot;example1&quot;, &quot;example1class&quot;, 4000, &quot;_new&quot;)
cssfeed.addFeed(&quot;Creating Website&quot;, &quot;//nulis-ilmu.blogspot.com/feeds/posts/default&quot;) //Specify &quot;label&quot; plus URL to RSS feed
cssfeed.displayoptions(&quot;date&quot;) //show the specified additional fields
cssfeed.setentrycontainer(&quot;div&quot;) //Wrap each entry with a DIV tag
cssfeed.filterfeed(10, &quot;date&quot;) //Show 10 entries, sort by date
cssfeed.entries_per_page(1)
cssfeed.init()
</script>
</div>
<div style='clear:both;'/>
</div>
</b:if>

Filed Under: Blogging

Cara Memasang Breaking News Pada Blogspot

23 Februari 2015 By Eko Purnomo

cara memasang breaking news pada blogspot

Kali ini saya akan berbagi tips tentang cara memasang breaking news pada blogspot. Breaking news adalah sebuah fitur tambahan pada blog yang menampilkan artikel-artikel terbaru secara bergantian dengan menggunakan javascript. Tampilan breaking news yang menarik (mirip dengan tampilan judul berita pada televisi) membuat saya lebih memilih breaking news daripada teks berjalan.

Fungsi Breaking News

Saat memposting artikel terbaru biasanya kita akan mempromosikan artikel tersebut melalui media sosial, Google webmaster dan mendaftarkan URL di mesin pencari. Kemarin saya berfikir bagaimana cara memberitahu pengunjung tentang aktikel terbaru namun dengan cara yang interaktif yang memberitahu pengunjung sekaligus menarik pengunjung untuk mengkliknya. Dan jawaban dari keinginan saya tersebut adalah apa yang disebuat dengan Breaking News diatas.

Cara Memasang Breaking News pada Blogspot

1. Sebelum melakukan proses berikut ini, pastikan login dulu pada akun bloggernya.

2. Klik menu Template yang ada disebelah kiri lalu klik Edit HTML.

3. Cari kode “</b:skin>” dengan cara menekan  tombol CTRL+F pada editor HTMLnya lalu ketik </b:skin>.

4. Letakkan kode berikut ini di atas kode ]]> yang berada sebelum kode </b:skin>

 .newspic {background:#252525 url(//3.bp.blogspot.com/-GoZGUMDvx8g/T1je4hEa9iI/AAAAAAAAA7E/aOfllbW_qOc/s1600/BRK+NW.png) no-repeat top left;width:650px;margin:0 auto;padding:0 auto; height:24px;color:#fff;}  
.news {width: 650px;margin:0 auto;padding:0 auto;line-height: 1.2em;text-align:left;font-family:Arial;font-size:11px;color:#fff;overflow:hidden;clear:both;}
.news a:link, .news a:visited{color:#000000;text-decoration:none;}
.news a:hover {color:#ddd;text-decoration:underline;}

5. Ubah nilai width yang saya tandai dengan warna merah, sesuaikan dengan tampilan blog masing-masing.

6. Selanjutnya cari kode “</head>” dengan cara menekan  tombol CTRL+F pada editor HTMLnya lalu ketik </head>.

7. Kemudian letakkan kode berikut di atas kode </head>. (hati-hati agak panjang kodenya)

 <script src='//www.google.com/jsapi?key=ABQIAAAAUMsU2d40bO1-m8DeADFRexTdcQS31_Y0TkToW9tE1XWPEnv6YBSa1QfZaAr4GJ8-AZkWddpnW9Y0hA'></script>  
<script type='text/javascript'>
//<![CDATA[
var gfeedfetcher_loading_image="indicator.gif";google.load("feeds","1");function gfeedfetcher(c,a,b){this.linktarget=b||"";this.feedlabels=[];this.feedurls=[];this.feeds=[];this.feedsfetched=0;this.feedlimit=5;this.showoptions="";this.sortstring="date";document.write('<div id="'+c+'" class="'+a+'"></div>');this.feedcontainer=document.getElementById(c);this.itemcontainer="<li>"}gfeedfetcher.prototype.addFeed=function(b,a){this.feedlabels[this.feedlabels.length]=b;this.feedurls[this.feedurls.length]=a};gfeedfetcher.prototype.filterfeed=function(b,a){this.feedlimit=b;if(typeof a!="undefined"){this.sortstring=a}};gfeedfetcher.prototype.displayoptions=function(a){this.showoptions=a};gfeedfetcher.prototype.setentrycontainer=function(a){this.itemcontainer="<"+a.toLowerCase()+">"};gfeedfetcher.prototype.init=function(){this.feedsfetched=0;this.feeds=[];this.feedcontainer.innerHTML='<img src="'+gfeedfetcher_loading_image+'" /> Loading news...';var a=this;for(var b=0;b<this.feedurls.length;b++){var c=new google.feeds.Feed(this.feedurls[b]);var d=(this.feedlimit<=this.feedurls.length)?1:Math.floor(this.feedlimit/this.feedurls.length);if(this.feedlimit%this.feedurls.length>0&&this.feedlimit>this.feedurls.length&&b==this.feedurls.length-1){d+=(this.feedlimit%this.feedurls.length)}c.setNumEntries(d);c.load(function(e){return function(f){a._fetch_data_as_array(f,e)}}(this.feedlabels[b]))}};gfeedfetcher._formatdate=function(a,c){var d=new Date(a);var b=(c.indexOf("datetime")!=-1)?d.toLocaleString():(c.indexOf("date")!=-1)?d.toLocaleDateString():(c.indexOf("time")!=-1)?d.toLocaleTimeString():"";return"<span class='datefield'>"+b+"</span>"};gfeedfetcher._sortarray=function(a,b){var b=(b=="label")?"ddlabel":b;if(b=="title"||b=="ddlabel"){a.sort(function(e,d){var g=e[b].toLowerCase();var f=d[b].toLowerCase();return(g<f)?-1:(g>f)?1:0})}else{try{a.sort(function(e,d){return new Date(d.publishedDate)-new Date(e.publishedDate)})}catch(c){}}};gfeedfetcher.prototype._fetch_data_as_array=function(b,a){var d=(!b.error)?b.feed.entries:"";if(d==""){alert("Google Feed API Error: "+b.error.message)}for(var c=0;c<d.length;c++){b.feed.entries[c].ddlabel=a}this.feeds=this.feeds.concat(d);this._signaldownloadcomplete()};gfeedfetcher.prototype._signaldownloadcomplete=function(){this.feedsfetched+=1;if(this.feedsfetched==this.feedurls.length){this._displayresult(this.feeds)}};gfeedfetcher.prototype._displayresult=function(a){var e=(this.itemcontainer=="<li>")?"<ul>n":"";gfeedfetcher._sortarray(a,this.sortstring);for(var c=0;c<a.length;c++){var d='<a href="'+a[c].link+'" target="'+this.linktarget+'" class="titlefield">'+a[c].title+"</a>";var b=/label/i.test(this.showoptions)?'<span class="labelfield">['+this.feeds[c].ddlabel+"]</span>":" ";var g=gfeedfetcher._formatdate(a[c].publishedDate,this.showoptions);var f=/description/i.test(this.showoptions)?"<br />"+a[c].content:/snippet/i.test(this.showoptions)?"<br />"+a[c].contentSnippet:"";e+=this.itemcontainer+d+" "+b+" "+g+"n"+f+this.itemcontainer.replace("<","</")+"nn"}e+=(this.itemcontainer=="<li>")?"</ul>":"";this.feedcontainer.innerHTML=e};
var gfeedfetcher_loading_image="indicator.gif";function gfeedrssticker(d,b,a,c){this.tickerid=d;this.delay=parseInt(a);this.mouseoverBol=0;this.itemsperpage=1;this.messagepointer=0;gfeedfetcher.call(this,d,b,c);this.itemcontainer="<div>";this.tickerdiv=document.getElementById(d)}gfeedrssticker.prototype=new gfeedfetcher;gfeedrssticker.prototype.constructor=gfeedrssticker;gfeedrssticker.prototype._displayresult=null;gfeedrssticker.prototype.entries_per_page=function(a){this.itemsperpage=a};gfeedrssticker.prototype._signaldownloadcomplete=function(){this.feedsfetched+=1;if(this.feedsfetched==this.feedurls.length){this._initscroller(this.feeds)}};gfeedrssticker.prototype._initscroller=function(a){var c=this;gfeedfetcher._sortarray(a,this.sortstring);this.itemsperpage=(this.itemsperpage>=a.length)?1:this.itemsperpage;var b=a.slice(this.messagepointer,this.itemsperpage);this.tickerdiv.innerHTML=formatrssmessage(b,this.showoptions,this.itemcontainer,this.linktarget);this.tickerdiv.onmouseover=function(){c.mouseoverBol=1};this.tickerdiv.onmouseout=function(){c.mouseoverBol=0};this.messagepointer=this.itemsperpage;if(window.attachEvent){window.attachEvent("onunload",function(){c.tickerdiv.onmouseover=c.tickerdiv.onmouseout=null})}setTimeout(function(){c._rotatemessage()},this.delay)};function formatrssmessage(d,b,f,g){var c=(f=="<li>")?"<ul>n":"";for(var e=0;e<d.length;e++){var h='<a href="'+d[e].link+'" target="'+g+'" class="titlefield">'+d[e].title+"</a>";var j=/label/i.test(b)?'<span class="labelfield">['+d[e].ddlabel+"]</span>":" ";var k=gfeedfetcher._formatdate(d[e].publishedDate,b);var a=/description/i.test(b)?"<br />"+d[e].content:/snippet/i.test(b)?"<br />"+d[e].contentSnippet:"";c+=f+h+" "+j+" "+k+"n"+a+f.replace("<","</")+"nn"}c+=(f=="<li>")?"</ul>n":"";return c}gfeedrssticker.prototype._rotatemessage=function(){var b=this;if(this.mouseoverBol==1){setTimeout(function(){b._rotatemessage()},100)}else{var a=this.feeds.slice(this.messagepointer,this.messagepointer+this.itemsperpage);this.tickerdiv.innerHTML=formatrssmessage(a,this.showoptions,this.itemcontainer,this.linktarget);this.messagepointer=(this.messagepointer+this.itemsperpage>this.feeds.length-1)?0:this.messagepointer+this.itemsperpage;setTimeout(function(){b._rotatemessage()},this.delay)}};
//]]>
</script>
<style type='text/css'>
.titlefield{ /*CSS for RSS title link in general*/
text-decoration: none;}
.labelfield{ /*CSS for label field in general*/
color:#aaa;font-size: 100%;}
.datefield{ /*CSS for date field in general*/
color:#aaa;font:normal 14px Arial;text-transform:none;}
#example1{ /*Demo 1 main container*/
width: 780px;
height: 14px;
border: 0px solid #aaa;
padding: 0px;
font:bold 16px Arial;
text-transform:none;
text-align:left;
background-color:transparent;}
code{ /*CSS for insructions*/
color: #fff;}
#example1 a:link, #example1 a:visited {color:#f2f2f2;text-decoration:none;}
#example1 a:hover {color:#C8D3F2;text-decoration:none;}
</style>

8. Taruh kode berikut ini pada lokasi dipasang breaking news-nya.

 <div class='newspic'>  
<div style='float:left;width:650;padding:1px 0 6px 130px; position:relative; overflow:hidden;'>
<script type='text/javascript'>
var cssfeed=new gfeedrssticker(&quot;example1&quot;, &quot;example1class&quot;, 4000, &quot;_new&quot;)
cssfeed.addFeed(&quot;Creating Website&quot;, &quot;//nulis-ilmu.blogspot.com/feeds/posts/default&quot;) //Specify &quot;label&quot; plus URL to RSS feed
cssfeed.displayoptions(&quot;date&quot;) //show the specified additional fields
cssfeed.setentrycontainer(&quot;div&quot;) //Wrap each entry with a DIV tag
cssfeed.filterfeed(10, &quot;date&quot;) //Menampilkan 10 artikel, sort by date
cssfeed.entries_per_page(1)
cssfeed.init()
</script>
</div>
<div style='clear:both;'/>
</div>

9. Silahkan ganti alamat //nulis-ilmu.blogspot.com dengan nama blog masing-masing. Untuk mengganti jumlah artikel yang ditampilkan pada breaking news, silahkan ubah parameter pada cssfeed.filterfeed yang pada contoh di beri nilai 10.

10. Misalnya pada template Sang SEO yang saya pakai ini saya taruh jadi satu dengan breadcrumbs, maka saya taruh kode diatas tepat dibawah kode <b:includable id=’breadcrumb’ var=’posts’>.

11. Untuk pemasangan pada lokasi dan template yang lain silahkan bereksperimen sendiri sesuai dengan template blog masing-masing.

Demikian cara memasang breaking news pada blogspot seperti yang ada pada blog saya ini. Silahkan modifikasi tampilan breaking news dengan selera masing-masing.

Filed Under: Blogging

  • « Previous Page
  • 1
  • …
  • 4
  • 5
  • 6
  • 7
  • 8
  • Next Page »

Kategori

  • Android
  • Blogging
  • CSS
  • Desain
  • Elektronika
  • HTML
  • Internet
  • Javascript
  • Komputer
  • Mikrokontroler
  • PHP
  • Website

Pos-pos Terbaru

  • Rangkaian Adaptor 12 Volt 3 Ampere
  • 10 Aplikasi Transportasi Online Terbaru 2018
  • 3 Cara Screenshot di Laptop Windows
  • Rangkaian Adaptor 12V 35Ampere
  • Komunitas Desainer Kampung Jepara
  • Solder Yang Bagus dan Berkualitas
  • Cara Melewatkan Parameter ke dalam Fungsi pada Bahasa C
  • Parameter Dalam Bahasa C: Formal dan Aktual
  • Prototipe Fungsi dalam Bahasa C
  • Cara Menggunakan Fungsi dalam Bahasa C
  • Home
  • Privacy
  • Disclaimer
  • Kontak

Copyright © 2024 · Nulis-ilmu.com