Cara Membuat Gambar Membesar Otomatis Ketika Disentuh Mouse

Cara Membuat Gambar Membesar Otomatis Ketika Disentuh MOUSE di Blog:

1. Buka Blogger dan Login.

2. Masuk ke Option Template.

3. Pilih Edit HTML.

4. Tekan Ctrl + f lalu cari kode ]]></b:skin>.

5. Copy paste kode di bawah ini lalu letakkan di atas kode ]]></b:skin>.

.post img, table.tr-caption-container {
border:none;
max-width:auto;
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: 36px 12px;
-moz-border-radius: 36px / 12px;
-webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
}

6. Klik Save dan cek blog Anda.

catatan:
"Angka (1.5) adalah angka pembesaran yang akan terjadi jika gambar di sentuh mouse. Anda bebas mengganti sesuka hati".

Read More

5 Border untuk Mempercantik Gambar Blog

Berikut Cinta Grafis berikan 5 Border untuk Mempercantik Gambar Blog. Anda masukkan salah satu kode CSS yg sudah dipilih sebelum/diatas kode ]]></b:skin>. 

Contoh:

Berikut kode CSS dan Screenshot masing-masing border...

Kode 1

.post-body img{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjj_M6W1NqiWMw63loqIwRl-di9Ju8sYLFytG8BMW7Adhyphenhyphen2YLGdXHEiQRxtULMQKPOoaW5RXJ9nU8-D-28nV6iIkPVpk1cSJydv0ffBK6JzEjjtgmbNF6RWW1EG9IEY9UGhUhudwFiwTp7/w4-h8-no/image-background.png) repeat scroll 0 0 transparent;padding: 7px;border: 1px solid #cecece;-moz-box-shadow: 0px 0px 5px #BBB;-webkit-box-shadow: 0px 0px 5px #BBB;box-shadow: 0px 0px 5px #BBB;}

Kode 2

.post-body img{border-top-width: 4px;border-bottom-width: 4px;border-top-style: double;border-bottom-style: double;border-top-color: #1ABC9C;border-bottom-color: #1ABC9C;padding: 8px 0px;} 

Kode 3

.post-body img{border: 1px solid #000000;padding: 5px;width: auto;background-color: #F389B4;}

Kode 4
.post-body img{border: 1px solid #888888;padding: 10px 10px 10px 10px;}


Kode 5

.post-body img{width: auto;padding: 0px 6px 6px 0px;background-color: #9FB2C1;border-top-width: 2px;border-right-width: 5px;border-bottom-width: 5px;border-left-width: 2px;border-style: solid;border-color: #082F70;}

Read More

Membuat Efek Foto Retro di Photoshop dengan Color Overlay

Pada Tutorial ini kita akan memberi / membuat Efek Foto Retro pada sebuah foto di Photoshop dengan Color Overlay...

Download bahan:

Model

Buka gambar model di Photoshop.

Dobel klik pada layer Background sehingga menjadi Layer 0. Klik menu Layer -> Layer Style -> Color Overlay dan atur seperti gambar.

Hasil akhir...

Read More

Cara Menambah Contrast di Photoshop dengan Black & White Adjustment Layer

Pada Photoshop banyak cara untuk menambah contrast... Kali ini kita akan menggunakan Black & White Adjustment Layer...

Download bahan:
Model

Buka gambar model di Photoshop.

Klik icon Create new fill or adjustment layer  dan klik pada Black & White.

Atur seperti gambar atau kreasi Anda.

Hasil akhir...

Read More

Merubah Warna Mata di Photoshop dengan Color Balance

Tutorial Merubah Warna Mata di Photoshop menggunakan Quick Mask Mode (Q) untuk seleksi bola mata dan Color Balance (Ctrl + B) untuk merubah warna...

Download bahan:
Model

Buka gambar model di Photoshop.

klik icon Edit in Quick Mask Mode (Q) , kemudian klik icon Brush Tool (B) dan sapukan ke area bola mata. Rapikan area seleksi dengan Eraser Tool (E) .

Klik kembali icon Edit in Quick Mask Mode (Q)  sehingga muncul area seleksi di luar bola mata. Tekan Shift + Ctrl + I (Inverse) untuk membalik area seleksi.

Tekan Ctrl + J untuk menduplikat area seleksi (layer 1). Klik Image -> Adjustment -> Color Balance (Ctrl + B) untuk merubah warna bola mata.

Hasil akhir...

Mata menjadi biru

Mata menjadi hijau

Read More

Membuat Tattoo Realistis di Photoshop

Berikut cara mudah Membuat Tattoo Realistis di Photoshop...

Download Bahan:
Model | Tattoo

Buka gambar model di Photoshop.
Klik icon Spot Healing Brush Tool (J) , ubah ukuran brush (Shift + [ / ]) dan sapukan ke tali bra model untuk menghapusnya.

Klik icon Move Tool , kemudian buka dan drag gambar tattoo ke gambar model.

Gunakan Free Transform (Ctrl + T) untuk meresize dan memposisikan gambar tattoo ke punggung model. Ubah juga Blending mode ke Multiply supaya gambar tattoo menyatu dengan warna kulit.

Berikutnya klik menu Edit -> Transform -> Warp. Disini kita atur supaya gambar terlihat real / pas dengan bentuk tubuh.

Hasil akhir...

Read More

Membuat Foto Close Up di Photoshop #2

Tutorial membuat Foto Close Up di Photoshop ini menggunakan Gaussian Blur dan Fade (Shift + Ctrl + F)...

Download Bahan:
Model

Buka gambar model di Photoshop. 

Klik menu Filter -> Blur -> Gaussian Blur.



Klik menu Edit -> Fade Gaussian Blur (Shift + Ctrl + F). Ubah Blending mode menjadi Screen dan atur nilai Opacity.



Klik kembali menu Filter -> Blur -> Gaussian Blur.



Klik menu Edit -> Fade Gaussian Blur (Shift + Ctrl + F). Ubah Blending mode menjadi Softlight dan atur nilai Opacity.



Terakhir kita atur Brightness dan Contrast...

Hasil akhir...  

Read More

Membuat Foto Close Up di Photoshop dengan Posterize dan Blend Mode Softlight

Pada Tutorial ini Cinta Grafis memberikan cara mudah dan cepat membuat Foto Close Up di Photoshop menggunakan Posterize, Gaussian Blur, Blending Mode Softlight / Overlay.

Download Bahan:
Foto Model

Buka foto model di Photoshop.



Duplikat layer (Ctrl + J) dan klik menu Image -> Adjustments -> Posterize...



Klik menu Filter -> Blur -> Gaussian Blur...



Ubah Blending mode ke Softlight / Overlay dan atur nilai Opacity...



Hasil akhir...


Softlight


Overlay

Read More