Script Random Post with Thumbnail

Dari kemaren pengen banget update postingan. Tapi bingung mau posting apa. Setelah berkelana kesana kemari sambil belajar design template buat blogspot, akhirnya saya menemukan sedikit bahan buat bahasan. Tema yang ingin saya bahas disini adalah tentang Script Random Post with Thumbnail.

Random Post with thumbnail atau gambar ini sebenarnya sudah disediakan oleh blogger dalam bentuk widget. Jika belum tahu widgetnya kalian bisa membaca langsung di Blogger Pluggins dipostingan Random Posts Widget for Blogger with Thumbnails. Namun saya disini tidak membahas tentang widget tersebut. Saya ingin membahas Cara memasang Random post tersebut Tanpa menggunakan Pluggin tapi hanya berupa mentahan scriptnya saja. Dan Bahasan Random Post with Thumbnail sangat banyak di share di google, tapi tidak satu pun yang benar-benar seperti yang saya inginkan.

Seperti kita ketahui bersama widget-widget bawaan blogger ini sudah mempunyai pengaturan default dan script yang digunakan juga All  in One. Sehingga hal ini juga pasti mempengaruhi loading dari blog. Apalagi pengguna dari script yang sama juga pasti tidak sedikit mengingat pertumbuhan dari para blogger baru yang demikian pesat.

Oleh sebab itu disini saya ingin share sebuah script yang bisa anda gunakan hanya di blog anda sendiri.

<script>
var numposts_gal = 1;
var random_posts = true;
</script>
<script src="/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showgalleryposts">
</script>

Keterangan:
var numposts_gal = 1; berfungsi untuk menentukan jumlah posting yang ingin ditampilkan. Ganti angka satu sesuai kebutuhan.
var random_posts = true; berfungsi untuk menampilkan secara acak. Jika ingin mematikan sistem acak, maka anda cukup ganti kata true dengan false

Perlu diketahui jika script tersebut hanya mentahan dan bisa menampilkan gambar dan Judul postingan. Agar bentuk dan tampilannya sesuai keinginan kalian bisa menambahkan CSS sesuai selera.

Melalui postingan ini juga saya ingin sedikit memberikan kritikan atau lebih tepatnya perbandingan dan sedikit penjelasan tentang script-script yang biasa di pakai oleh para designer blogger template untuk mempercantik blog mereka dengan fitur-fitur postingan mereka. Pada dasarnya hampir semua script tersebut berasal dari Blogger Pluggins, Hanya saja mereka biasanya sudah melakukan sedikit modifikasi.

Blogger Pluggins sendiri telah banyak menyediakan fitur-fitur siap pakai, diantaranya Pluggin Popular Post, Recent Post, Random Post, Featured Post, Related Post Dan banyak lagi yang lain. Perlu di ketahui jika  menurut yang saya ketahui setiap script tersebut mempunyai fungsi-fungsi yang berbeda.

Popular Post atau Entri Populer ini sesuai namanya merupakan sebuah fitur yang berfungsi untuk menampilkan Postingan yang paling banyak dibaca atau dilihat.
Recent Post = berfungsi untuk menampilkan artikel-artikel terakhir berdasarkan tanggal posting atau juga Artikel yang di update.
Featured Post berfungsi untuk menampilkan postingan atau artikel berdasarkan label-label khusus.
Related Post berfungsi dan memiliki cara kerja yang hampir sama dengan Featured post. Biasanya Related Post ini dibuat hanya tampil jika kita sudah masuk ke postingan.
Random Post berfungsi untuk menampilkan artikel-artikel secara acak, Baik itu secara keseluruhan maupun berdasarkan label-label tertentu.

Sebagai Contoh hasil dari Script Random Post with Thumbnail ini bisa kalian lihat di bagian footer blog ini. Silakan refresh halaman homepagenya, maka jika kalian perhatikan setiap kali direfresh maka gambar setiap label akan berubah.

Nah..
Jika ada para master-master blogger punya pendapat lain, Mohon di share dikolom komentar dibawah.

Trik Cepat menghilangkan Navbar dan widget bawaan blogger

Salah satu keuntungan dari menggunakan custom template untuk blogger biasanya kita tidak terlalu repot edit sana edit sini dari template yang disediakan. Sebuah custom template juga rata-rata telah dilengkapi dengan berbagai widget dan konten-konten favorite dan disukai oleh para blogger.

