Jumat, 30 Desember 2011

Cara Mengubah Lebar Menu Navigasi

Di penghujung tahun 2011 ini, saya ingin berbagi informasi kepada pembaca sekalian khususnya bagi yang menggunakan template seperti yang saya pakai saat ini yaitu Thesis SEO Blogger Template karya dari Blog Juragan.

Sebelumnya pada template ini, saya hanya dapat memasukkan maksimal lima tautan menu navigasi dalam satu baris. Bila saya memasang tautan yang ke-enam maka posisinya akan berada di bawah baris menu navigasi tersebut seperti yang terlihat pada gambar di bawah ini.

Tampilan menu navigasi sebelum diubah lebarnya.

Nah, agar tautan menu yang ke-enam dapat berada di sebelah tautan yang ke-lima, seperti yang terlihat pada gambar di bawah ini, maka kita perlu mengubah lebar dari menu navigasi tersebut.

Tampilan menu navigasi setelah diubah lebarnya.

Bagaimana cara untuk mengubah lebar dari menu navigasi tersebut? Silakan simak langkah-langkahnya di bawah ini.

1. Masuk ke akun Blogger Anda.

2. Klik Rancangan > Edit HTML.

3. Klik Download Template Lengkap untuk membuat salinan template. Hal ini untuk berjaga-jaga kalau nanti terjadi kesalahan kita sudah mempunyai back-up-nya.

4. Cari kode seperti di bawah ini. Gunakan fungsi pencarian dengan menekan tombol Ctrl + F lalu masukkan kata kunci #menu ul {.

#menu ul {
border-left:1px solid #DDDDDD;
float:left;
font-family:'Segoe UI', Calibri, 'Myriad Pro', Myriad, 'Trebuchet MS', Helvetica, sans-serif;
list-style-type:none;
margin:0;
padding:0;
width:630px;
}

5. Ganti lebarnya, yaitu 630px menjadi 900px (sesuai lebar wrapper) sehingga hasilnya menjadi seperti di bawah ini.

#menu ul {
border-left:1px solid #DDDDDD;
float:left;
font-family:'Segoe UI', Calibri, 'Myriad Pro', Myriad, 'Trebuchet MS', Helvetica, sans-serif;
list-style-type:none;
margin:0;
padding:0;
width:900px;
}

6. Klik tombol SIMPAN TEMPLATE.

7. Selesai.

Selasa, 20 Desember 2011

Cara Mudah Menambahkan Scroll pada Komentar Blog

Jumlah komentar pada suatu artikel blog yang telah mencapai puluhan membuat tampilan memanjang ke bawah. Hal ini dapat membuat pengunjung berikutnya yang ingin memberikan komentar harus menggulung deretan komentar tersebut terlebih dahulu untuk menemukan kotak komentar. Bila tersedia link yang langsung mengantarkan pengunjung ke kotak komentar maka hal ini tidak begitu menjadi masalah. Namun, bila tidak tersedia link tersebut kita dapat menambahkan scroll atau penggulung pada kolom komentar tersebut. Selain dapat memudahkan pengunjung, adanya scroll ini juga bisa membuat blog terlihat simpel.

Kolom komentar dengan scroll.

Untuk menambahkan scroll pada komentar, kita dapat menggunakan kode CSS tertentu. Langkah-langkahnya dapat disimak di bawah ini.

1. Masuk ke akun Blogger Anda.

2. Klik Rancangan > Edit HTML.

3. Klik Download Template Lengkap untuk membuat salinan template.

4. Cari kode untuk komentar yang biasanya ditandai dengan #comments-block{. Gunakan tombol Ctrl + F untuk memudahkan pencarian. Contoh kode lengkapnya seperti di bawah ini:

#comments-block{border:0px dotted #ccc;width:569px;margin:1.3em 0 1.5em;line-height:1.6em}

5. Kemudian hapus kode border:0px dotted #ccc; dan tambahkan kode max-height:300px;border:1px solid #eee;overflow:auto; sehingga hasilnya seperti di bawah ini:

#comments-block{max-height:300px;border:1px solid #eee;overflow:auto;width:569px;margin:1.3em 0 1.5em;line-height:1.6em}

Tinggi scroll adalah 300 px, tebal border 1 px, gaya border solid dan warna border #eee, poin-poin ini dapat diganti sesuai selera Anda.

6. Klik tombol SIMPAN TEMPLATE.

Selasa, 06 Desember 2011

Cara Membuat Tombol Share Hanya Muncul di Halaman Posting

S
ebelumnya telah dibahas mengenai pemasangan share button atau tombol berbagi dari AddThis pada bagian bawah postingan. Silakan klik di sini untuk membaca posting tersebut. Ternyata setelah dipasang, tombol berbagi ini tidak hanya muncul pada halaman posting tetapi juga akan tampil pada halaman beranda atau home page. Hal ini berpotensi memperlambat loading saat membuka halaman beranda blog.

