Melanjutkan posting terdahulu disini Link ini tentang upload gambar untuk gallery yang memiliki banyak teknik. Media uploader yang
stabil dan eksis diperlukan agar dikemudian hari gambar pada blog tidak
mengalami masalah.
Meng-upload gambar di blog untuk mengisi widget / gadget
sangat mudah tetapi mencari widget yang mendukung fitur gallery tidak ada
secara default. Kita harus membuatnya sendiri dengan cara menambahkan kode HTML
dan CSS. Bila widget yang tersedia berupa HTML/Javascript maka persoalannya
adalah kita memerlukan uploader. Media uploader untuk menyimpan gambar atau
foto milik kita sendiri memang banyak tetapi perlu dipertimbangkan berbagai hal
seperti potensi error yang bisa terjadi dan dukungan aplikasinya. Contohnya
Picasa yang sekarang telah discontinued lalu digabung menjadi Google Photo,hal
ini dapat menyebabkan perubahan pada alamat gambar sehingga tumbnail kosong. Sedangkan
ImageShack sebagai aplikasi penyimpanan gambar yang bersifat berbayar sehingga
riskan. Lalu bagaimana cara mengatasinya?
Blogger sebenarnya telah menyediakan default uploader gambar
yang bisa dimanfaatkan secara optimal. Google telah memperhitungkan hal itu dan kita dapat memanfaatkannya secara mudah,efektif
dan efisien,jadi kita tidak perlu repot mencari aplikasi tambahan dalam
mengelola media penyimpanan gambar atau foto. Bagaimana dengan ID dan alamat
gambar yang panjang? Kita akan membuatnya menjadi lebih singkat, berikut tahapan
memanfaatkan uploader di blogger :
Buka Dashboard dan buat entry baru (New Post) dengan mode
Compose. Pilih menu upload gambar yang tersedia. Setelah ter-uploaded lalu klik
gambar pilih ukuran asli (Original Size) dan isi property gambar sebagai
berikut, Title Text di isi dengan
judul posting tetapi dipersingkat. Misalnya “tutorial Upload gambar dan foto”
menjadi “upload gambar”. Kemudian ALT
Text di isi dengan nama gambar misalnya “bunga.jpg”. Setelah diberikan
property gambar lalu di “Save” tetapi
jangan di “Publish”. Pindah ke mode
HTML dan copy alamat serta ID gambar. Contoh :
<div class="separator" style="clear: both;
text-align: center;">
<a href="https://3.bp.blogspot.com/-9jNYgt4x1q6/WxGho0J9SPN/AACCAAKABBr/j-3KsytPC1gZccAIdgxYy68HlBMnC21RwCLcBMAs/s1600/flower.jpg"
imageanchor="1" style="clear: left; float: left; margin-bottom:
1em; margin-right: 1em;"><img border="0" data-original-height="300"
data-original-width="615" src="https://3.bp.blogspot.com/-9jNYgt4x1q6/
WxGho0J9SPN/ AACCAAKABBr/j-3KsytPC1gZccAIdgxYy68HlBMnC21RwCLcBMAs/s1600/flower.jpg"
/></a></div>
Lalu “Save” tetapi
jangan di “Publish”, sehingga
posting tersebut menjadi Draft saja. Kemudian copy dan simpan alamat serta ID
gambar tersebut di notepad atau aplikasi sejenisnya sebagiai dokumentasi anda.
Ada dua cara menggunakan alamat dan ID gambar tersebut,
tergantung kebutuhan anda. Misalnya untuk di widget gambar maka anda copy-paste
ke widget sebagai berikut :
<a href=’https://3.bp.blogspot.com/-9jNYgt4x1q6/WxGho0J9SPN/AACCAAKABBr/j-3KsytPC1gZccAIdgxYy68HlBMnC21RwCLcBMAs/s1600/flower.jpg’
imageanchor=’1’ style=’clear: left; float: left; margin-bottom: 1em;
margin-right: 1em;’><img border=’0’ data-original-height=’300’
data-original-width=’615’ src=’https://3.bp.blogspot.com/-9jNYgt4x1q6/ WxGho0J9SPN/
AACCAAKABBr/j-3KsytPC1gZccAIdgxYy68HlBMnC21RwCLcBMAs/s1600/flower.jpg’ /></a>
Bila anda ingin menggunakannya di menu “Theme”
untuk “Edit HTML”, agar lebih
efisien dan tidak membingungkan maka anda dapat mempersingkat kodenya dan
menambahkan <a href=’#’> menjadi seperti
ini :
<a href=’#’><img src=’https://3.bp.blogspot.com/-9jNYgt4x1q6/
WxGho0J9SPN/ AACCAAKABBr/j-3KsytPC1gZccAIdgxYy68HlBMnC21RwCLcBMAs/s1600/flower.jpg’
/></a>
Apakah cukup dengan ID gambar saja tanpa alamat gambar tanpa
perlu mengisi <a href=’#’>? Iya,itu sudah cukup karena gambar kita
sudah ada di peyimpanan default pada blogger.
Cara mengcopy bagian kode dengan klik text lalu seleksi dan
tekan CTRL+C. Selamat mencoba, salam blogger
0 Comments:
Post a Comment