Salah satu cirinya lagi adalah telah menghilangnya widget-widget bawaan dari blogger, seperti misalnya navbar bawaan blogger. Tapi tahukah anda jika sebenarnya widget tersebut sebenarnya tidaklah hilang dari template anda. Widget tersebut biasanya hanya disembunyikan oleh designernya.

Coba saja ada masuk ke menu edit html dari dashboard anda. Kemudian cari kode berikut ini.

#navbar atau .navbar

Biasanya kode CSS yang akan mengikuti dari kode tersebut adalah seperti ini:

#navbar {
visibility:hidden;
}

.navbar {
visibility:hidden;
}

#navbar {
display:none
}

.navbar {
display:none
}

Memang betul jika dengan kode tersebut maka Navbar bawaan blogger tersebut akan menjadi hilang atau tersembunyi. Namun bukan berarti navbar bawaan blogger tersebut hilang. Sebagai buktinya adalah jika kita sedikit tahu tentang inspect element atau dilihat dari page sourcenya, sebenarnya widget tersebut masih ada.

Lalu bagaimana caranya agar Navbar dan widget bawaan blogger tersebut benar-benar hilang??
Caranya cukup gampang.

1. Login ke dashboard -> design -> edit html.
2. Cari kode:

 <body>
3. Letakkan kode berikut tepat diatasnya.

<script type="text/javascript">
<![CDATA[
<!--/*<body>*/-->
]]>
</script>

4. Save Template.
Maka kita akan ada pemberitahuan seperti ini. Klik saja hapus atau delete widgets.

Maka widget-widget bawaan dari blogger tersebut akan benar-benar hilang termasuk juga widget bawaan lainnya seperti tanda obeng atau quick edit dan lain sebagainya.

Tambahan:
Jika kita ingin memunculkan kembali widget tersebut, maka kita tinggal hapus kode tersebut. Gampangkan??

Trik dan Kode-kode Untuk Menampilkan dan Menghilangkan Widget Content Blog

Dipostingan kali ini kita akan membahas bagaimana cara menghilangkan dan menampilkan suatu objek diblog. Dalam mendesign sebuat template, Penggunaan Trik dan Kode-kode Untuk Menampilkan dan Menghilangkankan ,atau lebih tepatnya menyembunyikan Widget Content Blog ini sangat diperlukan agar hasil template yang kita buat tidak terlihat monoton. Sebagai contoh adalah widget slider dan salah satu sidebar yang ada pada blog ini. Widget tersebut hanya akan muncul dihalaman utama dan kategori blog dan akan menghilang jika kita masuk kehalaman posting.

Kode-kode Untuk Menampilkan dan Menyembunyikan Widget Content Blog ini biasanya pasti ada ditemplate-template dengan gaya magazine atau majalah. Seperti yang kita ketahui, template blog dengan gaya Magazine Style merupakan salah satu favorit template yang sering di pakai oleh para blogger. Salah satu ciri template blog dengan gaya Magazine Style adalah adanya widget yang muncul lalu menghilang atau awalnya menghilang lalu muncul pada suatu halaman atau postingan blog.

Berikut ini adalah jenis dan fungsi kode untuk mengatur tampilan content blog dari muncul lalu menghilang dan menghilang kemudian muncul. yang bisa Anda terapkan untuk mengatur tampilan widget blog Anda.

1. Hanya pada Halaman Utama Blog

<b:if cond="data:blog.url == data:blog.homepageUrl">

...Konten...

</b:if>

Kode ini berfungsi untuk menampilkan widget blog hanya pada halaman utama blog saja alias akan menghilang ketika kita mengklik Label Post atau membaca postingan secara keseluruhan.

2. Kategori Post dan Single Post

<b:if cond="data:blog.url != data:blog.homepageUrl">

...Konten...

</b:if>

Kode ini berfungsi untuk menampilkan widget blog pada kategori post dan single post (postingan secara keseluruhan).

3. Halama Utama Blog dan Kategori Post

<b:if cond="data:blog.pageType != &quot;item&quot;">

...Konten...

</b:if>

Kode ini berfungsi untuk menampilkan widget blog pada main post dan kategori post dan akan menghilang ketika membaca postingan secara keseluruhan.

4. Single Post atau Halaman Postingan

<b:if cond="data:blog.pageType == &quot;item&quot;">

...Konten...

</b:if>

Kode ini berfungsi untuk menampilkan widget blog hanya pada single post saja atau ketika anda membaca postingan secara keseluruhan dan tidak akan muncul pada main post atau kategori post.

5. Halama Utama Blog dan Kategori Post

<b:if cond="data:blog.pageType == &quot;index&quot;">

