5 Maret 2014

4 Langkah: Cara Memasukkan Gambar ke Postingan



Saya tak tahu apakah saya sudah pernah menuliskan ini sebelumnya. Satu hal yang jelas, saya pernah terhenti ngeblog karena gagal memasukkan gambar ke dalam postingan. Jadi tulisan ini sengaja saya tuliskan buat siapa pun di luar sana yang kesulitan ngeblog bagian ini. Bagian memasukkan gambar ke dalam postingan. Karena sekarang saya sudah bisa memasukkan gambar ke dalam postingan sih tentu saja saya akan mengatakan bahwa memasukkan gambar ke dalam postingan itu adalah keterampilan kecil. Berbeda dengan yang baru saja ngeblog dan ragu-ragu untuk mencoba. Silakan baca lanjutan tulisan ini di bawah untuk tahu bagaimana caranya memasukkan gambar ke dalam postingan.

1. Pilih 'new entry' atau kotak jingga dengan gambar pensil
Ini pilihan yang kita lakukan saat akan membuat postingan seperti biasa. Semoga teman-teman tak ada kesulitan masalah memasukkan tulisan ke dalam blog. Kalau memang masih bingung bisa baca dulu caranya memasukkan tulisan ke blog.






2. Klik 'insert image' yang terletak di samping 'link' di atas kotak postingan
Silakan lihat kursor saya mengarah ke mana. Nah di situ tempatnya kita memasukkan gambar. Walaupun sebenarnya kalau teman-teman sudah mengunggah foto di tempat lain bisa copy imagenya dan paste di dalam kotak postingan. Itu barangkali jauh lebih mudah tapi sayangnya gambar suka menghilang jika tidak kita unggah langsung di postingan yang bersangkutan.



3. Pilih gambar


Kita bisa mengunggah gambar yang ada di dalam komputer. Jadi sudah tersimpan rapi di database kita. Sebagai contoh saya pilih gambar profil facebook saya beberapa tahun yang lalu. Tinggal klik saya dan foto akan terunggah.


4. Klik Gambar


Klik gambar yang ingin kita masukkan ke dalam postingan. Lalu 'add selected' dan dalam sekejap foto yang ingin kita masukkan dalam postingan akan ada di dalam sana.


Mudah bukan?

7 Langkah: CSS Untuk Membuat Gambar di Postingan Membesar dengan Kursor







Ini memang blog tentang traveling dan kuliner. Karena akhir-akhir ini banyak masakan yang gagal dan jarang jalan-jalan kecuali pulang kampung. Makanya sekarang berbagi tips aja buat teman-teman yang baru ngeblog. Biasanya saya berbagi tips yang sudah saya gunakan. Kemarin akhirnya saya menemukan caranya supaya kita bisa membuat tampilan gambar di postingan kita membesar saat kursor menyentuh gambar tersebut.

Karena saya sendiri lumayan terganggu dengan tampilan gambar yang tak bisa maksimal di blog. Kalau ditampilkan utuh malah meleber ke samping dan menutupi tulisan yang ada di sidebar. Kelebihan gitu gambarnya. Sedangkan mau mengedit templatenya supaya ukuran kotak postingannya lebih besar juga belum tahu caranya. Maklum ini template gratisan milik Enny Law. Jadi yang harus saya pikirkan adalah bagaimana caranya supaya pembaca tetap bisa mendapatkan gambar yang besar di dalam setiap postingan walaupun gambarnya tidak ditampilkan seutuhnya. Cukup dekatkan kursor ke gambar di dalam postingan tersebut, gambarnya pun menjadi maksimal.

Langkah yang dilakukan sangat mudah. Teman-teman tinggal ikuti saja langkah di bawah ini.

1. Buka dashboard
Silakan log in ke dashboard dengan memasukkan ID dan password yang kita gunakan untuk blog.

2. Buka template
Lalu buka template.

3. Sesuaikan
Pilih sesuaikan.


4. Tingkat lanjut
Pilih 'tingkat lanjut' di bagian paling bawah.




Tambahkan CSS
Pilih 'tambahkan CSS' lalu masukkan CSS di bawah ini semuanya ke dalam kotak tersebut.
.post img, table.tr-caption-container { border:none; max-width:560px; height:auto; -o-transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; }

.post img:hover { -o-transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transform: scale(1.5); -o-transform: scale(1.5); -webkit-transform: scale(1.5); -webkit-border-radius: 0px 0px; -moz-border-radius: 0px / 0px; -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6); }




Terapkan ke blog
Klik sudut kanan atas. Terapkan ke blog. Selesai. Sekarang semua gambar yang ada di dalam postingan akan membesar saat kursor menyentuhnya.



Selamat mencoba.


 

Rohani Syawaliah Template by Ipietoon Cute Blog Design