All About Blog

Cara Pasang favicon dan atribut di blogger

2012-05-15T12:53:00.000+07:00

Beberapa tips untuk pemasangan favicon dan penghilangan atribut di blogspot seperti berikut ini

1. Memasang favicon

Pasang kode berikut dibawah kode </head>

<link rel="shotcut icon" href=" alamat favicon anda "/>

Atau

<link href=' alamat favicon anda ' rel='icon' type='image/vnd.microsoft.icon'/>

Atau

<link href=' alamat favicon anda ' rel='icon' type='image/x-icon'/>

2. Menghilangkan Navbar Blogger

Masukan kode berikut di atas kode ]]></b:skin>

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

Atau cara kedua (menyembunyikan, tapi jika mouse diarahkah ke atas navbar akan kelihatan)

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

3. Menghilangkan tulisan Subscribe to : post (atom)

Caranya hapus kode berikut :

<div class="feed-links">
<data:feedlinksmsg>
<b:loop values="data:links" var="f">
<a class="feed-link" href="data:f.url" type="data:f.mimeType" target="_blank"><data:f.name> (<data:f.feedtype>)</data:f.feedtype></data:f.name></a>
</b:loop>
</data:feedlinksmsg></div>

4. Menghilangkan icon obeng dan tang

Caranya pasang kode berikut diatas ]]></b:skin>

.quickedit{
display:none;
}

Atau hapus langsung kode berikut :

<b:include name='quickedit'/>

5. Menghilangkan Angka Dalam Label

caranya hapus kode berikut:

(<data:label.count/>)

6. Menghilangkan Pesan Pencarian Blogger

Caranya masukan kode berikut diatas ]]></b:skin>

.status-msg-wrap{
display:none;
}

7. Menghilangkan logo blogger di comment:

Cari kode berikut ini :

<dt expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>

Ganti dengan kode berikut :

<dt expr:class='"comment-author " + data:comment.anchorName' expr:id='data:comment.anchorName'>

8. Menghilangkan Bagian Elemen ketika di Page (hanya tampil di frontpage)

<b:if cond='data:blog.pageType != "item"'>

elemen yang ingin dihilangkan (hanya tampil di frontpage)

</b:if>

That All about Blog tips, Terima kasih dan semoga membantu anda semua !

Cara menuliskan URL Backgroud Image

2012-03-20T13:16:00.000+07:00

Sebelum meneruskan mengikuti tips dan tricks ini perlu diketahui bahwa panduan ini akan bermanfaat ketika d’blogger punya keinginan untuk menuliskan URL background sebuah gambar pada sebuah syntax secara lengkap di halaman ketika posting kode HTML sehingga image yang kita buat dapat diakses dan dimanfaatkan oleh semua pengunjung.

Perlakukan seperti dilakukan dengan pertimbangan daripada gambar yang kita buat dan miliki hanya sekedar jadi milik pribadi yang mubazir. Oleh karena itu jika anda mempunyai pemikiran untuk berbagi gambar, silahkan kembali untuk melanjutkan!

Kekacauan yang terjadi ketika memposting syntax CSS yang melibatkan sebuah URL atau link image yang dipergunakan sebagai background, pasti banyak dialami d’blogger.

Contoh Syntax dengan background-image dari sebuah URL

Dua contoh hasil posting di bawah ini akan memperlihatkan cara posting yang benar dengan hasil sempurna di halaman blog dan hasil lain yang terlihat amburadul dan biasanya banyak dialami d’blogger, sehingga seringkali link image akhirnya dipotong supaya posting tidak terlihat kacau.

Hasil Posting URL Background Image Sempurna

#kandangkerbau{

width:300px;

height:200px;

border:solid #000 4px;

background:url(http://semuanyakomputer.blogspot.com/files/2011/08/kerbaudankawan2.jpg) no-repeat;

}

Hasil Posting URL Background Image Kacau !

#kandangkerbau{

width:300px;

height:200px;

border:solid #000 4px;

background:url http://semuanyakomputer.blogspot.com/...) no-repeat;

}