...Kontent...

</b:if>

Fungsi kode ini sama dengan fungsi kode pada nomer 3.

6. Menampilan Widget Blog Pada Postingan Tertentu Saja

<b:if cond="data:blog.url == &quot;URL_POST_TERTENTU&quot;">

...Konten...

</b:if>

Kode ini berfungsi untuk menampilkan suatu widget blog hanya pada suatu postingan tertentu.

7. Menyembunyikan Widget Post Pada Postingan Tertentu Saja

<b:if cond='data:blog.url != &quot;URL_POST_TERTENTU&quot;'>

...Konten...

</b:if>

Kode ini merupakan kebalikan dari kode no 6 dimana widget blog akan menghilang dari suatu postingan tertentu dan baru muncul pada postingan yang lain.

Cara penggunaan kode ini sangatlah gampang. Kita cukup menambahkan kode yang kita inginkan kewidget yang ingin kita tampilkan atau sembunyikan.

Untuk penerapan kode-kode diatas ada 2 cara yaitu langsung pada widget dan secara kelompok atau dengan memberikan perintah melalui kode CSS-nya. Namun biasanya, penerapan kode-kode ini melalui CSS hanya di gunakan untuk mengatur komposisi dari suatu kolom widget konten. Misalnya lebar dan posisi widget atau objek berbeda dihalaman utama dan postingan. Mungkin hal ini akan kita bahas di postingan berikutnya.

Mungkin itu saja yang saya tahu tentang Kode-kode Untuk Menampilkan dan Menyembunyikan Widget Content Blog ini. Jika teman-teman punya pendapat atau ilmu yang lain, silakan tinggalkan komentar dan url postingannya dibawah ini. Semoga bermanfaat.

Cara membuat Popular Post dengan Thumbnail Horizontal

Postingan kali ini masih berhubungan dengan beberapa posting sebelumnya. Yaitu masih seputar CSS dan Inspect Element.

Seperti diketahui bersama, dari bawaan blogger sendiri sudah tersedia widget Popular Post sendiri. Tapi kelemahannya, Widget tersebut sudah mempunyai pengaturan default dan hanya tersedia dalam bentuk vertikal, sehingga bentuk dari widget tersebut terlihat monoton dan agak membosankan jika dilihat. Dan yang pasti, jika kita ingin menampilkan Popular Post dengan Thumbnail yang maksimal, posisi yang cocok untuk tempat peletakannya hanya dibagian sidebar saja.

Oleh sebab itu maka saya coba sedikit melakukan uji coba agar widget popular post dengan Thumbnail tersebut bisa dipasang dibagian footer dan dengan posisi horizontal. Demonya ya bisa langsung dilihat di bagian footer blog ini.

Tapi itu juga masih banyak kekurangan. Soalnya untuk postingan yang tidak disertai gambar maka akan terlihat kosong. Ada yang bisa bantu gak ya??

Berikut ini adalah langkah-langkah Untuk Cara membuat Popular Post dengan Thumbnail Horizontal ini,

1. Login ke Dashboard blogger -> Design -> Edit Html. Atau Jika menggunakan fitur yang bahasa indonesia Beranda -> Rancangan -> Edit Html.
2. Cari kode ]]</b:skin>

Kemudian letakkan kode CSS berikut ini di atasnya.

#content-footer{
width:100%;
clear:both
}
#content-footer h2{
color: #333;
text-transform: none;
font-family:  Georgia;
font-size: 16px;
font-weight: 700;
margin-bottom: 0px;
padding: 5px 15px;
}

.bottom-content .PopularPosts ul {
padding: 0;
margin: 0px;
background: #FFF;
overflow:hidden;
}
.bottom-content .PopularPosts ul li {
width: 82px;
padding: 0; margin:0 7px 0;
border: none;
float: left;
list-style: none;
line-height: 1em;
}
.bottom-content .PopularPosts {
background: none!important;
}
.bottom-content .PopularPosts .item-thumbnail img {
width:82px;
height:105px;
padding:0;
}
.bottom-content .PopularPosts .item-title {
padding: 5px 0;
margin:0px 0 10px;
font:bold 11px Georgia;
border-bottom: 1px solid #861519;
clear:both; height: 37px;
overflow: hidden; text-align: center;
}
.bottom-content .PopularPosts .item-title a {
color:#25c;
}
.bottom-content .PopularPosts .item-snippet {
margin:10px 0;
color:#4f4f4f;
}
.bottom-content .section{
margin: 0 5px;
}

