Tutorial Blog Membuat Search Form atau Kotak Pencarian Sederhana untuk Blogspot

Tutorial Blog Membuat Search Form atau Kotak Pencarian Sederhana untuk Blogspot dan menghubungkan link search dengan search form nya.

Terasa janggal memang kalo dalam sebuah blog tidak ada search form atau kotak pencariannya.Selain memberikan kesan profesional juga untuk melengkapi penampilan blog kita.

Saya pernah membaca artikel tentang pembuatan search form seperti ini,dan pertanyaan audiens ttg bagaiman menghubungkan search form dgn link searchnya,tidak ditanggapi dengan serius.

Nah untuk itulah Tutorial saya kali ini adalah membuat search form atau kotak pencarian yg sederhana dan bagaimana menghubungkan search form dengan link searchnya.

Saya mulai dengan membuat kode seperti ini

<form  id='searchblog' method='get'>
<input  name='q' placeholder='Cari Artikel Disini...' type='text'/>
<input id='search-button-top'  type='submit' value='Pencarian'/></form>


Setelah saya save.maka hasilnya adalah sepert ini

Jelas search form tersebut belum bisa berfungsi mencari artikel link blog.

Supaya search form tersebut berfungsi mencari artikel saya masukan deklarasi seperti ini.

<form  action='/search' id='searchblog' method='get'>

Saya save lagi dan hasilnya sudah bisa mencari artikel meski masih standard dan belum seperti yg saya inginkan.

Kemudian saya coba menambahi style pada search form itu dengan deklarasi seperti ini

 <input Style='height:38px;width:250px;margin-top:1px;margin-right:-4px;font-size:18px;font-family:Ubuntu;' name='q' placeholder='Cari Artikel Disini...' type='text'/>
<input id='search-button-top' style='font-family:Ubuntu;width:110px;height:38px;background:#955f2a;color:#fff;font-size:18px;' type='submit' value='Pencarian'/>

Maka hasilnya adalah seperti search form punya saya yg diatas itu.
Jadi lengkapnya deklarasi search form punya saya itu adalah

<form action='/search' id='searchblog' method='get'>
<input Style='height:38px;width:250px;margin-top:1px;margin-right:-4px;font-size:18px;font-family:Ubuntu;' name='q' placeholder='Cari Artikel Disini...' type='text'/>
<input id='search-button-top' style='font-family:Ubuntu;width:110px;height:38px;background:#955f2a;color:#fff;font-size:18px;' type='submit' value='Pencarian'/></form>

Nah buat soblog yg memerlukan search form sederhana seperti punya saya,silahkan di copy dan dipake...
Untuk penempatannya terserah silahkan sesuaikan tinggi dan lebar nya.

Demikian tutorial blog saya kali ini.Selamat berkreasi dan salam sukses.

Selengkapnya

Puisi Diseberang Pelataran

Diseberang pelataran

Kau berdiri angkuh

Tanganmu mengepal nasib

Hampir tak ada senyum dan lagu

Apalagi puisi itu 

Telah kau lempar dalam dalam

Hingga tangisan yg biasa merdu

Kini terdengar seperti derit roda kereta yg lapuk.

Dan senyum kecut sisais.

Menarik beribu beban sayuran .

Kotoran kuda

Kita adalah sama.

Diantara derap langkahnya.

Aku dan gilaku adalah satu.Tak beda.Kau dan angkuhmu.Tak lain

"Meski aku masih dibalut sangsi.

Diapit Riuh derapmu hentakkan pagi

Sumbu yg pudar

Nyala pelita jiwa tercemar

Malamku robek misteri.

Kupagut kau dalam sunyi

Sedang angkuhmu kugauli

Basah lidahku mengecup manismu

Tak sabar ingin kutuntaskan nikmatku

Dan yang kutau

Begitu indahnya rupamu.

Seperti sunyi yg kupuja

Atau puisi yg kueja.

8 april 2016.

Selengkapnya

Tutorial Blog Membuat Template Blogspot Sederhana

