Komunikasi Praktis

Blog tentang komunikasi media jurnalistik, menulis, public speaking, pembawa acara mc, siaran radio, presentasi, humas pr, public relations, blogging, podcast

  • HOME
  • Jurnalistik
  • Media
  • Humas
  • Speaking
  • Blogging
    • Templates
    • Tips SEO
    • AdSense
    • Posting
  • Komunikasi
  • About
  • Kontak
  • Sitemap
  • Disclaimer
  • Iklan
Home Kotak Pencarian Kode Kotak Pencarian Sederhana di Sidebar Blog

Kode Kotak Pencarian Sederhana di Sidebar Blog

Romeltea Komunikasi Praktis Romeltea
March 8, 2015
Romeltea Follow @romel_tea
Romeltea

Baca Juga

Kode Kotak Pencarian Sederhana di Sidebar Blog
CARA memasang, menampilkan, atau membuat kotak pencarian (search box) simple di sidebar blog, seperti yang dipasang di blog ini, cukup dengan memasang dua kode: CSS & HTML.

Kotak pencarian wajib ditampilkan di blog atau situ website, guna memudahkan pengunjung mencari informasi yang dibutuhkan.

Pakar usability website di NN Group membahasnya secara detail tentang kegunaan (usability) kotak pencarian ini, berdasarkan hasil riset mereka.

Cara Memasang Kotak Pencarian Sederhana di Sidebar Blog

1. Template > Customize
2. Klik "Advance" > "Add CSS"
3. COPAS kode berikut ini di kolom yang tersedia:

KODE CSS:
.serching{margin-top:10px}.serching form{border:1px solid #ddd;-moz-border-radius:3px;-webkit-border-radius:3px;max-width:310px;font-size:14px}.serching form input{display:block!important;margin:0;border:0;padding:5px 0;outline:0;height:20px;line-height:20px;font-size:13px;border-radius:0!important}.serch{float:left;width:85%!important;text-indent:10px}.serchg{float:right;width:15%!important;height:30px!important;padding:0!important;background:gray;color:#fff;border:0!important;font-size:12px!important}
4. Klik "Apply to Blog"
5. Back to Blogger
6. Layout > Add a Gadget > HTML/JavaScript
7. COPAS kode berikut ini di kolom "Content". Judul kosongkan!

KODE HTML:
<div class='serching'><form action='/search?q='><input class='serch' name='q' placeholder='Cari...' title='Click the form, then type your keyword, then hit enter' type='text'/><button class='serchg' type='submit'> GO </button><span style='clear: both;display:block'/></form></div>

8. Save!

Kini kotak pencarian sederhana, simple, namun elegan, sudah terpasang di sidebar blog Anda. (http://www.komunikasipraktis.com/).*

Thanks for reading Kode Kotak Pencarian Sederhana di Sidebar Blog | Tags: Blogging Desain Blog Komunikasi Blog Kotak Pencarian

Next Article
« Prev Post
Previous Article
Next Post »

Related Posts

Your Comments

2 komentar on Kode Kotak Pencarian Sederhana di Sidebar Blog

  1. Aries AsharryAugust 08, 2015

    Thanks mas gan :)

    ReplyDelete
    Replies
      Reply
  2. AnonymousFebruary 23, 2017

    berkunjung...

    ReplyDelete
    Replies
      Reply
Add comment
Load more...

Subscribe to: Post Comments (Atom)

Recent Posts

Popular Posts

  • Contoh Naskah Pembukaan oleh Pembawa Acara (MC)
  • Cara Menjadi Pembawa Acara (MC) yang Baik
  • Karya Tulis Ilmiah: Pengertian, Karakteristik, dan Jenis-Jenis
  • Contoh Naskah MC (Pemandu Acara) untuk Acara Agustusan
  • Teknik Debat dan Cara Berdebat yang Baik
  • Daftar Kata Baku – Tidak Baku Bahasa Indonesia
  • Pengertian Literasi Secara Bahasa dan Istilah
  • Jurnalisme Kuning Jadi Trend Situs Berita
  • Arti dan Asal-Usul Teks Lorem Ipsum Dolor Sit Amet
  • WhatsApp Makin Menggerus Budaya Menulis

Join us on Facebook

Komunikasi Praktis

Info Bola & MotoGP

Recommended Yeuh!

Hosting Unlimited Indonesia

Categories

Bahasa Bahasa Jurnalistik Bisnis Online Blogging Desain Blog Google Adsense Humas Internet Jurnalistik Jurnalistik Online Komunikasi Media Media Online Pers Presentasi Public Speaking Radio Teknik MC Template Blog Tips SEO

About

Komunikasi Praktis adalah blog tentang keterampilan komunikasi: jurnalistik, media massa, kepenulisan, public speaking, mc, siaran radio, presentasi, humas, public relations, blogging, podcasting, dll.

Web Partners

  • Romeltea Online
  • Romeltea Media
  • Contoh Blog
  • Bandung Aktual
  • Risalah Islam

Newsletter

Berlangganan artikel terbaru dari blog ini langsung via email.

Copyright © Komunikasi Praktis. All rights reserved