Blogspot
Assalaamu'alaikum,
wah dah lama nih ngga jumpa. Sekarang saya ingin menulis tentang
mensetting image yang kita upload pada blog. Biasanya perkara ini mudah
bagi para blogger senior tapi untuk yang pemula hal ini bisa berjam-jam
untuk menempatkan posisi image yang kita upload untuk menyisipkannya di
posisi yang diidam-idamkan pada artikel. http://tutorialblog-seo.blogspot.com/2011/06/bisnis-affiliasi-dengan-amazoncom.html
Nah caranya gini.
- Upload Image
Pada tab Compose klik insert image
Browse dan pilih gambar yang image yang ingin kita upload
Contoh script image yang pertama tampil akan seperti ini :
<div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6QXU3ZYI1lcuHCf2JAQDgW3FC6oFqZSpy4nHrz1mMKl_8jdTv0MnjzSy0BQxnGF1WMH3E9Ptq8SfZD542xYjo4GFKl2DUERH3V3j9jKKLMK05kWGJb4b5wr8TtuAiybENaOAROQ9Vhrw/s1600/insert+image.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="68" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6QXU3ZYI1lcuHCf2JAQDgW3FC6oFqZSpy4nHrz1mMKl_8jdTv0MnjzSy0BQxnGF1WMH3E9Ptq8SfZD542xYjo4GFKl2DUERH3V3j9jKKLMK05kWGJb4b5wr8TtuAiybENaOAROQ9Vhrw/s320/insert+image.jpg" width="320" /></a></div>
- Menghapus Link
Lalu hapus seluruh kode sebelum dan sesudah : <img
<div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6QXU3ZYI1lcuHCf2JAQDgW3FC6oFqZSpy4nHrz1mMKl_8jdTv0MnjzSy0BQxnGF1WMH3E9Ptq8SfZD542xYjo4GFKl2DUERH3V3j9jKKLMK05kWGJb4b5wr8TtuAiybENaOAROQ9Vhrw/s1600/insert+image.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="68" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6QXU3ZYI1lcuHCf2JAQDgW3FC6oFqZSpy4nHrz1mMKl_8jdTv0MnjzSy0BQxnGF1WMH3E9Ptq8SfZD542xYjo4GFKl2DUERH3V3j9jKKLMK05kWGJb4b5wr8TtuAiybENaOAROQ9Vhrw/s320/insert+image.jpg" width="320" /></a></div>
Jadinya hanya tinggal seperti ini:
<img border="0" height="68" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6QXU3ZYI1lcuHCf2JAQDgW3FC6oFqZSpy4nHrz1mMKl_8jdTv0MnjzSy0BQxnGF1WMH3E9Ptq8SfZD542xYjo4GFKl2DUERH3V3j9jKKLMK05kWGJb4b5wr8TtuAiybENaOAROQ9Vhrw/s320/insert+image.jpg" width="320" />
- Mengatur Posisi Image
Nah sudah selesai. Tinggal letaknya aja, mau di sebelah kiri, kanan, atau tengah.
Caranya tambahkan align="" :
Contoh Kiri :
<img align="left" border="0" height="68" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6QXU3ZYI1lcuHCf2JAQDgW3FC6oFqZSpy4nHrz1mMKl_8jdTv0MnjzSy0BQxnGF1WMH3E9Ptq8SfZD542xYjo4GFKl2DUERH3V3j9jKKLMK05kWGJb4b5wr8TtuAiybENaOAROQ9Vhrw/s320/insert+image.jpg" width="320" />
Kalau Kanan :
<img align="right" border="0" height="68" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6QXU3ZYI1lcuHCf2JAQDgW3FC6oFqZSpy4nHrz1mMKl_8jdTv0MnjzSy0BQxnGF1WMH3E9Ptq8SfZD542xYjo4GFKl2DUERH3V3j9jKKLMK05kWGJb4b5wr8TtuAiybENaOAROQ9Vhrw/s320/insert+image.jpg" width="320" />
Kalau Tengah:
<img align="center" border="0" height="68" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6QXU3ZYI1lcuHCf2JAQDgW3FC6oFqZSpy4nHrz1mMKl_8jdTv0MnjzSy0BQxnGF1WMH3E9Ptq8SfZD542xYjo4GFKl2DUERH3V3j9jKKLMK05kWGJb4b5wr8TtuAiybENaOAROQ9Vhrw/s320/insert+image.jpg" width="320" />
- Mengatur Ukuran Gambar
Bisa kan? sekarang kita atur ukurannya. Kalau width = lebar kesamping, kalau height = panjang kebawah. Tinggal diatur sesuai keinginan kita ukurannya. Ukuran yang dipakai adalah satuan pixel.
- SEO
Nah satu lagi, agar image kita cepat terindeks oleh search engines maka tambahkan alt="" pada script image.
Contoh :
<img align="center" alt="insert image" border="0" height="68" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6QXU3ZYI1lcuHCf2JAQDgW3FC6oFqZSpy4nHrz1mMKl_8jdTv0MnjzSy0BQxnGF1WMH3E9Ptq8SfZD542xYjo4GFKl2DUERH3V3j9jKKLMK05kWGJb4b5wr8TtuAiybENaOAROQ9Vhrw/s320/insert+image.jpg" width="320" />
alt di sini diisi sesuai dengan kategori image misalnya gambar bis tingkat maka, alt="bis tingkat"
Dah selesai! Sebenarnya materinya ringan ya, tapi mudah-mudahan ada manfaatnya. Wassalaam.
| Tweet |
{ 0 comments... Views All / Send Comment! }
Post a Comment