Kenapa Image di Template Blog tidak Muncul?

<p>Pertanyaan senada kadang terucapkan, saat kita mengetahui ada gambar yang tidak muncul atau gambar yang seharusnya muncul diganti dengan gambar lain (penyedia layanan image hosting) khususnya terjadi pada <i>template</i>.  Terdapat beberapa kemungkinan yang menyebabkannya, antara lain ;  salah alamat, gambar telah berpindah atau dihapus, bandwidth di penyedia layanan telah habis dan sebagainya.</p><blockquote><p style="text-indent:-0.35em;">“Tapi OB aku sudah cek ke alamat penyimpanan gambar-nya dan hasilnya masih memunculkan gambar tersebut.”</p></blockquote><p>Berarti kemungkinan salah alamat dan gambar telah berpindah atau dihapus dapat pula kita sisihkan. Mau tidak mau atau suka tidak suka kita mesti mencari alasan lain, mengapa gambar di template  tidak muncul.  Salah satu kemungkinan lain jatuh kepada bandwidth di penyedia layanan image hosting, seperti ;  <a href="http://photobucket.com/" rel="nofollow" target="_blank">Photobucket</a>, <a href="http://imageshack.us/" rel="nofollow" target="_blank">ImageShack</a>, <a href="http://tinypic.com/" rel="nofollow" target="_blank">TinyPic</a>, de-el-el.</p><blockquote><p style="text-indent:-0.35em;">“Bandwidth sering digunakan sebagai suatu sinonim untuk data transfer rate yaitu jumlah data yang dapat dibawa dari sebuah titik ke titik lain dalam jangka waktu tertentu (pada umumnya dalam detik). Jenis Bandwidth ini biasanya diukur dalam bps (bits per second). Adakalanya juga dinyatakan dalam Bps (bytes per second). Dalam bahasa mudahnya, adalah sebuah takaran lalu lintas data yang masuk dan yang keluar.”</p><p class="author">(<a href="http://id.wikipedia.org/wiki/Lebar_pita#Bandwidth_Komputer">wikipedia</a>).</p></blockquote><p>Bukan menjadi rahasia umum bahwa gambar merupakan salah satu elemen agar <i>template</i> lebih kelihatan asoy geboy aduhay (kata terakhir dipaksain tuh...) dan tidak berasa hambar, sehingga membutuhkan layanan image hosting.  Sekarang kamu menggunakan <i>template</i> dari anu bin anu yang memiliki tampilan menarik dan beberapa elemennya berupa gambar.</p><p>Karena saking menariknya, banyak para blogger yang menggunakan <i>template</i> tersebut. Sedangkan <i>template</i> langsung digunakan secara default. Akibatnya semua pengguna <i></i>akan menggunakan sumber image hosting yang sama.; Ketika pengunjung menyambangi blog kamu, bukan tidak mungkin pengunjung lain juga sedang blog walking ke blog yang menggunakan <i>template</i> sama dengan kamu.</p><p>Coba bayangkan jika puluhan pengunjung mengunjungi blog yang memiliki <i>template</i> sama persis.  Oleh karena banyaknya aktivitas upload gambar menyebabkan jatah bandwidth dari penyedia layanan tersebut habis. Akhirnya kamu pasti tahu, yakni gambar dalam <i>template</i> tidak muncul atau diganti dengan gambar si penyedia layanan.</p><blockquote><p style="text-indent:-0.35em;">“Kalau begitu aku tidak akan menggunakan <i>template</i> pakai gambar, ah?”</p></blockquote><p>Eit, itu bukan merupakan pemikiran yang bijak. Seperti kata OB di atas, gambar merupakan salah satu elemen agar <i>template</i> tidak berasa hambar.  Point pentingnya, kita hanya membutuhkan alternatif jitu untuk memecahkan "telur itu???" (*maksudnya memecahkan masalah itu).  Alternatif jitu tersebut berupa :</p><ul><li>Download gambar-gambar yang disertakan dalam <i>template</i>, kemudian upload gambar <i>template</i> tersebut ke hosting gambar yang biasa kamu pakai. Tidak jarang <i>template</i> yang kamu gunakan (download) telah disisipkan file gambar oleh sang empu-nya.  Jadi tinggal meluangkan waktu sebentar untuk mengupload gambar tersebut ke hosting gambar yang biasa kamu pakai.</li><br /><li>Setelah proses upload selesai, jangan lupa untuk mengganti alamat penyimpanan gambar dalam <i>template</i> tersebut.  Contoh kode yang diganti :</li><br /></ul><div class="code">body {<br /><br />background:#FFFFFF url(<span style="color: red;">http://i647.photobucket.com/albums/uu191/OB//bintang_tujuh_keliling.gif</span>) }<br /><br /><br /><br />.sidebar h2 {<br /><br />background:url(<span style="color: red;">http://i46.tinypic.com/152ff2b.jpg</span>) top left repeat-x; }</div><p>Catatan : Ganti kode yang berwarna merah dengan gambar yang sama/serupa sesuai dengan alamat penyimpanan file gambar kamu yang sebelumnya telah diupload.</p><ul><li>Cek dan ricek <i>template</i>, siapa tahu ada gambar yang tidak sesuai, seperti ; gambar yang seharusnya di header malah ngelayap ke sidebar, icon yang seharusnya untuk komentar malah jadi icon kecantikan (kagak nyambung...).</li><br /></ul><p>Udah cape rasanya megang tuts keyboard, ditambah lagi mata yang rada-rada mau tertutup (bilang aja ngantuk gitu! ha..ha..).  Badan pun udah pengen bertemu sang kekasih di pulau kapuk alias tempat tidur, Bobo yu...</p>

Posted by Hii Sekai

Link Penulis Komentar (Comments Author) Terbuka di Tab Baru

<div style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img alt="Comments Author" border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqcGXZlvp5WLDV95xuPR3zHfv_NRNtUaeRwPLfoxbovSxf12dZ8oUAU_zdl56h40sOgXsjxVZloxaXsVNzoP8HqblITlCGDcJXfgXiOiKVScauVRhjMPKtaU6Rrfcev7_270LDSEjMC3k/s200/link+comments+author.gif" width="150" /></div>Coba buka salah satu postingan di blog kamu yang ada komentarnya.  Kalau sudah klik salah satu link komentator (comments author).  What happen?  Tentu saja kamu akan dibawa ke halaman link komentator tersebut, namun terbuka pada tab yang sama. Kecuali kamu melakukan klik kanan dan pilih "Open link in New Tab".  Nah, <i>trik blogger</i> yang akan OB diskusikan kali ini adalah bagaimana jika kita meng-klik link penulis komentar, maka link itu akan langsung terbuka di tab baru.<br /><br /><br /><br /><div style="clear: both; margin-left: 1em; margin-right: 1em; text-align: center;"><img alt="Browser Tab" border="0" height="65" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcBOJUkVkYyRpmQqtiwnr4-VQN3OsIxeYw03WVWdnnE4IPKJjChPRPuwrCjlzNlcn8Xncf9H8D0SxApsQOYwly60E2QkVwthsAoO1OYBGCf6dl-wCoojI0mXxeR1LH8140-Bnd-8XtB3Q/s200/tab.gif" width="200" /></div><br /><br />Versi demonya silakan klik salah satu link comments author di blog OB.<br /><br /><br /><br /><ul><li>Sign-in ke akun blogger kamu.</li><br /><li>Pilih Tata Letak --> Edit HTML --> centang "Expand Template Widget".</li><br /></ul><div style="clear: both; margin-left: 1em; margin-right: 1em; text-align: center;"><img alt="Expand Widget Templates" border="0" height="62" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyYq5DORu_gDZHHfZsFiKKayOrnAyLCvyi7d5bS5EENnAT8rWIe65yM0u17GTZhH_8J82x1xPgK6hOAL2W6vX_u8EfgwITGcjsPu1Am5vK-eefbtUzufjKlgj0Zma1t5IVED7ZKWgxMJU/s200/expandtw.gif" width="200" /></div><br /><br />Tips : Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.<br /><br /><ul><li>Cari kode seperti di bawah ini :</li><br /></ul><div class="code"><b:if cond='data:comment.authorUrl'><br /><br /><div style="color: red;"><a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a></div></div>Tips : Kalau susah mencarinya, coba tekan tombol F3 di keyboard. Maka akan muncul menu toolbar pencarian di bawah browser, sehingga kamu tinggal memasukkan kata yang ingin dicari.<br /><br /><ul><li>Sisipkan target="_blank" (warna hijau) pada kode yang berwarna merah.</li><br /></ul><div class="code"><b:if cond='data:comment.authorUrl'><br /><br /><a expr:href='data:comment.authorUrl' rel='nofollow' <span style="color: #38761d;">target='_blank'</span>><data:comment.author/></a></div><ul><li>Jangan lupa disimpan.</li><br /></ul>Sekarang buka kembali salah satu posting yang ada komentarnya di blog kamu dan klik link comments author.  Mudah-mudahan telah terbuka di tab baru, kalau ngga...  Maka OB akan pusing dan garuk-garuk kepala sendiri. <h2>Update</h2><p>Trik ini <a href="http://optimasi-blog.blogspot.com/2011/03/informasi-update-posting-terdahulu-1.html">tidak direkomendasikan</a>, silakan telusuri di Google tentang “Link Target” atau “Validitas Link Target”.</p>

Posted by Hii Sekai

Cara Pasang Title dan Meta Tags agar Blog lebih SEO Friendly

Sebenarnya judul di atas sangat berhubungan dengan 2 (dua) posting sebelumnya, yaitu : <a href="http://optimasi-blog.blogspot.com/2009/03/seo-optimasi-judul-blog-dalam-title-tag.html">SEO | Optimasi Judul Blog dalam Title Tag</a> dan <a href="http://optimasi-blog.blogspot.com/2009/03/memasang-meta-tags-dan-manfaatnya.html">Memasang Meta Tags dan Manfaatnya</a>. Cuma mungkin karena uraiannya yang agak menggantung, sehingga kurang/tidak tercover di hati pembaca (wih.., puitis amat). Nah, agar semua terlihat terang benderang, seperti ungkapan dalam sebuah buku "Habis Gelap Terbitlah Terang", maka kembali dihadirkan dalam versi keduanya (emang buku ha..ha..). Pada posting kali ini sengaja dijadikan satu, karena kedua tags tersebut sangat erat sekali hubungannya dan langsung diuraikan melalui Edit HTML. Terutama agar blog kamu kelihatan lebih <b>SEO</b> friendly. Langsung saja kita ke TKP (Tempat Kerjaan Para blogger)...<br /><br /><ul><li>Masuk ke Edit HTML.</li><br /><li>Cari kode (letaknya di atas) berikut :</li><br /></ul><div class="code"><head><br /><br /><b:include data='blog' name='all-head-content'/><br /><br /><div style="color: red;"><title><data:blog.pageTitle/></title></div><b:skin><![CDATA[</div>Tips : Kalau susah mencarinya, coba tekan tombol F3 di keyboard. Maka akan muncul menu toolbar pencarian di bawah browser, sehingga kamu tinggal memasukkan kata yang ingin dicari.<br /><br /><ul><li>Ganti kode yang berwarna merah dengan kode di bawah ini :</li><br /></ul><div class="code"><b:if cond='data:blog.pageType == "index"'><br /><br /><title><data:blog.pageTitle/></title><br /><br /><b:else/><br /><br /><title><data:blog.pageName/></title><br /><br /></b:if></div>Catatan :<br /><br />Untuk menambah title, kamu bisa melakukan edit terhadap kode di atas (perhatikan kode yang berwarna biru), contoh :<br /><br /><div class="code"><b:if cond='data:blog.pageType == "index"'><br /><br /><title><data:blog.pageTitle/><span style="color: blue;"> | Tips SEO | Trik Blogger | Blogger Indonesia</span></title><br /><br /><b:else/><br /><br /><title><data:blog.pageName/></title><br /><br /></b:if></div><div style="text-align: center;">atau</div><div class="code"><b:if cond='data:blog.pageType == "index"'><br /><br /><title><span style="color: blue;">Tips SEO | Trik Blogger | Blogger Indonesia | </span><data:blog.pageTitle/></title><br /><br /><b:else/><br /><br /><title><data:blog.pageName/></title><br /><br /></b:if></div><ul><li>Setelah selesai mengganti title tag, sekarang tambahkan kode Meta Tags di bawahnya.</li><br /></ul><div class="code"><meta content="<span style="color: red;">...deskripsi tentang blog kamu...</span>" name="description"/><br /><br /><meta content="<span style="color: red;">keyword1,keyword2,keyword3,...</span>" name="keywords"/><br /><br /><meta content="INDEX, FOLLOW" name="robots"/></div>Catatan :<br /><br />Ganti kode yang berwarna merah dengan deskripsi dan keyword blog kamu (perhatikan kode yang berwarna biru), contoh :<br /><br /><div class="code"><meta content="<span style="color: blue;">Tips dan trik blog optimization melalui Tips SEO dan trik blogger serta berbagai jenis optimasi blog lainnya</span>" name="description"/><br /><br /><meta content="<span style="color: blue;">source code,search engine,SEO,template,templates,ranking,blog optimization,kode HTML,backlink,widget,gadget,blogger stuff,tips seo,kata kunci,tips blogging,free directory,traffic,trafik,trik blogger,optimasi blog,promosi,untuk indonesia</span>" name="keywords"/><br /><br /><meta content="INDEX, FOLLOW" name="ROBOTS"/></div><blockquote>Jadi keseluruhan kodenya akan terlihat seperti ini (diambil dari Blog OB) :<br /><br /><div class="code"><head><br /><br /><b:include data='blog' name='all-head-content'/><br /><br /><br /><br /><b:if cond='data:blog.pageType == "index"'><br /><br /><title><data:blog.pageTitle/> | Tips SEO | Trik Blogger | Blogger Indonesia</title><br /><br /><b:else/><br /><br /><title><data:blog.pageName/></title><br /><br /></b:if><br /><br /><br /><br /><meta content='Tips dan trik blog optimization melalui Tips SEO dan trik blogger serta berbagai jenis optimasi blog lainnya' name='description'/><br /><br /><meta content='source code,search engine,SEO,keyword,template,templates,keywords,ranking,blog optimization,kode HTML,backlink,widget,gadget,blogger stuff,tips seo,kata kunci,tips blogging,free directory,traffic,trafik,trik blogger,optimasi blog,promosi,untuk indonesia' name='keywords'/><br /><br /><meta content='INDEX, FOLLOW' name='ROBOTS'/><br /><br /><br /><br /><b:skin><![CDATA[</div></blockquote><ul><li>Jangan lupa disimpan.</li><br /></ul><br /><br />Sekarang coba klik "Lihat Blog" (dikurung kotak merah) dan perhatikan perubahan judul blog kamu di bagian paling atas browser.<br /><br /><div style="clear: both; margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" height="80" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfN0fR2HnP7ikfAGWUcR9IfgR2X_wKwArmieFpFuwPfi_zIlhy0pzP1XNSfo3QJUNERkGUnbi62zR03Fd2mMi7gAWvCSBb4iBBunBJ5QtgQXTPHuATFnlJPnOT0EXT2A6lGd9n3WU5tA8/s320/view.gif" width="320" /></div><p>Selamat memasang title dan meta tags...</p><p><em>Update :</em></p><p>Sesuai dengan komentar dari Saudara <strong>hans ganteng</strong>, OB sependapat bahwa <code><data:blog.pageTitle/></code> mengandung arti yang luas, sehingga menyebabkan penempatan keyword tidak optimal. Sekarang OB telah mengubah meta tags blog ini, seperti yang disarankan oleh Saudara hans ganteng.</br> Coba perhatikan meta tags di bawah ini :</p><pre><b:if cond='data:blog.pageType == "item"'><br /><title><data:blog.pageName/> | <data:blog.title/></title><br /><b:else/><br /><title><data:blog.title/> | keyword1 | keyword2 | keyword2</title><br /></b:if><br /><br /><meta content="...deskripsi tentang blog kamu..." name="description"/><br /><meta content="keyword1,keyword2,keyword3,..." name="keywords"/><br /><meta content="INDEX, FOLLOW" name="robots"/></pre><p>Contoh penerapannya :</p><pre><b:if cond='data:blog.pageType == "item"'><br /><title><data:blog.pageName/> | <data:blog.title/></title><br /><b:else/><br /><title><data:blog.title/> | Trik Blogger | Tips SEO | Blogger Indonesia</title><br /></b:if><br /><br /><meta content='Tips dan trik blog optimization melalui Tips SEO dan trik blogger serta berbagai jenis optimasi blog lainnya' name='description'/><br /><meta content='source code,search engine,SEO,keyword,template,templates,keywords,ranking,blog optimization,kode HTML,backlink,widget,gadget,blogger stuff,tips seo,kata kunci,tips blogging,free directory,traffic,trafik,trik blogger,optimasi blog,promosi,untuk indonesia' name='keywords'/><br /><meta content='INDEX, FOLLOW' name='ROBOTS'/></pre><p>Terima kasih atas masukannya, untuk posting “Cara Pasang Title dan Meta Tags agar Blog lebih SEO Friendly”.</P>

Posted by Hii Sekai

Trik Blogger | Mengatur Tataletak Link to This Post

<div style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img alt="Jarak Link to This Post" border="0" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFWGVVLWsMSy7HO7YdO2J_YwbK8CUq1oyZkUtJDJ8C49I0OMk5FB6L-kJG30WSZTDWxhGgtEvYxW526LeEqz0wXOYfQ3m5O4msJ8-UePwF-zG9d3506GP0-JBqsznEALbj_tH56m8Ep8I/s144/Jarak%20Link%20to%20this%20post.gif" width="150" /></div>Terkadang kita kurang memperhatikan keberadaan fitur Link to This Post (<i>backlink</i>). Yah, mungkin karena dalam penerapannya kurang diminati oleh sebagian blogger mania. Bahkan tidak jarang dengan mudahnya kita menonaktifkan fitur ini. Link to This Post dimaksudkan agar memudahkan pengunjung blog me-link posting yang dibaca dan diminatinya untuk dijadikan bahan referensi atau rujukan dari posting yang akan dia buat. Cara kerjanya sederhana saja, yaitu kamu cukup meng-klik "Buat sebuah Link", maka secara otomatis blogger akan mengarahkan kamu melalui jendela pop-up langsung ke halaman "Entry baru" (dengan syarat kamu telah login ke akun blogger). Selanjutnya kamu bisa mengedit atau disimpan dulu sebagai draft.<br /><br /><br /><br />Secara default link fitur ini terletak di post-footer. Namun akan berpindah letak dan bentuknya ke bawah form komentar, setelah kita menampilkan seluruh isi posting. Nah, tataletak disinilah yang akan bersama-sama kita diskusikan. Apabila jaraknya dengan form komentar terlalu jauh, kamu dapat memperpendeknya dengan melakukan trik yang cukup simple. Eh..., ngomong-ngomong kode Link to This Post yang seperti apa yah? Kodenya setelah isi keseluruhan posting terbuka (jika melalui "Edit HTML", terlebih dulu centang "Expand Widget Templates") lebih kurang seperti di bawah ini :<br /><br /><div class="code"><div id='backlinks-container'><br /><br /><div expr:id='data:widget.instanceId + "_backlinks-container"'><br /><br /><b:if cond='data:post.showBacklinks'><br /><br /><b:include data='post' name='backlinks'/><br /><br /></b:if><br /><br /></div><br /><br /></div></div>Kembali ke pengaturan tataletak Link to This Post. Adapun step by step pengaturannya adalah sebagai berikut :<br /><br /><br /><br /><ul><li>Edit HTML --> Expand Widget Templates.</li><br /></ul>Tips : Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.<br /><br /><ul><li>Cari kode seperti di bawah ini :</li><br /></ul><div class="code"><b:includable id='comment-form' var='post'><br /><br /><div class='comment-form'><br /><br /><a name='comment-form'/><br /><br /><h4 id='comment-post-message'><data:postCommentMsg/></h4><br /><br /><p><data:blogCommentMessage/></p><br /><br /><data:blogTeamBlogMessage/><br /><br /><a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/><br /><br /><iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='<b><span style="color: red;">210</span></b>' id='comment-editor' name='comment-editor' src='' width='100%'/></div>Tips : Kalau susah mencarinya, coba tekan tombol F3 di keyboard. Maka akan muncul menu toolbar pencarian di bawah browser, sehingga kamu tinggal memasukkan kata yang ingin dicari.<br /><br /><ul><li>Atur ketinggian pada kode yang ditandai dengan warna merah, kalau OB sendiri diatur dalam kisaran 240 - 260.</li><br /><li><em>Update</em> : Setelah kamu mengaplikasikan trik ini — untuk komentar yang menggunakan verifikasi — pengunjung tidak bisa melakukan verifikasi. Dengan kata lain “pengunjung tidak akan bisa berkomentar”. <em>So</em>, agar bisa memasukkan kode verifikasi dalam form komentar, maka kita harus menambahkan fungsi ‘scroll’. Tambahkan CSS berikut di atas kode <code><red>]]></b:skin></red></code> : <div class="code" style="margin-top:1.5em;">.comment-form {<br /><br />overflow:auto;<br /><br />}</div></li><br /><li>Jangan lupa disimpan.</li><br /></ul>Catatan :<br /><br />Kamu pun bisa lebih banyak berkreasi dengan melakukan edit atau menambah kode backlinks-container dalam CSS. Contoh kodenya dalam CSS :<br /><br /><div class="code">#backlinks-container {<br /><br />margin: 10px auto 0;<br /><br />padding: 5px 10px 10px;<br /><br />border: 1px solid #E1D4C0; }</div><br /><br />Selamat mengatur tataletak Link to This Post...

Posted by Hii Sekai

Rounded Corner | Membuat Sudut menjadi Tumpul

<p>Pernah melihat di sudut-sudut blog kelihatan tumpul? Nah, itu dinamakan "<i>rounded corner</i>". Sebelum melangkah lebih jauh, kita perlu membatasi ruang lingkup kajian <b>trik blogger</b> kali ini. Rounded corner yang akan kita diskusikan bersama adalah membuat sudut menjadi tumpul tanpa gambar (<em>rounded corner no image</em>).</p><p>Kemudian bentukkan rounded corner dari kode CSS ini akan nampak, apabila kamu menggunakan browser Firefox, Chrome, dan Safari. Ngomong-ngomong soal tumpul, asal jangan dikaitkan dengan pikiran, lho. Ayo, kita keroyok <b>trik blogger</b> tentang membuat rounded corner :</p><p>Full rounded corner :</p><div class="code" style="-moz-border-radius: 10px 10px 10px 10px; -webkit-border-radius: 10px; background-color: yellow; border: 2px solid rgb(255, 0, 0); padding-left: 20px;">.kotak-rounded-corner {<br /><br />background-color:#FFFF00;<br /><br />border:2px solid #FF0000;<br /><br /><red>-moz-border-radius: 10px;<br /><br />-webkit-border-radius: 10px;<br /><br />-khtml-border-radius: 10px;<br /><br />border-radius: 10px;</red> }</div><p>Rounded corner di kiri atas :</p><div class="code" style="-moz-border-radius-topleft:10px; -webkit-border-top-left-radius: 10px; background-color: yellow; border: 2px solid rgb(255, 0, 0); padding-left: 20px;">.kotak-rounded-corner {<br /><br />background-color:#FFFF00;<br /><br />border:2px solid #FF0000;<br /><br /><red>-moz-border-radius-topleft: 10px;<br /><br />-webkit-border-top-left-radius: 10px;<br /><br />-khtml-border-radius-topleft: 10px;<br /><br />border-top-left-radius: 10px;</red> }</div><p>Rounded corner di atas :</p><div class="code" style="-moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; background-color: yellow; border: 2px solid rgb(255, 0, 0); padding-left: 20px;">.kotak-rounded-corner {<br /><br />background-color:#FFFF00;<br /><br />border:2px solid #FF0000;<br /><br /><red>-moz-border-radius-topleft: 10px;<br /><br />-moz-border-radius-topright: 10px;<br /><br />-webkit-border-top-left-radius: 10px;<br /><br />-webkit-border-top-right-radius: 10px;<br /><br />-khtml-border-radius-topleft: 10px;<br /><br />-khtml-border-radius-topright: 10px;<br /><br />border-top-left-radius: 10px;<br /><br />border-top-right-radius: 10px;</red> }</div><p>Rounded corner di bawah :</p><div class="code" style="-moz-border-radius-bottomleft: 10px; -moz-border-radius-bottomright: 10px; -webkit-border-bottom-left-radius: 10px; -webkit-border-bottom-right-radius: 10px; background-color: yellow; border: 2px solid rgb(255, 0, 0); padding-left: 20px;">.kotak-rounded-corner {<br /><br />background-color:#FFFF00;<br /><br />border:2px solid #FF0000;<br /><br /><red>-moz-border-radius-bottomleft: 10px;<br /><br />-moz-border-radius-bottomright: 10px;<br /><br />-webkit-border-bottom-left-radius: 10px;<br /><br />-webkit-border-bottom-right-radius: 10px;<br /><br />-khtml-border-radius-bottomleft: 10px;<br /><br />-khtml-border-radius-bottomright: 10px;<br /><br />border-bottom-left-radius: 10px;<br /><br />border-bottom-right-radius: 10px;</red> }</div><p>Catatan :</p><ol><li>Trik ini merupakan salah satu dari sekian banyak trik lainnya untuk membuat rounded corner.</li><br /><li>Semakin besar nilai yang kamu masukkan (ex: 10px), maka semakin besar pula ketumpulan/belokan sudut.</li><br /><li>Kode <code>-moz-border-radius</code> digunakan untuk firefox, <code>-webkit-border-radius</code> untuk Chrome dan Safari, <code>-khtml-border-radius</code> untuk browser-browser lama yang mendukung kode ini, serta <code>border-radius</code> untuk pengecekan terhadap browser-browser baru yang mungkin mendukung kode ini.</li><br /><li>Kode di atas merupakan contoh penerapan rounded corner dalam kode CSS.</li><br /></ol><p>Selamat membuat rounded corner...</p>

Posted by Hii Sekai

Solusi Submit Sitemap di Webmaster Tools

<p><img alt="Webmaster Tools" border="0" class="alignleft" height="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGIHaXt9yrByClMgqgMUsxcf6wdrVpvLrDU4fwb3TEdHdng325FgWIv2tYJZqHqYLyde62NjZAUQ4v5VJ5SxeqeJIshW1F0K7dALarSQHYfggSG99f6KAqmb9h2rDU8gtxuetVTBlzqVE/s200/obeng.jpeg" width="150" /> Kok, feeds blogku ngga valid? Aduh, sitemap blogku ngga ter-indeks semua? Huh, gagal lagi submit sitemapnya? Dan masih banyak pertanyaan senada lainnya yang mungkin menghinggapi <em>blogger</em> mania ketika <a href="http://optimasi-blog.blogspot.com/2009/03/submit-sitemap-bloggercom-di-google.html">submit sitemap di Google Webmaster Tools</a>. Terus bagaimana solusi agar sitemap blog kamu dapat maksimal diterima dan ter-indeks oleh Webmaster Tools? Caranya mudah bertanyalah kepada ahlinya. :) Kalau itu sih bukan solusi namanya, tapi salah satu upaya agar tidak “sesat di jalan”.<a name='more'></a></p><p>Nah, daripada cuap-cuap melulu langsung kita menuju TKP. salah satu cara untuk mengatasi masalah error dan indeks URLs tersebut adalah dengan menggunakan <a href="http://digitalinspiration.com/tools/blogger/sitemap/index.php" rel="nofollow">Blogger Sitemap Generator</a>. Berikut adalah langkah-langkah membuat sitemap di <strong>Blogger Sitemap Generator</strong>:</p><ul><li>Klik link berikut <a href="http://digitalinspiration.com/tools/blogger/sitemap/index.php">Blogger Sitemap Generator</a>.</li><li>Masukkan alamat blog kamu lengkap dengan http://, contoh : <a href="http://optimasi-blog.blogspot.com/">http://optimasi-blog.blogspot.com/</a>.</li><li>Setelah yakin benar alamatnya, klik button “Create Blogger Sitemap”.</li><li>Kemuadian akan muncul sitemap di bawah form.</li><li>Jangan langsung <em>copy</em> sitemap tersebut (<ins>ntar meleduk, becanda</ins>).<ol><li>Klik link di bawah "For Bing", untuk men-submit sitemap tersebut ke <a href="http://optimasi-blog.blogspot.com/2009/06/search-engine-baru-dari-microsoft.html">Bing</a>.</li><br /><li>Klik juga kunk di bawah "For Yahoo", untuk men-submit sitemap tersebut ke <a href="http://optimasi-blog.blogspot.com/2009/03/cara-mendaftar-blogger-di-search-engine.html">Yahoo</a>.</li></ol></li><li>Sekarang baru copy sitemap di bawah "For Google".</li><li>Sign-in ke <a href="https://www.google.com/webmasters/tools/">Google Webmaster Tools</a> dan pilih blog yang ingin kamu tambah sitemapnya.</li><li>Kamu sekarang berada di halaman "Dashboard", kemudian klik tanda "+" Site Configuration.</li><li>Pilih "Sitemaps".</li><li>Pada halaman Sitemaps, klik button spoiler "Submit a Sitemap".</li><li><em>Paste</em> sitemap yang kamu dapat dari Blogger Sitemap Generator.</li><li>Terakhir, klik button "Submit Sitemap".</li></ul><p class="small">Sumber : <cite><a href="http://kolom-tutorial.blogspot.com/2009/10/blogger-sitemap-generator-solusi-submit.html" title="Posting di blog Kang Rohman">Blogger Sitemap Generator Solusi Submit Sitemap Blog Anda</a></cite> oleh Kang Rohman.</p><p>Catatan :<br />Biasanya agar sitemap baru kamu terindeks oleh google memerlukan waktu, tunggu dengan sabar sitemap tersebut diindeks oleh mbah Google. Lama..., OB? Daripada nunggu lama diiringi dengan wajah cemberut seperti jeruk purut yang berkerut-kerut (ha..ha..), lebih baik besoknya saja baru kamu cek. "Heh, coba bilang dari tadi, dasar OB".</p><h3>Update — <small>15 September 2012</small></h3><p class="new-line">Sekarang untuk melakukan <em>submit</em> sitemap tidak perlu susah-susah lagi, cukup dengan mengkombinasikan alamat blog ditambah dengan sitemap.xml, contoh: <span style="color:green;">h**p://namablog.blogspot.com/sitemap.xml</span> dan cuplikan gambar <em>interface</em> Google Webmaster Tools di atas sudah ketinggalan zaman. :(</p><p>Selamat men-submit sitemap kamu di Blogger Sitemap Generator.</p>

Posted by Hii Sekai

Menghilangkan Icon Pensil serta Obeng dan Kunci

<div style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img alt="Quickedit" border="0" height="100" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjX-myw1Dlfw0GwmuUDKZ90_7xt7kKWBfJq5Ze5-30DZP7p6B45uVvb9aUxokYkhyphenhyphenianLfzzlCP3IoBqHcPsE-IgjBOWeZCJqDCJM3cxidzlGdKomlBo6zr0zcBhwytYkpNNgDMBHwUbJs/s320/quickedit.gif" width="100" /></div>Gegap gempita Piala Dunia AF-SEL 2010 ternyata sedikit banyak mempengaruhi aktivitas para blogger mania. Bagaimana tidak berpengaruh apabila siang disibukkan dengan urusan pekerjaan, sedangkan malamnya nonton bola. Terlepas dari itu semua, mungkin ada yang menyempatkan waktu untuk sekedar memposting di <i>blog</i> walaupun isinya singkat (namun padat, bro...). OB pun termasuk di dalamnya. Dari judul mungkin teman-teman sudah basi mendengarnya. Kok, yang itu-itu lagi sih? Tapi tidak ada salahnya kan, apabila kita kupas kembali.  Anggap saja sebagai penyebaran teknologi (Wih..., kaya MENRISTEK aja). Yuk, buruan kita review <b>trik blogger</b> "menghilangkan icon pensil serta Obeng dan Kunci".<a name='more'></a><br /><br /><div class="fullpost"><ul><li>Icon Pensil <img alt="Quickedit Pencil" border="0" height="10" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzOI2IKJHsmgLXPSBt0cLxWj-dDQHnrfpdRWL9mAQmj4YLDP-MuRN-fyXmqQyq9K5HdRYuOkn-yrPpgdyWRInVyVdhQW-cNenWpP7rIKukjXZve8cUuLuga1BUZGm09qqslC-8ETgaJ_Y/s320/quickedit+pencil.jpeg" width="10" /> atau yang diistilahkan dalam dunia blogger adalah "quickedit pencil" merupakan shortcut image yang disematkan dalam posting (umumnya di bawah posting)dan akan terlihat jika kamu telah login ke akun blogger kamu. Quickedit pencil berguna untuk mengedit postingan secara cepat dengan satu kali klik. Kadang-kadang ada saja dari para blogger yang kurang menikmati fasilitas tersebut karena alasan yang berbeda-beda, seperti ; merusak pemandangan, tidak biasa menggunakan, de-el-el. Nah, jika kamu mau, kamu bisa menghilangkan icon pensil tersebut. Caranya gampang dan cepat (itulah choki-choki), berikut "step"i wonder-nya :</li><br /></ul><blockquote><ol><li>Setelah sign in ke akun blogger kamu, pilih tab "Pengaturan" (Setting).</li><br /><li>Di Halaman Pengaturan sub tab "Dasar" (Basic), temukan form pilihan "Tampilkan Editing Cepat di Blog Anda?" dan pilih "Ya" (Show Quick Editing on your Blog? dan pilih Yes).</li><br /><li>Selesai.</li><br /></ol></blockquote><br /><br /><ul><li>Icon Obeng dan Kunci (quickedit) <img alt="Quickedit" border="0" height="14" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhI_0dAxEKp4WKuxyNYLDcnuugG2MqZn4D0OoL9SYaB1N3zPKOA1TTpebNNbeIwUqZoexaTWfPMYjoYYyYSJQeYXubSSQBlXOMoRP8c9EeWaHivmMxdd8T6Kx-n-qaApJgcKB38aLfsAkk/s320/quickedit.gif" width="14" /> kurang lebih sama pengertiannya dengan quickedit pencil, bedanya hanya dalam penggunaannya. quickedit pencil digunakan untuk edit posting, sedangkan icon obeng dan kunci (quickedit) digunakan untuk editing <i>gadget</i> atau <i>widget</i> dalam blog. Cara menghilangkan icon/image quickedit ini pun terbilang mudah, yakni menambahkan kode CSS di bawah ini dalam <i>template blog</i> kamu.</li><br /></ul><blockquote>.quickedit { display: none; }</blockquote><blockquote>Kalau masih bingung dimana menempatkan kode di atas, berikut triknya :<br /><br /><ol><li>Klik "Design" --> "Edit HTML".</li><br /><li>Cari kode <span style="color: red;">]]></b:skin></span>.</li><br /><li>Copas kodenya tepat di atas kode yang berwarna merah tersebut.</li><br /><li>Selesai.</li><br /></ol></blockquote><br /><br />Mudah bukan? Kalau kamu termasuk yang ngga suka penampakkan icon-icon tersebut, cepet gih langsung diterapin (ngga usah pake malu-malu segala). Selamat menghilangkan icon pensil serta icon obeng dan kunci di blog kamu...</div>

Posted by Hii Sekai

Ada Apa dengan "DoFollow"?

<p>Blog saya "<a href="http://optimasi-blog.blogspot.com/2009/05/trik-menjadikan-blog-kamu-dofollow.html">DoFollow</a>" lho! Kalau saya "<a href="http://optimasi-blog.blogspot.com/2009/04/optimasi-blog-dofollow.html">NoFollow</a>"! Mungkin kedua istilah tersebut sudah tidak asing lagi bagi para blog mania. Banyak pro dan kontra mengenai kedua istilah tersebut. OB tidak akan berbicara mengenai siapa yang pro dan siapa yang kontra. Coba cari saja di <a href="http://optimasi-blog.blogspot.com/2009/03/cara-mendaftarkan-blogger-di-google.html"><i>search engine</i></a> mengenai <a href="http://optimasi-blog.blogspot.com/2009/05/trik-menjadikan-blog-kamu-dofollow.html">DoFollow</a> dan <i>NoFollow</i>, banyak sekali postingan yang membuka wacana tentang hal tersebut. Namun postingan ini terlahir secara naluriah berdasarkan komentar yang masuk dan mungkin yang akan masuk tentang "mengapa <a href="http://optimasi-blog.blogspot.com/"><b>optimasi-blog</b></a> "DoFollow"?<a name='more'></a></p><p><a href="http://optimasi-blog.blogspot.com/2009/04/optimasi-blog-dofollow.html"><b>Optimasi-Blog</b> yang "DoFollow"</a> dimaksudkan untuk berbagi backlink dengan para pengunjung sebagai rasa penghargaan atas semua komentar yang diberikan dalam postingan. Jadi setiap pengunjung yang berkomentar secara otomatis akan meninggalkan <a href="http://optimasi-blog.blogspot.com/2009/05/tips-menaikkan-serp-dengan-link.html">linkback untuk sedianya diindeks oleh mesin pencari</a>. Semakin banyak kamu berkomentar (dengan memasukkan link tertentu) dalam <i>blog</i> "<a href="http://optimasi-blog.blogspot.com/2009/04/optimasi-blog-dofollow.html">DoFollow</a>", maka semakin besar peluang blog kamu untuk terindeks oleh mesin pencari. Pasti kamu sering mendengar para blog mania berburu <i>blog</i> yang ber-PR tinggi untuk sekedar mendapatkan <a href="http://optimasi-blog.blogspot.com/2009/03/etika-bertukar-link-link-exchange.html"><i>backlink</i></a>. Hmm... naga-naganya OB mau promosi "agar kamu sering berkomentar di blog ini".</p><p>Kalau begitu bagus "DoFollow" dong? Tergantung nafsi-nafsi yang menilai dan agar lebih tidak berat sebelah "DoFollow" ada kekurangannya juga. Apa-apa aja tuh? Begini ceritanya, pada dasarnya setiap <i>blog</i> (blogger, wordpress, dan lain-lain) menganut "<a href="http://optimasi-blog.blogspot.com/2009/04/optimasi-blog-nofollow.html">NoFollow</a>" dalam post untuk komentar. Hal ini tidak lain dan tidak bukan diperuntukkan agar mengeliminasi bertebarannya "SPAM". "SPAM" dalam komentar tersebut berupa link-link yang dimasukkan oleh komentator dan tidak/kurang berhubungan dengan isi posting serta isi komentar. Contoh :</p><blockquote>Fulan bin fulan said ...<br /><br />nice posting, bro. Kunjungi juga :<br /><br /><code><a href="http://…">Mencari uang gratis</a></code>, <code><a href="http://…">Makan ngga makan asal ngumpul</a></code>;</blockquote><p>Kalau "<a href="http://optimasi-blog.blogspot.com/2009/04/optimasi-blog-dofollow.html">DoFollow</a>" sudah jelas komen-komen seperti di atas akan diindeks oleh <i>search engine</i> (apa ngga berabe tuh). Imbasnya yang lain, peringkat <i>blog</i> kamu akan lambat naik. Bahkan jika blog kamu dianggap <i>search engine</i> sebagai penebar "SPAM", maka bersiap-siaplah untuk di "BANNED" (ampun kk).</p><p>Sekedar berbagi dengan para pengunjung yang berkomentar dalam <i>blog</i> "<a href="http://optimasi-blog.blogspot.com/2009/04/optimasi-blog-dofollow.html">DoFollow</a>" :</p><ol><li>Link kamu cukup diletakkan satu saja, yaitu pada saat memasukkan identitas "beri komentar sebagai".</li><br /><li>Untuk lebih optimal, identitas "beri komentar sebagai" dipilih "Name/URL". Kalau bisa yang berhubungan dengan isi posting (<a href="http://optimasi-blog.blogspot.com/2009/03/seo-optimasi-kualitas-link-dalam-blog.html">link yang berkualitas</a>), minimal kamu masukkan nama dan alamat blog kamu.</li><br /><li>Paling penting "jangan meninggalkan SPAM". Masa sudah diberi <i>linkback</i> gratis dibalas dengan "sampah".</li><br /></ol><p>Ngomong-ngomong, kamu pernah ngga membayangkan "jika blog-blog DoFollow punah"; "tidak ada link yang men-support blog kamu"; "tidak ada <i>backlink</i> gratis"; etc. Namun OB yakin yang berkomentar di blog ini (DoFollow yang OB jalani sampai sekarang) sudah pada tahu dan mengerti, sehingga kita akan sama-sama meneriakkan "NO SPAM TO MY COMMENTS".</p><p>Nah, kamu sudah tahukan? profit dan resikonya bagi blog yang menganut "DoFollow". Akhirnya pilihan ada di tangan kamu pribadi...</p><h3>Update</h3><p>Optimasi Blog sudah “tidak dofollow” lagi.</p>

Posted by Hii Sekai

Alternatif Lain Font di Blog Anda

<img alt="font burner" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiypvWTSffK0fWq_Uo9TAwbEaU47ZUpZXgACZ5gh8RAmO1E0qBLBeiD7hF9x604-x1cK-VCFtlgwHvuk9tYUnp8p7BXMwU2NcimETZgZFK3TBwFUkZwiLnl02cVPE-GZq9_8tViUtDhfQk/s400/fontburner_logo.gif" style="margin: 0px auto 10px; display: block; text-align: center; width: 303px; height: 41px;" /><br /><br />Selain <a href="http://optimasi-blog.blogspot.com/2009/12/variasi-font-untuk-blogger-template.html"><span style="font-weight: bold;">variasi font</span></a> yang udah saya terangkan terlebih dahulu pada blog ini, masih ada variasi font yang cara penggunaan sedikit lebih mudah yaitu menggunakan <a href="http://www.fontburner.com/"><span style="font-weight: bold;">Fontburner</span></a>.<br /><br /><a name='more'></a><br /><br />Yang benar-benar mudah untuk menginstal font. Anda hanya perlu menempatkan sedikit kode di atas </head> tag.<br /><br /><br /><br />Nah setelah kita menginstal Fontburner maka otomatis tag seperti h1, h2, h3 akan berubah ke bentuk font yang udah kita instal tadi.<br /><br /><br /><br />Hanya pergi ke Fontburner memilih font Anda dan di bawahnya akan menjadi code.Install itu di atas </head> template yang Anda dan yang dilakukan.<br /><br /><br /><br />Untuk mengubah teks di posting menggunakan Html seperti ini<br /><br /><br /><br /><blockquote><div class="<span style="font-weight: bold;">Nama Font kamu</span>"><span style="font-weight: bold;">tulis teks kamu disini</span></div></blockquote><br /><br /><br /><br />karena warna default fontnya adalah hitam, kamu bisa mengedit file phpnya dan setelah diedit kamu bisa upload ke <a href="http://sites.google.com/"><span style="font-weight: bold;">google site</span></a> (misalnya)...<br /><br /><br /><br /><p>Jika kamu masih ragu kamu bisa menghubungi saya melalui komentar dan saya akan senang untuk membantu.</p>

Posted by Hii Sekai

Memasang Widget Google Translate di Tiap Posting

<div style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img alt="Google Translate" border="0" height="100" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOu6XKv1ACzvzkCETaEr7bAGDKmaFieaJpi7xWm6qeB1xOXxVWyICw3RJNDQM1xnyu-Dl1su5n0CBXAJsfhcGROxIfZecPgUi_qvaHz3K_-bCrzze2jvuFlsamLPWLxolTGklXX35eqVA/s200/Google+translate.jpeg" width="100" /></div><p>Hmm... dari judul aja udah ketahuan ketinggalan zamannya. Udah banyak OB yang memposting ini.  Yah, daripada ngga ada sama sekali, mending di-ada-in.  Kata-kata klasik yang muncul hanya sekedar untuk menambah daftar postingan. <b>Widget</b> ini berguna agar yang diterjemahkan adalah halaman yang bersangkutan saja, atau dengan kata lain "tidak seluruh blog". Demonya dapat kamu kunjungi blog <a href="http://utuharies.blogspot.com/" target="_blank">utuharies.blogspot.com</a>. Tertarik untuk memasang <i>widget</i> ini, ayo kita ulas <i>trik blogger</i>-nya "tarik mang..." :</p><a name='more'></a><ul><li>Login dulu ke account blogger kamu.</li><br /><li>Pilih tab Tata Letak --> Edit HTML --> centang "Expand Widget Templates".</li><br /></ul><p>Tips : Sebelum melakukan edit template, sebaiknya simpan dulu template kamu yang ada dengan meng-klik tulisan Download Template Lengkap. Kemudian simpan dalam harddisk atau media penyimpanan lainnya, sehingga jika terjadi hal-hal yang tidak diinginkan kamu sudah memiliki back-up untuk mengembalikannya seperti semula.</p><ul><li>Cari kode seperti di bawah ini :</li><br /></ul><pre><b:if cond='data:blog.pageType == "item"'><br /><data:post.body/><br /><red></b:if></red></pre><p>Tips : Kalau susah mencarinya, coba tekan tombol F3 di keyboard. Maka akan timbul menu toolbar pencarian di bawah browser (Firefox), sehingga kamu tinggal memasukkan kata yang ingin dicari.</p><ul><li>Masukkan kode <i>Google translate</i> berikut di atas kode yang berwarna merah :</li><br /></ul><pre><div style='text-align: <b><span style="color: blue;">right</span></b>;'><div id='google_translate_element'/><script><br />function googleTranslateElementInit() {<br />new google.translate.TranslateElement({<br />pageLanguage: '<b><span style="color: red;">id</span></b>'<br />}, 'google_translate_element');<br />}<br /></script><script src='http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit'/></div></pre><ol><li>Translate akan muncul di kanan bawah postingan kamu.</li><br /><li>Kode yang berwarna biru dapat kamu ganti dengan center (tengah) atau left (kiri).</li><br /><li>Kode translate hanya berlaku untuk blog yang berbahasa Indonesia, coba perhatikan kode yang berwarna merah (id).</li><br /></ol><p>Jika kamu ingin meletakkan <i>Google translate</i> di kanan atas tepat di bawah judul posting, cari kode di bawah ini :</p><pre><div class='post-body'><br /><b><span style="color: red;"><b:if cond='data:blog.pageType == "item"'></span></b><br /><style>.fullpost{display:inline;}</style><br /><p><data:post.body/></p><br /><b:else/>ta:blog.pageType == "item"'><data:post.body/></b:if></pre><p>Copy kode <i>Google translate</i> di atas dan paste-kan di bawah kode yang berwarna merah.</p><ul><li>Jangan lupa disimpan.</li><br /></ul><p>Catatan penting: gunakan bahasa Indonesia yang baik dan benar dalam melakukan posting, sehingga hasil translate akan mendekati maksud serta tujuan penulis.</p><p>Sekarang lihatlah tampilan salah satu postingan di blog kamu, udah terpampang translate-nya atau belum...</p>

Posted by Hii Sekai