Navbar Transparent ? So what gitu lho

Sebenarnya boogle sudah tahu new navbar yang mendukung transparent ini tiga hari sebelum ada pengumuman dari blogger buzz. Tapi saya memaklumi-nya jika blogger buzz sebagai corong atau situs humas –nya blogger untuk menunggu pengumuman update tentang navbar transparent ini sebelum lolos dari hasil pengujian dan kelayakan, sama persis seperti kita-kita yang suka menulis tentang tutorial blog untuk mengguji dulu trik, tip , javascript dan lain-lain sebelum kita publis untuk di sharing.

Dengan navbar yang mendukung transparent, dan sebelumnya menambahkan beberapa tool untuk kemudahan share atau follow, nampaknya pihak blogger sangat serius agar new navbar ini dapat di gunakan oleh para pengguna-nya bukan di hilangkan atau di sembunyikan, walaupun masih dalam batas demokratis alias tidak memaksakan dan pilihan tergantung kepada kita sebagai pengguna.

Yang menarik dengan adanya transparent ini, kita dapat menganti-ganti tema warna navbar sesuai dengan pilihan warna yang kita inginkan ,- menjadi warna campuran antara warna navbar dan warna background template . misalkan warna merah menyala dengan background template hitam akan menjadi merah maroon, warna kuning akan menjadi kuning ke hijau hijauan dan seterus-nya.

Caranya ente edit dulu navbar –nya dan pilih transparent dark atau transparent white, setelah itu tambahkan script css berikut ini.

#navbar-iframe {
  background:red;
}

* Simpan kode di atas pada halam Css – atau simpan sebelum tag ]]></b:skin>

* ganti red dengan warna yang ente inginkan.

Beberapa Tehnik Jadul Seputar Navbar

Heheheh.. mumpung nulis tentang navbar, boogle akan tambahkan beberapa teknik jadul seputar navbar

Pertama : Teknik untuk menghilangkan navbar pada template.

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}

* Simpan kode di atas pada halaman Css, - atau simpan sebelum tag  ]]></b:skin>

Kedua : Teknik auto hide – atau teknik menampilkan dan menyembuyikan navbar memangfaatkan kursor mouse

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}

* Simpan kode di atas pada halam Css – atau simpan sebelum tag ]]></b:skin>

Ketiga : Teknik untuk mengatur lebar navbar. – ini jika diperlukan untuk menyesuaikan dengan lebar template

#navbar-iframe {
width:900px;margin:0 auto;
}

* Simpan kode di atas pada halam Css – atau simpan sebelum tag ]]></b:skin>

* width:900px dapat ente ganti sesuai dengan lebar yang ingin digunakan

* dapat di kombinasikn dengan teknik auto hide.

So What

Dengan penambahan transparent ini dan penambahan fungsi lainnya, menurut penilaian subyektif saya tetap masih kurang bagus jika di bandingkan dengan navbar yang di miliki facebook misalnya. Seharusnya pihak blogger dengan dukungan penuh dari google menurut saya lebih baik memikirkan dan membuat sesuatu yang lebih besar dari sekedar update navbar. contohnya membuat … ???? :D  

[..]

Update kode verifikasi di webmaster tool

Hehehe.. kalau ngomongin google dance ( update rank ) seru sekali euy. Boogle baca pada beberapa postingan teman-teman banyak yang gembira dengan update sekarang ini. Walaupun ada beberapa yang nangis karena page rank na jatuh.

Seperti yang dialami oleh blog kembaran boogle, awalnya PR3 kemudian bulan kemarin terpeleset ke PR0, namun update sekarang dancing ke PR2. pada hal selama satu bulan ini blog tersebut cuman update tiga postingan, itu pun dua postingan isinya iklan doank. – aneh sampai sekarang boogle belum menggerti hitungan algoritmanya.

And kebetulan juga teman boogle Herdiansyah via form commnent, ngasih tahu juga tentang update rank ini.

Update kode Verifikasi

Aniway, ngomong-ngomong tentang update sebenarnya kode verifkasi untuk blog kita di webmaster tool telah lama di update atau berubah. kalau dulu kita menerima kode verifikasi-nya seperti ini.

contoh code verifikasi lama

<meta content='71K2F4EWJR+9cYh022glOhsOikaRCbcDFXmBi2jaU2w=' name='verify-v1'/>

Sekarang kode verifikasi-nya seperti ini

contoh code verifikasi sekarang

<meta content='CoJiN2yNDcUYTdlbK-iOBhhyjSjKdWuCMmVu3D4viwc' name='google-site-verification'/>