Perhatikan URL hasil posting di atas! Contoh pertama yang sangat sempurna dengan URL sekaligus seluruh kode terlihat utuh, sedang contoh kedua hasilnya tampak hancur karena bagian belakang URL lenyap seperti habis digerogoti rayap. Cermati juga kode didepan http (tanda kurung buka) yang juga hilang tak berbekas. Dengan kondisi ini beberapa blogger akhirnya memotong bagian depan URL hingga posting menjadi seperti ini :

Posting dengan memotong URL Background Image

#kandangkerbau{

width:300px;

height:200px;

border:solid #000 4px;

background:url(......../images/kerbaudankawan2.jpg) no-repeat;

}

Tips dan Tricks Menuliskan URL Background Image

Ada dua yang bisa digunakan untuk menuliskan URL secara lengkap dengan hasil dihalaman blog tanpa cacat.

Cara Pertama

Cara pertama dilakukan dengan menambahkan kode " (petik dua) sebelum dan sesudah URL background.

#kandangkerbau{

width:300px;

height:200px;

border:solid #000 4px;

background:url("http://semuanyakomputer.blogspot.com/files/2011/08/kerbaudankawan2.jpg") no-repeat;

}

Cara Kedua

Cara kedua dilakukan dengan mengganti kode // (setelah http:) dalam bentuk kode berbeda berupa &#47;&#47; , hingga penulisan kodenya menjadi seperti ini :

#kandangkerbau{

width:300px;

height:200px;

border:solid #000 4px;

background:url(http:&#47;&#47;semuanyakomputer.blogspot.com/files/2011/08/kerbaudankawan2.jpg) no-repeat;

}

Kedua cara di atas sudah terbukti sangat manjur dan jika anda akan menampilkan URL secara lengkap maka hasil penulisan yang terlihat di halaman posting akan 100% sempurna dengan fungsi kode tetap berjalan sebagaimana mestinya. Silahkan anda pilih cara yang termudah menurut anda.

Keterangan/Catatan:

Kode " (tanda petik dua) dapat diganti dengan ‘ (tanda petik satu).
Lakukan posting yang melibatkan kode HTML selalu menggunakan Mode Posting HTML (bukan Mode Posting VISUAL).

Cara Sederhana Memproteksi Gambar di Blog

2012-03-20T12:58:00.000+07:00

Untuk saat ini rasanya sangat mustahil menghindari seseorang menyalin dan menyimpan gambar yang ada dihalaman blog anda. Hanya dengan melakukan klik kanan dan "save as" siapapun dapat dengan mudah mengambil gambar anda hanya dengan hitungan detik.

Nah disini sebenarnya ada Trik/Cara untuk Proteksi gambar secara sederhana yang bisa anda lakukan untuk menghindari gambar anda di simpan dari tangan-tangan jahil, dimana hasil dari gambar yang dicoba disimpan nantinya hanya berupa gambar kosong.

Kode standar dari gambar biasanya seperti ini:

<img width="500" height="375" src="http://www.o-om.com/contohgambar.jpg"/>

Dengan menerapkan kode sederhana dibawah ini yaitu dengan hanya mengubah artibut src dan penggunaan css style langsung pada gambar maka cara Trik dibawah ini akan menciptakan gambar kosong pada hasil download.

<img style="background-image:url('http://www.o-om.com/contohgambar.jpg');" src="data:image/gif;base64,R0lGODlhAQABAIAAAP ///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" width="500" height="375"/>

Ingat! selalu pastikan ukuran size dari gambar harus sama dengan aslinya. Walaupun Trik ini menurut saya tidak 100% akurat paling tidak khan cara ini bisa sedikit mengurangi dari tangan pengguna yang non-teknis :)

Cara Membuat Like button di Blogger

2012-03-11T12:49:00.000+07:00

Tutorial atau cara untuk meletakkan button like untuk blog anda, ini seperti di bawah:

1. Login akun blogger, dari dashboard > design > add a gadget > HTML javascript

2. Copy dan paste kode di bawah ini ke dalam ruangan HTML/javascript

<iframe scrolling="no" frameborder="0" allowtransparency="true" style="border: medium none; overflow: hidden; width: 280px; height: 40px;" src="http://www.facebook.com/plugins/like.php?href=http://URL-ANDA.blogspot.com&layout=standard&show_faces=false&width=280&action=like&font=arial&colorscheme=light&height=40"></iframe>

note: Gantikan URL-ANDA dengan url blog anda

3. Save dan lihat hasilnya.:)