Nah, agar loading halaman beranda tidak terasa berat, kita dapat membuat tombol berbagi dari AddThis ini tampil atau muncul hanya pada halaman posting saja. Caranya bisa dilihat pada langkah-langkah di bawah ini. Namun, sebelum mengikuti cara ini, pastikan Anda telah memasang tombol share dari AddThis ini terlebih dahulu.

1. Masuk ke akun Blogger Anda.

2. Setelah berada di Dasbor, klik Rancangan >> Edit HTML.

3. Klik Download Template Lengkap untuk membuat salinan template.

4. Beri tanda centang pada Expand Template Widget.

5. Cari widget id untuk tombol share AddThis ini. Berikut cara mudah untuk menemukan widget id tersebut:
Pertama, masuk ke halaman Rancangan >> Elemen Laman. Kemudian klik Edit pada box widget AddThis yang terletak di bawah posting.


Kemudian akan muncul jendela Mengonfigurasi HTML/JavaScript. Silakan maximize jendela tersebut untuk melihat URL lengkap pada address bar. Lalu perhatikan pada bagian ujung dari URL widget tersebut maka Anda akan menemukan widget id dari tombol share AddThis ini.


Sekarang kita sudah menemukan kalau widget id tombol share AddThis adalah HTML1. Nantinya, widget id tombol berbagi ini akan berbeda-beda sesuai dengan keadaan template blog masing-masing. Selanjutnya cari widget id untuk widget ini dengan cara tekan Ctrl + F lalu masukan kata kunci widget id='HTML1' maka Anda akan menemukan kode seperti di bawah ini:

<b:widget id='HTML1' locked='false' title='' type='HTML'>
<b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:includable>
</b:widget>

6. Tambahkan kode <b:if cond='data:blog.pageType == &quot;item&quot;'> di bawah kode <b:includable id='main'> dan kode </b:if> di atas kode </b:includable> sehingga hasilnya akan tampak seperti di bawah ini.

<b:widget id='HTML1' locked='false' title='' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>

  <b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

7. Klik tombol SIMPAN TEMPLATE.

8. Selesai.

Senin, 05 Desember 2011

Beberapa Istilah Seputar Dunia Internet

Benchmark
Jenis pengujian untuk mengukur kemampuan software/hardware yang dimiliki oleh ponsel tertentu.
Bug
Istilah untuk suatu cacat/kesalahan pada sofware atau hardware yang membuatnya tidak dapat berfungsi sebagaimana mestinya. Proses untuk mengatasi adanya cacat/bug disebut sebagai debbunging.

Banner
adalah media informasi dalam bentuk image/gambar untuk menayangkan iklan bergambar pada sebuah halaman webpage.
Hosting
Istilah untuk jasa penyewaan server internet untuk keperluan website dan email. Pengguna umum menyewa jasa hosting dan mendapatkan account hosting serta dapat mengupload file-file website yang kemudian nanti dapat dilihat oleh pengunjung website.
Kbps
Dihitung dalam satuan Kilobits per second adalah ukuran kecepatan trasmisi sinyal digital yang dinyatakan dalam ribuan bit per detik.
PHP
singkatan dari Programming Hypertext Processor, adalah sebuah bahasa pemrograman yang didesain untuk menciptakan halaman web yang bergerak.
RAS
adalah singkatan dari Remote Access Service adalah paduan perangkat keras dan perangkat lunak yang memungkinkan akses jarak jauh terhadap alat atau informasi yang tersimpan di jaringan perangkat. Server RAS adalah komputer khusus yang menggabungkan berbagai saluran komunikasi.

Search Engine
adalah sebuah program/mesin pencari di internet (website tertentu) yang digunakan untuk mencari informasi yang diperlukan oleh pengguna. Misal: Google, Yahoo, Lycos, Bing, dan lainnya.
Shareware
Software yang diedarkan secara gratis/free untuk dapat dicoba oleh calon pengguna selama jangka waktu tertentu. Apabila calon pengguna tertarik, maka dapat membeli versi komersial.
SLI
kepanjangan dari Sambungan Langsung Internasional adalah layanan yang memungkinkan pelanggan melakukan panggilan internasional tanpa bantuan atau campur tangan operator dari suatu terminal telepon.
Spam
suatu praktek pengiriman pesan komersial atau iklan kepada sejumlah besar news group atau email yang sebetulnya tidak berkeinginan atau tidak tertarik menerima pesan tersebut.
TCP/IP
singkatan dari Transmission Control Protocol/Internet Protocol. Satu set protokol standar yang digunakan untuk menghubungkan jaringan komputer dan mengamati lalu lintas dalam jaringan.
URL
akronim dari Uniform Resource Locator. URL mencakup nama domain dan protokol yang digunakan. Contoh URL adalah http://www.yahoo.com atau www.tabloidpulsa.co.id

Sumber: Tabloid PULSA Edisi 220 Th IX / 2011 / 2 - 15 November