3. Berhubung pada template ini widget popular post saya pasang di atas footer maka yang selanjutnya adalah Cari Kode:

<div id="footer-wrapper">

Atau sejenisnya, Kemudian letakkan kode berikut diatasnya.

<div id='content-footer'>
<b:section class='bottom-content' id='widget-footer'>
<b:widget id='PopularPosts1' locked='false' title='Entri Populer' type='PopularPosts'/>
</b:section>
</div>

Untuk pencarian id atau class dari suatu widget ini bisa dibaca dipostingan ini.

4. Save Template.

Jika tidak ada masalah, maka hasilnya kira-kira akan seperti widget popular post dibagian bawah blog ini.

Semoga Bermanfaat..!!

Cara Mengetahui id dan class dari suatu widget atau kolom

Seperti yang kita ketahui bersama, setiap template merupakan sekumpulan dari kolom-kolom. Dimana setiap widget atau kolom atau juga konten area pasti memiliki id tersendiri. Id ini merupakan nama dari widget tersebut seperti halnya header, sidebar, footer dan lain sebagainya. Untuk si pembuat atau designer template tersebut pasti tidak sulit untuk mengubah suatu area baik itu lebar, tinggi posisi dan lain sebagainya dari template tersebut. Namun berbeda halnya dengan kita yang hanya bisa memakai alias menikmati hasilnya.

Nah, permasalahannya disini adalah ketika ada sesuatu yang terlihat agak janggal, kemudian kita ingin memperbaiki dengan mengedit kode CSS-nya, atau kita ingin menambahkan suatu area disekitarnya, maka kita mau atau tidak mau kita harus tahu terlebih dahulu id dari kolom widget yang kita rubah. Id ini sendiri haruslah bersifat unik alias tidak boleh sama. Jadi tidak semua widget itu memiliki nama yang sama. Sehingga ketika sebuah template ini didesign, terutama template yang memiliki banyak kolom maka akan semakin banyak pula id-id yang akan diberikan oleh si designer.

Sebagai contoh misalnya sebuah template yang mempunyai 2 kolom sidebar, maka si designer ini pasti akan memberikan id tersendiri dari masing area. Pemberian id ini tidak ada ketentuannya. Id Sidebar tersebut bisa saja sidebar pertama diberi nama dengan sidebar-left dan sidebar kedua diberikan id sidebar-right, atau sidebar1 dan sidebar2, atau id-id yang lain misalnya yang satu id-nya sidebar-left, tapi sidebar yang kedua diberikan id kolom-tambahan.

Agar kita bisa mengetahui id dari suatu widget ini caranya sangat gampang. Kita tidak perlu memeriksa dan mengeditnya satu persatu. Caranya adalah kita cukup menggunakan fasilitas inspect element. Jika belum tahu tentang inspect element ini, silakan baca terlebih dahulu postingan tentang inspect element disini.

Disini saya juga akan coba memberikan satu contoh kecil. Saya akan contohkan bagaimana saya melihat id salah satu kolom yang ada di blog ngalor-ngidul ini langsung.

1. Pertama letakkan mouse pada widget yang ingin kita ketahui id-nya, sebagai contoh disini saya akan melihat id-id dari widget slider yang ada di homepage blog ini.
2. Klik kanan pada browser. Saya sendiri disini menggunakan browser google chrome. Jadi Kalau mau hasilnya sama, maka saya sarankan anda juga menggunakan google chrome.
3. Pilih inspect element sehingga kita akan mendapatkan hasil seperti dibawah ini. Jika kurang jelas klik saja gambarnya.

4. Sekarang coba kalian perhatikan bagian yang saya lingkari dengan garis merah tebal. Disitu kita bisa lihat ada banyak sekali kode source dan/atau kode HTML dari blog ini. Dan disetiap tag yang berawalan <div> pasti disertai dengan kata id atau class.

Setelah kita tahu mengetahui id dari widget yang ingin kita rubah tersebut maka kita tidak perlu takut melakukan kesalahan dalam mengedit template tersebut. Karena untuk setiap id tersebut juga mempunyai kode CSS-nya sendiri sesuai dengan id-nya. Kode CSS dari id tersebut terdapat pada kolom inspect element disebelah kanan. Kode CSS tersebut juga akan berubah setiap kali kita melakukan inspect element diarea yang berbeda. Untuk melihat apakah widget yang ingin kita edit tersebut sudah benar atau tidak, maka dilayar monitor kita akan suatu tanda seperti yang terlihat di gambar dibawah ini.

