• Home
  • About
  • Sitemap
  • Disclaimer
  • Contact

ErJud Chayob's Blog

My Blog My Experience

  • Artikel
  • Software
  • Teknologi
    • Android
    • Office
    • Win 7
  • Win 8
  • Tutorial Blog
  • Lainnya
    • Artikel Islami
    • Facebook
    • Game
    • Hukum Waris
    • Skefo
    • Tips dan Trik
    • Tuntunan Shalat
    • Tutorial Blog
Home » Mobile » Tutorial Blog » 7 Widget Penting Untuk Template Mobile

7 Widget Penting Untuk Template Mobile

tampilan mobile
7 Widget Penting Untuk Template Mobile- Begitu banyak template yang menawarkan design SEO Friendly. Hal ini tentu sangat positif demi menjaga kesinambungan antara template dengan kredibilitas di mesin pencari. Tetapi alangkah baiknya jika template tersebut juga memiliki Custom Mobile Template sendiri. Artinya blog yang kita kelola memiliki 2 ruang yakni di tampilan PC dan ditampilan Mobile/Selular.

#1. Beberapa memang kita kadang memaksa atau engga tau template kita buat tersesuai sedangkan kita belum mempunyai ruang untuk tampilan diversi mobile akhirnya saat kita akses blog tersebut ke versi mobile tampilannya melebar dan cukup memberatkan serta lebih banyak lagi bandwidth yang harus terkuras. Bagi sobat yang jarang ngecek ke tampilan mobile tentu engga menyadari akan hal ini. Padahal jangan salah, sebagian yang berkunjung ke blog kita berasal dari mereka yang mengakses lewat handphone.

#2. Ada juga yang menggunakan template default blogger (blogspot) untuk di mobile tetapi cukup disayangkan template yang tadinya ringan malah menjadi berat baik loading serta cursor di handphone yang menjadi begitu sangat lambat. Kenapa bisa menjadi berat? Salah satunya karena template tersebut kita tambahin bingkai, warna latar dan gambar header. Biasanya blog yang seperti ini langsung saya tinggalin meski postingan/ konten di blognya menghadirkan informasi yang menarik. Buat apa post/konten yang menarik jika blog nya berat dan sangat lambat. Sekali-kali, tengoklah juga apa yang sedang terjadi dengan blog kita diversi mobile jangan terbuai oleh tampilan versi desktop saja. Hal ini murni keluhan saya karena tiap hari saya mengakses internet lewat handphone dengan menggunakan browser operamini juga sesekali menggunakan browser ucweb selain dengan mengakses lewat PC tentunya.

#3. Kita sudah memiliki design mobile template, tetapi kita engga fokus memanfaatkannya. Olehnya itu saya sedikit akan berbagi mengenai hal tersebut, di antaranya:

7 widget penting untuk template mobile 

1) Sobat harus menyertakan Sitemap/Daftar Isi blog. Hal ini cukup penting bagi pengunjung mobilers, karena selain memudahkan mereka untuk memilih judul postingan mana yang mereka akan buka juga blog kita akan di nilai menjadi blog yang rapi karena memperhatikan hal-hal yang sedetail itu.

Dan jangan sampai kelupaan, jika kita menggunakan sitemap roll maka jangan gunakan kode tersebut di mobile template karena daftar isi blog kita cuma muncul sebagian.

Berikut ini kode sitemap yang saya terapin di blog ini.



Paste-kan kode di atas di entri baru (postingan baru). Paste-nya di html postingan, jangan di compuse. Ganti http://www.erjud-chayob.com/ dengan nama blog sobat.

2) Random Post atau postingan acak. Hal ini tentu bermafaat terlebih lagi jika jumlah konten kita yang sudah banyak maka random post ini perlu kita munculin di homepage kita. Random post ini akan memunculkan postingan-postingan terbaru hingga terdahulu. Jumlah postingan yang ingin sobat tampilkan pun tergantung dari kebutuhan sobat. Berikut ini kode random post yang saya terapin:
Silakan sobat paste kode di bawah ini di Add Gadget lalu pilih HTML/JavaScript.