Apakah perubahan ini berpengaruh terhadap search index, seo atau feed ?

Sampai saat ini saya belum mendapatkan informasi detail tentang perubahan kode verifikasi ini. Namun biasanya pada sebuah software dst, update di adakan selain menutup bug pada versi sebelumnya, biasanya update merupakan penambahan tool dan fungsi.

Saya sendiri sih untuk blog-blog yang baru sudah menggunakan new kode verikasi, tapi untuk yang sudah berkarat seperti blog ini saya masih menggunakan verifikasi yang lama, – mungkin sambil lihat-lihat secara trial and error atau sampai ada informasi yang detail tentang fungsi update verifikasi ini. Atau ente punya informasi update ini ??

[..]

Menyembunyikan Gadget Followers Pada Halaman Depan

Yup, untuk ketiga kalinya boogle akan menjawab pertanyaan seorang teman via form comment. Pertanyaan berhubungan dengan gadget followers yang ingin di sembunyikan pada halaman depan blog ( from page or home page ).

Hmmm, gitu ya kang..??
Cuma, kalo nyembunyiin gadget followers di home page kok kayak'x susah yah...
Kemaren tak ubrek2 gak bisa2

Sebenarnya tentang trik petak umpat ini secara garis besar sudah saya jelaskan pada postingan “ membuat page dinamis “. Tapi tak ada salahnya saya jelaskan lagi terutama untuk kasus tertentu, seperti menyembunyikan gadget followers, adsense dan gadget lain-nya.

Untuk menyembunyikan gadget Followers pada home page

Simpan script ini, setelah tag ]]></b:skin>

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<style>
#Followers1 {display:none;}
</style>
</b:if>

Keterangan;

a.Script di atas menyembunyikan gadget followers pada halaman depan dan indek label.

b.Secara default gadget ini di beri id Followers1. Namun untuk memastikan bisa di cek menggunakan pencarian Ctrl+F >> Followers

c.Cara ini bisa ente gunakan untuk gadget lainnya, seperti ; gadget Html, Adsense dll.

Followers Via Dasboard Page Elements Vs Google Friendconnect

Selain gadget Follower bisa kita dapatkan via page elements sebenarnya ada cara lain untuk mendapatkan gadget ini yaitu via google friendconnect.

dan Saran boogle sih untuk menggunakan gadget followers lebih baik memangfaatkan yang ada di google friendconnect, karena salah satu kelebihanya kita dapat menggatur baris followers –nya  sesuai dengan keingina kita. – misalkan jika terlalu memberatkan kita dapat menampilkan baris followernya hanya dua baris saja. Setelah itu copy kode html –nya dan salin ke gadget Html/javascript.

Tentu saja untuk menyembunyikan pada halaman depan ( home page ), bukan lagi #Followers1 tapi Html yang id –nya dapat di cari menggunakan CTRL+F >> Html ( kode followers ).

 

 

[..]

Pasang script Page views this post

Ehmm.. boogle jawab lagi satu petanyaan yang masuk, kali ini tentang script untuk mengetahui berapa banyak sih sebenarnya jumlah pembaca pada artikel atau postingan yang kita tulis. [ dapat ente lihat pada akhir tulisan ini “ page views this post “ . red ] .

gini pertanyaanya;

yang bikin penasarannya tulisan "Page views this post: 97 reader" wkwkwkwk...gimana tuh caranya? dah kaya wp aja.

Tentang script ini saya di beritahu link tutorialnya saat Gtalk bersama Abu Farhan, malahan untuk host databasenya saya nebeng di server miliknya.. hehehe thank buanyak buat Abu Farhan.

Jika ente ingin pasang script untuk mengetahui jumlah pembaca pada artikel yang ente posting, silahkan saja melacur… eh salah … meluncur pada empunya yang bikin script di atas, ini link na gan - blogger-post-page-views-hit-counter .

Untuk pasangnya gampang kok karena sudah di beri keterangan yang jelas-jelasnya. sedangkan untuk yang punya server sendiri dan mendukung php sama mysql, lebih baik script nya pindahin ke server sendiri saja.

yuuuu..

 

[..]

Bagaimana cara Menyembunyikan gadget atau widget pada postingan tertentu

Ini ada pertanyaan dari teman kita yang sedang ikutan kontes. Bagaimana caranya agar kita bisa menyembunyikan gadget atau sidebar pada postingan / artikel tertentu.