Dengan demikian maka untuk pencarian id ini pun selesai. Heheee.....

Mempermudah Ujicoba design dengan Inspect Element

Dalam posting sebelumnya yaitu tentang persiapan yang sebaiknya kita lakukan agar lebih nyaman dalam belajar design template, saya ada sedikit menyinggung istilah Inspect Element. Buat teman-teman yang udah jago design pasti tahu tentang hal ini. Karena memang dengan adanya fitur Inspect Element ini proses design template ini akan 1000 kali lebih mudah.

Kenapa saya bilang demikian??
Karena dengan menggunakan fasilitas ini kita dapat melihat struktur code sesuai yang ditampilkan pada halaman web secara langsung. Code yang ditampilkan dalam inspect element tentunya merupakan code-code client-side, meliputi HTML, CSS dan JavaScript. Melalui fasilitas ini kita dapat melihat struktur code dan juga hasil tampilan yang kita lihat dalam browser. Kecuali Mozilla Firefox, Browser-browser populer saat ini seperti Opera dan Google Chrome telah menyediakan fasilitas ini. Fasilitas ini sudah terdapat secara langsung saat pertama kali menginstal.

Khusus Mozilla Firefox, untuk dapat menggunakan inspect element kita harus menambahkan sebuah add-on yaitu Firebug. Cara instalnya cukup mudah kok. Kita tinggal kunjungi Firebug untuk mendapatkan add-on inspect elementnya, install dan restart browser firefoxnya.

Cara penggunaannya pun sangat mudah.

1. Kita tinggal letakkan mouse pada bagian yang ingin kita lihat element dan code sourcenya.
2. Lalu klik kanan. 
3. Kemudian klik Inspect Element yang biasanya berada paling bawah dari option yang muncul. 

Untuk system inspect element yang terbaru, akan ada banyak sekali bagian-bagian yang bisa kita gunakan. Namun untuk tahap awal maka kita cukup menggunakan 3 menu element saja.

3 menu utama dalam fitur Inspect Element ini yaitu:

1. Elements :
   Pada menu elements kita dapat melihat struktur disain dari suatu halaman web yang di tampilkan dalam bentuk script atau kode dimana pada menu ini setiap elemen telah disusun berdasarkan posisi script dan setiap elemen halaman telah dikelompokkan masing-masing. Dengan fitur ini kita dapat dengan jelas melihat struktur desain dari halaman tersebut sesuai dengan coding asli yang telah di buat oleh programmer. Baik itu lebar area, tinggi area, background yang digunakan, komposisi warna yang dipakai dan lain sebagainya.
2. Resources :
   Merupakan tampilan detail dari elemen-elemen halaman web seperti gambar dan style CSS yang digunakan (lebih mengarah ke interface web). Pada menu kita dapat melihat source lengkap dari setiap elemen gambar dalam halaman web, mulai dari gambar background, header, widget, icon, banner, dsb. bahkan kita bisa mendownload elemen tersebut dengan langsung menuju ke source yang ditunjukkan oleh gambar. Kelebihannya adalah pada menu ini setiap gambar dapat di preview secara langsung bahkan resolusi sebenarnya dari gambar tersebut juga akan ditampilkan.
3. Scripts :
   Isi menu ini sama saja dengan isi halaman yang muncul pada saat kita melakukan view source pada halaman web.

Nah, Setelah panjang lebar menjelaskan tentang inspect element ini mungkin akan lebih mudah dipahami jika kita bisa melihat sedikit triknya langsung. Tenang saja, saya sudah siapkan satu video kok. Nanti kalian juga bisa cari sendiri di youtube tentang cara penggunaan atau fungsi dari inspect element ini. Atau jika kalian sabar, kalian bisa tunggu posting berikutnya.

Persiapan pertama untuk belajar design template blogger

Saat pertama mulai blogging, terkadang saya sebagai blogger baru merasa malu dengan tampilan blog saya sendiri. Apa lagi jika kebetulan saat blogwalking saya menemukan blog-blog para master dan ditambah lagi dengan ahli design.

Oleh sebab itu pula, akhirnya sedikit-demi sedikit saya juga belajar design blog saya sendiri. Namun karena kurangnya pengetahuan di bidang dasar-dasar design terasa begitu sulit untuk memahami setiap tutorial yang coba saya pelajari. Maka untuk postingan kali ini saya coba untuk menyimpulkan sedikit demi sedikit agar lebih mudah dipahami.