3) Page/Halaman blog. Mencari kode ini sangat sulit, beberapa nemu tetapi kode nya engga mendukung di versi mobile. Akhirnya ketemu juga dari salah satu sahabat blogger. Berikut kodenya yang saya terapin:

Copy kode di bawah ini dan buka Template HTML blog. Paste-kan kode tersebut tepat di atas kode ]]></b:skin>



Selanjutnya cari </body>, tambahkan kode di bawah ini tepat di atas kode </body>.



Hasilnya adalah seperti di bawah ini:

page blog

4) Widget follower blog (Join). Kode ini saya dapat juga dari salah satu sahabat blogger yang bisa dibilang sangat berjasa buat mendesign blog ini jadi beda dari yang lain. Karena mempercantik design template adalah salah satu unsur yang sangat penting hingga sejauh mana bentuk perhatian kita soal tampilan. Cuma disini saya rancang sendiri gambar untuk widgetnya. Berikut kodenya:



Silakan sobat ganti "5063166391299293" dengan id blog sobat. Untuk gambar widget follower blog ini, sudah saya modif sendiri menjadi seperti di bawah ini:

join google

5) Feed Blog. Untuk melihat feed blog ini sobat misalnya buka di operamini, di paling atas itu ada tulisan Atom. Coba sobat tekan itu dan perhatikan apakah postingan sobat disitu panjang atau ringkas. Jika panjang maka saran saya sih sobat baiknya meringkasnya dengan cara:

Dasbor Blog --> Setelan --> Lainnya --> Umpan Situs --> Izinkan Umpan Blog --> Singkat

Katanya salah satu guna dari meringkas feed blog ini agar konten kita engga di copy mentah-mentah. Dan jika sobat meringkasnya juga engga akan menguras data bandwidth yang sebanyak ketika feednya belum diringkas. But, up to you!

feed situs


6) Tombol Share Facebook, Google+ dan Twitter. Engga usah dijelasin lagi manfaatnya karena hal ini pasti sangat bermanfaat dan wajib ada di template tiap blog sobat. Tombol share nya enak dipandang mata dan keren tentunya. Tombol share ini juga merupakan bagian dari template premium bawaan mas-sugeng. Saya juga telah menambahkan tombol share Lintas Me, awalnya hanya iseng-iseng tetapi di perhatikan lumayan keren juga jadinya, hehehe tapi tombol ini engga saya bagikan kecuali ada yang request.

Berikut kodenya:


Dan berikut hasilnya:

tombol share

7) Tombol Like facebook untuk tiap konten/postingan. Sekali lagi ini dapat dari sahabat blogger yang bisa dibilang berbakat dalam mengolah kode HTML untuk template blogger. Like facebooknya cukup membuat konten kita lebih memiliki nyawa tersendiri. Engga ada komentar, Like pun jadi hehehe

Berikut kodenya:



Caranya, masuk ke edit HTML Template, kemudian cari kode <b:includable id='mobile-post' var='post'> , gerak-kan kursor ke bawah untuk mencari kode <data:post.body/> yang terletak antara <b:includable id='mobile-post' var='post'> dan </b:includable>. Pastekan kode tersebut di atas atau di bawah kode <data:post.body/> (jika menempatkannya di atas kode <data:post.body/> maka tombol like akan berada di atas konten artikel, begitu juga sebaliknya.)

Itulah beberapa hal penting yang selama ini menjadi perhatian saya khususnya untuk versi mobile template. Semoga bermanfaat dan segala kekurangannya yang terjadi ketika sobat terapin maka sepenuhnya hal tersebut ditanggung sendiri.


Thanks to:
mas-sugeng.com
blogmobie.blogspot.com
opinisaya.net