… Maksudnya bagaimana ngilangin sidebar dihalaman postingan tertentu yakni agar ukuran kbnya gak lebih dari 100kb.pusing2 googling surfing di google eh gak ada euy tutorialnya buat nyembunyiin sidebar di halaman tertentu saja….

Caranya kenali dulu gadget / widget apa yang ingin dihilangkan. dan asal tahu saja setiap kita menambahkan gadget / widget mempunyai nama yang unik.

misal untuk html / javascript ; HTML1, HTML2, HTML3 dst. untuk label;Label1,Label2 dst.  begitu juga untuk gadget / widget yang lainnya.

Ok. Selanjutnya simpan kode ini sebelum tag </head>

<b:if cond='data:blog.url == &quot;http://max-chip.blogspot.com/2009/10/indonesia-dalam-berita.html&quot;'>
<style>
#HTML2 {display:none;}
</style>
</b:if>

* Ganti url “ http://max-chip.blogspot.com/2009/10/indonesia-dalam-berita.html “ dgn posts kontes seo ente.

* Ganti #HTML2 dengan gadget / widget yang ingin di sembuyikan.

* Jika banyak gadget / widget yang ingin di sembuyikan jadinya seperti ini >> misal ; #HTML1, #Label1, #Followers1 {display:none}

* Begitu juga jika ingin menyembunyikan sidebarnya sekaligus.

* Trik ini bisa ente kembangkan lebih lanjut, misal untuk menambah ukuran main-wrapper dan sidebar-wrapper, menambah warna sidebar , menyembunyikan kotak komentar dll pada postingan tertentu. ( baca lebih lanjut ; page dinamis )

 

 

[..]

Labs Fitur baru di webmaster tool

Dua hari kemarin Webmaster tool meluncur sebuah eksperimen fitur baru yang layak untuk saudara cek. yang pertama ; Fetch as Googlebot . kedua ; Malware Detail . kedua fitur tersebut dapat kita temukan pada menu " Labs ". Walaupun sejauh ini hanya ada dua fitur, namun saat saya coba lumayan juga untuk mengetahui bagaimana googlebot mengambil data dan waktu download halaman blog kita ( seperti blog ini lama juga untuk di download-nya ..red ). Juga yang tak kalah menarik malware detail yang akan memberitahu jika Googlebot telah mendeteksi malware apapun di blog kita. Setidaknya dengan kedua fitur tersebut kita tidak perlu repot dan jauh-jauh menggunakan jasa pihak ketiga. Dan mudah-mudahan saja fiturnya bertambah di kemudian hari. Untuk mencoba kedua fitur tersebut silahkan lihat di webmaster tool. Jika blog saudara belum terdaftar di webmaster tool, bisa baca dulu tulisan " mendaftarkan blog ke google "

[..]

Bermain-Main Permalink di blogger yuk

Yup boogle lanjut. soalnya mungpung masih bersemangat.. heuehueu… kalau di endapkan nanti idenya takut hilang :D. apalagi untuk nulisnya jika menunggu waktu mungkin sudah tidak bersemangat lagi.. heuehueu

Kali ini boogle akan curhat tentang Permalink.

Apaaaan tuh Permalink

Permalink merupakan singkatan dari Permanent Link.Yaitu alamat url yang merujuk ke halaman postingan.Dengan adanya permalink maka browser bisa menavigasi kepada postingan kita, begitu juga mesin pencari seperti google dan nyahoo menggunakan permalink untuk mengkategorikan postingan.

Blogger yang kita gunakan secara otomatis menghasilkan permalink berdasarkan judul postingan.

Namun pembahasan permalink vesi blogger ini tidak seheboh seperti di wordpress. karena di wordpress permalink bisa di customisasi, sedang di blogger permalink –nya tetap saja sesuai dengan judul postingan waktu pertama kali di terbitkan, walapun judulnya kita ganti beberapa kali pun.

Contoh Judul artikel ini adalah

Bermain-main Permalink di Blogger Yuk

Sedangkan Permalink nya.

Permalink Versi Blogger

http://catalog-tutorial.blogspot.com/2009/10/permalink-versi-blogger.html

Mau bukti !. coba lihat pada status addres bar

( bandingkan dengan judul sekarang )

 

Kita pun bisa bermain-main permalink seperti ini.

Judul pertama ( permalink )

Inul dan Dewi Persik Saling Caci

Setelah kita terbitkan ( publish ), kemudian kita ganti judulnya sesuai dengan tema artikel kita misalkan.