Yang pertama adalah apa saja yang dibutuhkan
1. Komputer
Yang paling penting dari design blog atau website adalah tentu saja sebuah komputer. Tapi sangat disarankan komputer yang digunakan dengan spesifikasi minimum sebagai berikut:

- Operating Sistem: Windows XP/Windows Vista/Windows 2000/Windows 7 atau yang setara atau lebih tinggi.
- Processor: Intel Core Duo 4 2.0 GHz or equivalent AMD Athlon 64 3000 +
- Memory: 1 GB (Windows XP) / 2GB (Windows Vista / 7)
- Hard disk dengan kapasitas minimum 80gb / 160gb / lebih tinggi.
- Graphics Card: 3D-graphics adapter with 256 MB memory, compatible with DirectX ® 9.0 and supports Pixel Shader 3.0 (Nvidia ® GeForce ® 8600 GT / ATI ® Radeon X1950 Pro or better)
- Monitor dengan kemampuan resolusi minimum 1280×768 atau 1360×768 pixel atau lebih tinggi.

Saya bukan bilang jika anda memiliki komputer dengan spesifikasi dibawahnya tidak bisa. Tetapi saya bisa menjamin jika anda ingin belajar dengan nyaman maka setidaknya anda membutuhkan komputer dengan spesifikasi seperti yang saya sebutkan di atas.

2. Jaringan Internet
Selanjutnya yang pasti adalah jaringan internet. Tentu saja hal ini sangat penting karena kita pasti harus melihat hasil dari ujicoba yang telah kita lakukan.

3. Browser-browser internet yang paling baru.
Seperti yang kita ketahui bersama, setiap saat system yang digunakan dalam design sebuah website ataupun blog pasti semakin berkembang dan menggunakan metode-metode yang paling baru. Dalam hal ini, browser-browser type lama  terkadang  tidak bisa menampilkan hasil design secara sempurna karena belum belum dilengkapi dengan fitur-fitur yang mendukung.

Oleh sebab itu pula maka dalam setiap design yang kita lakukan, maka kita juga harus selalu cek hasilnya disetiap type browser. Fitur dari browser selanjutnya yang paling kita butuhkan adalah browser yang memiliki fitur inspect element. Hal ini juga nnt akan kita bahas dalam posting selanjutnya.

4. Software atau aplikasi pendukung.
Yang saya maksud sebagai software pendukung adalah seperti notepad/wordpad, photoshop, dan/atau sofware yang bisa digunakan untuk edit text dan foto lainnya. Cukup pelajari dasar-dasarnya saja karena sebisa mungkin kita akan meminimalkan penggunaan gambar dalam proses designnya nanti.

Permasalahan blogger error bX-l4u1mh

Waaa.....

Blog ane hancurrr....

Kenapa neh tiba-tiba gak bisa diedit dan selalu muncul kode bX-l4u1mh??

Sempat bingung juga karena masalah ini. Kok bisa ya blog saya tiba-tiba muncul kode error bX-l4u1mh?!

Padahal saya sama sekali gak pernah otak-atik lagi tempatenya. Dulu saat pertama belajar otak-atik blog, memang kadang ada kejadian hampir serupa.

Akhirnya saya coba untuk cari tahu di google dan juga ke forum blogger. Saya kaget lagi karena ada banyak sekali blogger yang mempunyai masalah yang serupa. Sampai bingung mau baca yang mana. Dan anehnya lagi semuanya terjadi pada saat yang sama. rata-rata pada tanggal 13/12/2011 - 14/12/2011.

Setelah saya pikir-pikir, apa mungkin ini cuma blog tertentu? Atau semua blog?? Akhirnya sebelum baca lebih banyak diskusi tentang Permasalahan blogger error bX-l4u1mh ini, saya coba untuk melihat keadaan blog saya yang lain. 

Laa... Kok sama??
Saya buka lagi yang lain, kondisinya juga sama. Waahh.. Klo begini sepertinya kesalahan bukan dari blog saya deh..!!
Terus dari mana donk??
Cara mengatasinya bagaimana?? 

Saya juga belum tahu pasti. Tapi saya rasa hal dan hampir bisa pastikan ini bukan dikarenakan kesalahan saya saat edit blog. Mungkin ini memang masih ada terjadi error system dari pusat bloggernya langsung. Karena seperti yang kita ketahui bersama saat ini pihak google dan blogger team memang sedang menyempurnakan fitur-fitur terbaru dari blogger interface.

Namun yang pasti hal pertama yang harus kita lakukan adalah dengan mengembalikan template ke kondisi seperti sebelum di edit dan membersihkan cache dari komputer yang kita pakai.