References by template code:
eltelu.blogspot.com
panduantemplateblog.blogspot.com
Posted by Erjud Chayob on Monday, March 4, 2013
Anda baru saja membaca artikel yang berkategori Mobile / Tutorial Blog dengan judul 7 Widget Penting Untuk Template Mobile. Anda bisa bookmark halaman ini dan bila ingin menjadikan bahan referensi harap cantumkan link sumber menuju postingan ini. Terima Kasih.


If you enjoyed this article just click here, or subscribe to receive more great content just like it. Subscribe via RSS Feed

Share to

Facebook Google+ Tweet Digg Reddit

9 Responses to "7 Widget Penting Untuk Template Mobile"

  1. BlogMobieMarch 4, 2013 at 7:25 AM

    wew, textareanya keren, gatal telingaku, keknya ada yg sebut blog ane

    ReplyDelete
    Replies
    1. Erjud ChayobMarch 4, 2013 at 8:15 AM

      makasih wan uda bilang textare ku keren hihihi ... (kira'in kontennya yang keren huhuhu ... #mimpi)
      bersihkan kuping dulu mungkin ada kecoak nempel haha

      Delete
      Replies
        Reply
    2. Reply
  2. NetterKuMarch 4, 2013 at 11:42 AM

    Penting2 semua nihh widgetnya...kern sob...

    ReplyDelete
    Replies
    1. Erjud ChayobMarch 4, 2013 at 1:04 PM

      makasih kang, semoga bermanfaat :)

      Delete
      Replies
        Reply
    2. Reply
  3. kangsetMarch 5, 2013 at 12:57 PM

    komentar terakrir, top komentar, statistic conter, artikel yang berkaitan, subscript artikel, bbcode, kayaknya perlu juga di tambahkan!

    ReplyDelete
    Replies
    1. Erjud ChayobMarch 5, 2013 at 1:01 PM

      benar kang, tetapi ilmu saya masih sampai di situ hihihihihi....
      minta bantuannya kang :) tetapi nanti dipelajari lebih mendalam :)

      Delete
      Replies
        Reply
    2. Reply
  4. LanonadioMarch 5, 2013 at 11:59 PM

    kayanya Page/Halaman blog gak usah deh sob , bukannya itu nambah valid xhtml template kita

    ReplyDelete
    Replies
    1. Erjud ChayobMarch 6, 2013 at 12:35 AM

      iya tapi menurut saya fungsinya sangat penting, makasih kang sarannya dan dikemudian akan dipikirkan lagi :)

      Delete
      Replies
        Reply
    2. Reply
  5. K.A.AMay 18, 2013 at 6:18 PM

    Mas Erjud, saya gak paham masalah coding dan penempatan widget yang friendly, ada saran buat pemula? makasi ya...

    ReplyDelete
    Replies
      Reply
Add comment
Load more...

Newer Post
Older Post
Home
Subscribe to: Post Comments (Atom)

ReadList

  • BlogMobie
    Sering Belanja Online? Lewat ShopBack Aja!

ReadList

  • ...아름다운 세상...^-^
    Yu Seung Eun & GB9~~I Really Love You (Cunning Single Lady OST)

Popular Posts

  • Cara Download Subtitle VIU
  • Chord Nagita Raffi – Kamulah Takdirku
  • Mengatasi Problem Missing PES2013
  • Chord Gibran - Salahkah Mencintaimu
  • Chord Ardiansyah Martin - Bukan Salah Jodoh

Android Store

  • Auto Screen On-Off
  • Emoticons
  • GOM Remote
  • Online Shop
  • Mouse and Keyboard Wireless

Random Posts

Islamic Posts

  • Fiqih Mawaris 1
  • Fiqih Mawaris 2
  • Fiqih Mawaris 3
  • Fiqih Mawaris 4
  • Akhir Perantauan Kita
© 2016 blog erjud, All Rights Reserved
Modified by Ujud Al-ikhwan · Blogger
DMCA · Mobile ·