Gambar Blog
Postingan yang kita tulis pada blog Anda, akan lebih komunikatif apabila disertakan gambar-gambar yang sesuai dengan isi dari artikel atau postingan tersebut.Berikut beberapa tips untuk Anda dalam memasukan gambar ke sebuah artikel:
1.Optimalkan penggunaan gambar
dengan memberikan nama file jangan terlalu panjang. Apabila nama terlalu panjang alih-alih nama file dari gambar anda dirubah secara otomatis dengan nama generik, seperti 00001.jpg yang tidak mempunyai arti sama sekali.
2.Cara memasukan gambar
a.Memasukan gambar dalam postingan
-Klik tombol tambah gambar di toolbar atas edit entri
-Klik tombol Browse -> pilih file gambar
-Tentukan posisi gambar dalam posting pada pilih tata letak
-Tentukan ukuran gambar (kecil, Menengah atau Besar)
-Klik tombol Unggah Gambar
-Terakhir Klik tombol Selesai
b.Memasukkan gambar sebagai Widget
-Klik Dasbor -> Rancangan
-Klik Elemen Laman -> Tambah Gadget
-Klik tanda + pada pilihan gambar
-Beri judul dan keterangan gambar
-Jika gambar yang kita inginkan dari komputer kita klik tombol browse
-Jika gambar dari situs lain, ketik url-nya di kotak hubungan/link
-Terakhir klik tombol simpan
3.Cara menghilangkan garis tepi gambar
Gambar yang kita masukkan dalam blog secara default akan ditampilkan dengan garis tepi. Yang biasanya garis tepi dari gambar tersebut kurang bagus dari sebuah tampilan.
Perhatikan gambar diatas dan gambar berikut yang mempunyai garis tepi:
Berikut cara menghilangkan garis tepi gambar pada blog:a.Masuk ke account blogspot anda
b.Klik Rancangan -> Edit HTML
c.Cari script/kode css dibawah, pergunakan CTRL+F untuk mempercepat pencarian:
.post img { <-- perhatikan kode ini
padding:4px;
border:1px solid $bordercolor;
}
padding:4px;
border:1px solid $bordercolor;
}
atau seperti ini
.post .post-body img ,.post .post-body a img {
border-style:solid;
border-width:1px;
padding:5px;
}
border-style:solid;
border-width:1px;
padding:5px;
}
d.Rubah angka 1 dengan angka 0, sehingga tampilannya kurang lebih seperti ini:
.post img { <-- perhatikan kode ini
padding:4px;
border:0px solid $bordercolor;
}
padding:4px;
border:0px solid $bordercolor;
}
e.Klik Save Template
f.Sekarang lihat hasilnya, gambar sudah tidak memiliki lagi garis tepi.
Semoga Bermanfaat.
0 comments:
Post a Comment