Karena dengan cara itu Alhamdulillah biasanya blog-blog saya yang mempunyai permasalah blogger error bX-l4u1mh bisa kembali ke kondisi normal.

Nah..

Jika teman-teman juga mempunyai permasalah blogger error bX-l4u1mh atau tahu solusinya dan cara mengatasi dengan cara lainnya, atau punya pendapat lain, Mohon diberi komentar di bawah ya...!!!

Mengenal dasar-dasar Template Blogger

Secara mendasar, Blogger menggunakan template berplatform HTML/XML dengan didukung pengaturan tampilan CSS dan fungsi-fungsi javascript. Kita mengenal adanya fitur edit template HTML Blogger dimana kita dapat dengan bebas melakukan modifikasi, desain ulang, hack, penambahan fitur dari pihak ketiga (third party) berupa widget, dan lain-lain.

Untuk benar-benar menguasai atau memahami setiap pelajaran maka yang perlu kita ketahui pastilah dasar-dasar atau pokok yang paling penting dari hal yang ingin kita pelajari tersebut. Sama halnya dengan template blog. Agar bisa mengedit bahkan membuat sendiri sebuah template, maka sebelum belajar mengedit template dari blogger yang paling penting adalah dengan mengetahui struktur dasarnya terlebih dahulu.

Dari struktur dasar inilah yang kemudian menjelaskan setiap bagian dari template blogger secara lebih rinci dan membantu kita untuk melalui proses pengkodean dan merancang sebuah template langkah demi langkah.

Struktur desain sebuah blog pada dasarnya terdiri atas beberapa bagian utama seperti berikut:

1. Tag HTML :

- Setiap desain blog/web selalu diawali dengan tag pembuka <html> dan ditutup dengan tag </html>

- Di antara tag inilah berbagai kode html yang lain ditambahkan untuk menciptakan sebuah desain blog/web.

2. Tag head :

- Diantara tag pembuka <head> dan penutup </head> terdapat tag title yang di dalamya berisikan blog title atau blog title yang disertai post title (judul posting).

- Diantara tag pembuka <head> dan penutup head </head> juga menjadi tempat kode CSS yang berfungsi sebagai pembangun blog dan beberapa javascript diletakkkan. Untuk tempat peletakan code CSS biasanya tepat diantara kode <b:skin><![CDATA[ sampai dengan kode ]]></b:skin>. 