Assalamualaikum.
Perkenalkan saya Yusrian ARP.

Disaat waktu luang,saya suka sekali blogging dan memperhatikan bagaimana sebuah template blogspot itu tercipta.

Menurut para pakar yg ahli dlm pembuatan template blogspot.
Template blogspot itu terdiri dari 4 bagian utama yaitu :
1.Header,sebagai tempat judul dan deskripsi sebuah blog.
2.Main,sebagai tempat posting atau artikel.
3.Sidebar,sebagai tempat widget,disamping Posting atau Artikel.
4.footer,biasanya digunakan sebagai tempat copyright atau info tentang template    dan sipembuat template.

Perhatikan gambar diatas.Kira kira begitulah gambaran sebuah template sederhana yg ingin saya buat.

Okk..
Yg pertama kita lakukan adalah login pd http://draft.blogger.com/home.Tentunya dengan akun gmail.Sudah punya akun gmail belum?...Kalo belum,bikin dulu di Gmail.
Kemudian pilih menu template,klik edit html.

Wooow....Banyak sekali deklarasi atau kode kode html yg ada di dlm sebuah template blogspot bukan?..Saya waktu pertama kali, memperhatikan koding koding tersebut,juga bingung.Dan tak tahu apa arti dari deklarasi deklarasi tersebut.

Kalo sobat blogger sudah yakin dan pengen membuat template sendiri seperti template sederhana saya ini,yuuk ikutin langkah langkahnya lagi

Sebaiknya sobat blogger copy dulu templatenya yg sedang digunakan,di paste kan ke notepad atau microsoft word.

Hapus semua kode html template yg ada dan mulailah mengetikkan kode kode ini ...

<html>
<head>
<title><data:blog.title/></title>

</head>
<body>

</body>
</html>

Nah...Kalo kode kode diatas itu di save,maka akan muncul eror skin.
Artinya bahwa setiap template blogspot itu harus punya skin.
Maka letakkan kode ini di bawah  </title>

<b:skin><![CDATA[/*
===================
Nama template : Blablala.
Yang Buat         : Nama anda.
tgl hari ini jam sekarang,
perhatian : tolong jgn dihapus
ini bikinan sendiri.
=====================

*//* disini tempat css */
#header-wrapper{}

#outer-wrapper{}
#main-wrapper{}

#sidebar-wrapper{}

#footer{}

]]></b:skin>

Kalo sobat blogger save lagi,maka akan muncul eror section,artinya bahwa template kita belum ada section nya,Buatlah kode seperti ini dan taruh di bawah kode <body>

<b:section class='header' id='header' maxwidget='1' preferred='no'>
<b:widget id='Header1' locked='true' title='Puisi Yusrian (Header)' type='Header' visible='true'/>
</b:section>

Kemudian disave dan....
Taraaa..... Templatenya masih acak acakan,karena belum ada kode css dan html nya..

Untuk selanjutnya sobat blogger bisa lihat tutorial saya yg lain seperti Membuat header blog 2 kolom atau tutorial blog membuat navigasi menu di atas header.

Sekian dari saya dan saya berharap tutorial ini bermanfaat.Selamat berkreasi dan salam sukses.

Selengkapnya

Puisi Malam Ini Langitku Merah

Malam ini berjuta juta setan tertawa dilangit merah
Dalam balutan warna warni darah.
Lalu hinggap kelangit jiwa
Lalu merubah  nalarmu menjadi durja.
Bergandeng egoisme dan penonjolan diri.
Tak peduli diri ini milik siapa.
Tak peduli lunturnya iman didada.

Apakah matamu buta tak melihat cahaya.
Atau langit sudah tak bermakna.
Diburamkan oleh buruknya prasangka.

Malam ini langitku merah.
Gumpalan warna warni darah.
Bukan sebuah hal yg lumrah.
Malah itu keburukan yg paling salah.
Letupan membahana membakar angkasa.
Hanguskan duit dengan percuma.
Dan yg kau dapat ialah sia sia.

Blkppn 1-1-2017

Selengkapnya