Merawat Gigi Yang Benar Sesuai Rekomendasi Dokter

.

wkwkwkw.. apa ini termasuk nyepam sama Om google yach ?

Note : Agar ngefek permalink –nya mungkin butuh interval waktu, setelah googlebot berkunjung misalnya, atau satu bulan ( itu juga kemungkinan sih.. red ).

Kesimpulan Boogle

Benarkah yang di list dalam search google, yahoo dll adalah permalink?

Walaupun di luaran banyak yang berbicara seperti itu , namun boogle sendiri belum mencoba untuk membuktikanya.

Namun intinya menurut boogle, rencanakanlah yang lebih mendalam dan hati-hati untuk membuat judul artikel sebelum di terbitkan, jika banyak waktu luang lakukan survei melalui kotak serach engine . Dan usahakan judul artikel sebagai permalink tidak lebih dari 35 atau 40 karakter. Karena judul yang ringkas dan padat menurut gosip sangat Seo Frendly.

Contoh Permalink yang Buruk ( tulisan boogle sendiri red ).

Bagaimana Menambah Avatar Comment Bagi Template Non Standar

di address bar-nya tulisanya menjadi terputus. ( lihat terpotong sampai “ Bagi”.)

http://catalog-tutorial.blogspot.com/2009/09/bagaimana-menambah-avatar-comment-bagi.html

Seharusnya untuk permalink

Menambah Avatar Comment

 

[..]

Sidewiki Antara Informasi Komentar Dan Nyampah

Setelah lebaran kemarin sampai sekarang, saya lihat Om google rajin men-update beberapa fitur dalam search engine nya, seperti Jump to Infomation, Quickly view formatted PDFs dll. Sedangkan untuk piranti lunaknya  mengembangkan Picassa versi 3.5 yang bisa mengindentifikasi atau mengenali wajah hanya dengan menambah tag atau label pada photo seseorang,dan juga piranti Google toolbar versi ter baru yang di tambahkan alat penterjemah dan Sidewiki.

Lima hari yang lalu boogle pun mencoba Google Toolbar ini, yang menjadi penasaran boogle karena dalam toolbar tersebut ada  Sidewiki. suatu tool yang memungkin boogle bisa meninggalkan komentar pada setiap web/blog yang boogle kunjungi. Dan komentar boogle tersebut akan terlihat oleh sesama pengguna Sidewiki yang sedang berselancar, ujung-ujung nya bisa saling ber-komentar. Interaksi semacam ini hampir mirip bentuknya dengan model situs jejaring sosial seperti facebook atau layak-nya ber-twitter ria bersama teman dalam satu topik.

Komentar Atau Nyampah.

Membaca dari berbagai sumber, kehadiran sidewiki ini menurut boogle pribadi sangat bermangfaat terutama selain membuat pengalaman berinternet semakin interaktif, boogle pun bisa mengetahui sebuah topik lebih dalam lagi, bahkan bisa melihat sebuah topik dari sudut yang berbeda.

Namun karena piranti ini bebas nilai atau ibarat-nya pisau bermata dua, maka sidewiki ini dapat di gunakan hal-hal yang tidak terpuji atau dekonstruktif bagi pemilik situs, karena bisa saja komentar yang ada di sidewiki  dapat membuat visitor enggan membeli produk, jasa atau tulisan pada web/blog yang kita miliki. Apalagi bila lahan komentar ini di mangfaatkan hanya untuk nyampah iklan ( kelakuan siapa tuh ayo ngaku..heuehuehueu.. )

Karena seperti keterangan om google komentar yang ada di sidewiki dapat memberikan kontribusi informasi mendalam terhadap situs yang bersangkutan. artinya apalagi kalau bukan tentang SERP ( search engine results page )

Posts to Blogger Lewat Sidewiki.

Untuk para pengguna blogspot seperti boogle dapat juga memangfaatkan sidewiki ini untuk membuat postingan cara-nya pun sangat gampang, Setelah kita menulis pada editor yang tersedia, kemudian buka saja link My Blog on Blogger dan pilih salah satu atau lebih blog mana saja yang akan kita update posts. dan Publish.

Google Toolbar.

Untuk mendownload atau meng-install google toolbar, saudara bisa mengunjungi situs Google.com/sidewiki. Toolbar ini sudah merupakan Add-ons FireFox.

Dan perlu teman-teman ketahui , untuk memangfaatkan Sidewiki ini, anda harus mempunyai atau membuat Profile Google Anda.

Note:

Jika ingin lebih tahu lagi tentang Sidewiki ini, saudara bisa kunjungi di google.sidewiki atau lebih lanjut di  bantuan sidewiki

[..]

Bagaimana Solusi Untuk Merapikan Halaman Page elements

Ini sering boogle alami saat menambah atau mengubah ukuran kolom template, Walaupun pada antar muka-nya saat di preview atau di render ke berbagai browser keliatan mulus tampa cela sedikit pun, Namun pada halaman Page elements-nya (Elemen Halaman) justru kedapatan berantakan, kolom sidebar melorot ke bawah, antar kolom saling tumpang tindih atau tab page elements-nya terpenggal sepotong.

 

Pernakah saudara mengalami seperti pengalaman boogle ? lalu solusi apa yang biasanya saudara lakukan ?

Sedikit Curhat dari pengalaman

Otre, ini sedikit tip atau curhat dari pengalaman boogle mudah-mudahan dapat membantu teman-teman yang belum paham cara merapikan kolom pada halaman Page Elements-nya.

Petama:

kenali dulu struktur atau basis untuk kolom. dalam minima template secara garis besar ada 4 ( empat ) kolom.

1. Header-Wrapper
2. Main-Wrapper
3. Sidebar-Wrapper
4. Footer

* Note atau untuk div id lainya.

Kedua :

Setelah mengetahui basis kolom di atas. kita tinggal menambah kode yang hanya mengatur pada halaman Page Elements, biasanya kode tersebut boogle simpan tepat di atas tag ]]></b:skin>:

seperti ini.

body#layout #main-wrapper
{ width:300px}
or
Body#layout #Sidebar-Wrapper
{width:200px}

Kadang kalau berantakan bangeut, sering juga memainkan property “float”.

Sedangkan untuk menghilangkan Gadget yang secara otomatis ada pada Page Elements ( Elemen Halaman ) seperti ini.

 

Penambahan-nya seperti ini..

Body#layout #tulis id-nya {display:none}

display:none = merupakan property+value untuk menon-aktifkan tampilan sebuah id or class

 

Sekian dulu curhatan dari  boogle, kalau ada trik atau cara yang lain untuk artikel di atas, bisa saudara diskusikan di sini.

 

[..]

Membuat Text Style Untuk Judul Blog or Header

Tulisan ini sebenarnya merupakan tanggapan salah satu rekan boogle yang request tentang membuat tulisan judul blog atau header seperti yang terlihat di www.jaloee.blogspot.com. atau saudara bisa lihat pada screenshot di bawah ini.

Kalau menggunakan program grafis seperti photoshop untuk membuat text seperti gambar di atas sangatlah mudah, Namun pada blog jaloee tersebut boogle menggunakan sedikit trik . Keuntunganya tentu saja lebih ringan waktu tunggu loding-nya jika di bandingkan menggunakan sebuah gambar.

Beginilah Caranya

Untuk keamanan backup dulu source templatenya.

1. pilih tab Edit Html kemudian centang/cek tulisan “Expand Widget Templates”.

2. Setelah itu cari kode #Header H1 ( heading 1 ) seperti berikut.

#header h1 {
  font-size:……..
  dan el-el
}

3 Kemudian ganti dengan kode ini.

#header p {margin:3px 0 20px}
#header h1 {
font: bold 1.75em "Trebuchet MS", Arial, Helvetica, sans-serif;
letter-spacing: -1px; padding: 2px 0 0 0px;
margin: 0; background: inherit;
}
h1 .red{ color: #DF5900;background: inherit;}

*note : tentu saja sesuaikan ukuran font, warna dan margin-nya menurut selera anda.

4. Kemudian cari html berikut

<div id='header-inner'>
<div class='titlewrapper'>
<h1 class='title'>
<b:include name='title'/>
</h1>
</div>
<b:include name='description'/>
</div>

5. Setelah itu ganti dengan kode berikut..

<div id='header-inner'>
<div class='logo'>
        <h1><a href='http://www.jaloee.blogspot.com/' title='The best tutorial photoshop on the net!'>Beloon <span class='red'>Online</span>^{3eX edition}</a></h1>
            <p>What shall your read and think today?</p>
      </div>
</div>

* Note : Ganti tulisan berwarna dengan url (alamat blog)  dan slogan blog saudara.

Akhirnya

Setiap template mungkin memuat kode yang berbeda-beda, tapi jika saudara jeli dan teliti, boogle yakin anda dapat melakukanya. Kreatifitas dan inprovisasi anda itu yang paling utama.

[..]