- Diantara tag <head> dan <b:skin><![CDATA[ juga biasanya menjadi tempat peletakan script, font yang digunakan dan meta content dari blog tersebut.

3. Tag body :

Tag body merupakan tempat utama semua aktifitas blogging. Beberapa desain akan dibangun dalam tag ini untuk divisualisasikan melalui halaman blog. termasuk pula widget-widget yang menjadi bagian dari isi halaman, diawali dengan <body> dan diakhiri dengan </body>. Pada bagian body bisanya terbagi menjadi 3 (tiga) bagian utama.

- Header Blog : Header blog berisi Nama blog beserta link-nya serta sering ditambahkan beberapa link baru seperti misalnya daftar menu (navigasi horizontal).

- Content : pada bagian ini terletak kolom posting.

- Sidebar : Sidebar bisa berjumlah 1 (satu) kolom atau bahkan hingga 3 kolom. Ditempat ini biasanya widget ditambahkan..

-Footer : Footer terletak di blog bagian paling terbawah. Footer juga biasanya dimanfaatkan peletakan widget tambahan dan juga untuk menempatkan identitas pembuat design sekaligus linknya.

Dari keterangan diatas maka setiap template dari blogger pasti memiliki susunan seperti dibawah ini.

<html>
<head>

Tempat peletakan Script, font dan meta content.

<b:skin><![CDATA[

<b:skin><![CDATA[

Tempat peletakan CSS

]]></b:skin>

]]></b:skin>

Tempat peletakan Script dan CSS

</head>

<body>

Tempat peletakan Content dari blog berisi seperti Title, posting, sidebar,
dan footer.

</body>
</html>

Nah..
Setelah kita mengetahui dasar-dasarnya maka nanti semua akan kita bahas satu persatu mulai dari header sampai footer pada posting-posting berikutnya.

Cara Efektif Searching di Google Menggunakan Google Syntax

Lama tidak update di Ngalor-Ngidul Akhirnya tergugah juga untuk update posting. Tapi bingung juga mau posting apa?? Dari pada lama-lama mikir akhirnya diputuskan untuk mengulang kembali semua pelajaran dari awal.

Kira-kira mulai dari mana ya??
Hmm...
Ya sudahlah. Mungkin ini adalah hal yang paling sederhana dan paling dasar dari semua ilmu internet yang ada. Yaitu Searching di Google Search Engine.
Weleehh...
Memang siapa sich yang tidak tahu cara Searching di Google Search Engine??
Anak kecil saja bisa. Tinggal masukkan kata kunci di kolom pencarian terus tekan enter atau klik tombol Search dan selesai. Tinggal tunggu hasil yang didapat dari search engine tersebut.

Yupz..
Anda benar. Tapi tahukah anda??
Sebenarnya ada beberapa kode atau yang di sebut Google Syntax. Google Syntax sangat berguna untuk membantu kita untuk mencari informasi yang lebih akurat di google.

Berikut beberapa Google Syntax Efektif untuk Searching di Google beserta fungsinya:
* Syntax keyword
Ini berguna untuk mencari keyword di google search engine sobat bisa mencarinya dengan penambahan =
contoh: keyword=seo tips and trik
maka google akan menghasilkan situs yang mempunyai keyword tersebut.

* Syntax OR
Dengan kata lain atau yang berfungsi melakukan pencarian halaman yang berisi salah satu dari keyword atau kata kunci
contoh: laki-laki OR Perempuan

* Syntax (+)
Untuk melakukan pencarian secara paksa
contoh: hacker+where
maka kata where akan di ikut sertakan tetapi apabila kita mencari hacker where kata where tidak akan di ikut sertakan dalam pencarian.

* Syntax (-)
untuk melakukan pencarian dengan pengecualian
contoh: kita ingin mencari kata mobil tapi tidak mengikutsertakan motor
maka; mobil-motor

*Syntax * (asterik)
Untuk mencari semua hurup yang mendukung dalam pencarian sebuah kalimat
contoh: belajar * SEO
maka hasil pencarian akan bervariasi dengan kata penghubung misalnya belajar tentang SEO

*Syntax (" ")
untuk mencari kata yang tepat dan susunan kalimat dengan tepat
contoh: "Google"

* Syntax ?intitleindex.of? jpg site:
Untuk mencari sebuah direktori yang mengandung file-file gambar silahkan anda ketikan di google
contoh: ?intitleindex.of? jpg site:.

* Syntax intitle:
Untuk mencari judul suatu situs jadi kalau mengetikan ini di google akan menghasilakn judul artikel ataupun judul halaman web/blog.
contoh: intitle:berita untuk negri

*Syntax Allinurl:
Untuk pencarian data dalam url tertentu biasanya di ikuti dengan index ini mencari seluruh kata dalam url
contoh: allinurl:index.php

* Syntax filetype:
Untuk mengetahui tipe file yang di gunakan atau melakukan pencarian dengan tipe file tertentu seperti PDF, TXT, DOC, XLS, HTML, PHP, SWF, RTF, PPT, MBD, dan lain-lain.
contoh: filetype:PDF "hacking facebook"

          +++jangan lupa berikan spasi

*Syntax Cache:
Google akan menampilkan versi sebuah web pada saat membukannya
contoh: cache:realfa84.blogspot.com

* Syntax site:
Di sini google akan menampilkan seluruh isi dari situs
contoh: site:realfa84.blogspot.com

* Syntax link:
Ini untuk mengetahui banyaknya link dari suatu situs
contoh: link:realfa84.blogspot.com
catatan: apabila web/blog kita tidak terindek ada kemungkinan masuk sandbox atau ada yang salah dalam www.w3.org jangan sampai salah dan harus valid karena kalau masuk sandbox kita tinggal berdoa saja agar google memberi keringanan.

* Syntax related:
Ini berguna untuk mencari halaman yang mempunyai kesamaan atau mempunyai hubungan dengan situs tersebut.
contoh: related:facebook.com

* Syntax inurl:
Menampilkan satu kata yang dicari di dalam URL ini berbeda dengan allinurl: kalau inurl: google akan menelusuri satu kata yang sfesifik dalam url.
contoh: inurlperator

* Syntax define:
Kalau yang ini digunakan, maka google akan mencari suatu definisi dari kata, misalnya kita ingin mencari definisi SEO
maka: define:SEO
Sebenarnya ada banyak sekali syntax yang dapat di gunakan tapi diposting ini saya hanya memberikan contoh yang umum saja karena saya yakin sobat semua sudah mengetahuinya. Semoga bermanfaat.