Home » » CARA MEMBUAT HEADER DENGAN PHOTOSHOP DAN MEMASANGNYA DI BLOG

CARA MEMBUAT HEADER DENGAN PHOTOSHOP DAN MEMASANGNYA DI BLOG

Sebelum kita melangkah dalam membuat gambar header yang harus Anda persiapkan dan diketahui terlebih dahulu adalah : 

1. Softwere Photoshop tipe berapa saja. Yang saya pergunakan CS 5
2. Satu atau 2 image jpg, gif atau yang lainnya
3. Mengetahui ukuran header di template blog anda. Cara untuk mengetahu ukuran header buka edit html pada bagian tempelate di dasboar blog anda. Untuk memudahkan pencarian gunakan Ctrl + F setelah pointer mouse anda berada di kotak html. Lalu pastekan #header-wrapper  tekan enter maka akan terbblok kode seperti ini
#header-wrapper {
width:900px;             
height:180px;
Ini adalah untuk ukuran header blog anda. 

Kalau tidak ketemu dengan kata pencarian di atas. Coba ketikkan header di kotak pencarian. Maka akan terdapat banyak header yang muncul.dan kalau ternyata image header anda sizenya none/tidak tersedia karena memang anda sebelumnya gak masang image. Reka-reka saja ukurannya, nanti anda bisa menyesuaikannya dengan ukuran header ketika anda meng upload image di header. 

Baiklah sekarang mari ikuti, langkah mendesain header

Langkah pertama buka photoshop anda. Selanjutnya klik File > New. Kemudian akan buka kotak New, dan aturlah ukuran Widht, Height, dan Resolusinya. Katakanlah 900 Pixel untuk Widht, 180 pixel untuk Height, dan Resolution 72 Fixel. Lalu klik Ok.

Langkah kedua. Ubah canvas/background putih tersebut sesuai dengan selera Anda. Contohnya sebagai berikut : Gandakan Background dengan cara mendrag background (lihat gbr. 1) ke creat a new layer (letaknya di pojok bawah sebelah kanan) maka akan terbentuk Backgroound copy (gbr. 2). 

CARA MEMBUAT HEADER DENGAN PHOTOSHOP DAN MEMASANGNYA DI BLOG
Lalu Klik windows di menu bagian atas klik Style untuk menampilkan macam-macam pilihan warna atau F6. Seperti tampak pada gambar. Lalu klik pilihan warna sesuai dengan pilihan anda. 

CARA MEMBUAT HEADER DENGAN PHOTOSHOP DAN MEMASANGNYA DI BLOG
Tampilan menu Style
Maka hasilnya kurang lebih seperti gambar di bawah ini.

CARA MEMBUAT HEADER DENGAN PHOTOSHOP DAN MEMASANGNYA DI BLOG
Atau Anda juga bisa memasukkan gambar sebagai background header anda. Caranya sebagai Berikut. Klik Tab File > Open. Lalu pilih gambar yang akan Anda jadikan latar Header. 

Lalu drag (tarik) gambar tersebut ke background putih yang tadi Anda buat menggunakan move tool.
Setelah di drag lalu sesuaikan lebarnya dengan menekan Ctrl + T shingga gambar terseleksi membentuk kotak dan tarik pinggir-pinggir foto pada simpulnya, untuk menyesuaikannya sehingga canvas background warna putih tertutup. 
CARA MEMBUAT HEADER DENGAN PHOTOSHOP DAN MEMASANGNYA DI BLOG

Tambahkan gambar yang lain lagi kalau Anda suka. Dan ulangi langkah-langkah seperti di atas. Berkreasilah sampai Anda puas dengan tampilan header Anda.
Aturlah tampilan gambar pada pada kotak sebelah kanan dengan merubah-rubah Layer dari Normal ke overley dan merubah ovacity-nya sesuai selera Anda (no. 2). Coba-cobalah semua menu yang ada. Sedangkan menu tool di sebelah kiri kanvas (no. 1) digunakan untuk memotong, menyeleksi, membuat blur, memberikan tulisan dan sebagainya. Jika anda ingin membuat judul blog atau deskripsi tentang blog anda klik T yang ada di menu tool. Gunakan/klik fx > Stroke untuk membuat efek pada tulisan dan gambar. Gunakan Ctrl + T untuk mengatur besar tulisan dan atur posisi yang anda inginkan dengan move tool.

CARA MEMBUAT HEADER DENGAN PHOTOSHOP DAN MEMASANGNYA DI BLOG
Langkah terakhir dalam membuat gambar simpan Header anda dengan format jpg atau png. Karena akan di pasang diblog gunakanlah ukuran di bawah 100 kb, supaya tidak memberatkan loading blog. Cara menyimpan dan memilih ukuran gambar, lihat postingan saya sebelumnya : Memperkecil File Foto.

MEMASANG GAMBAR HEADER DI BLOG

Masuk ke akun blog anda. Setelah berada di dasboar klik tata letak kemudian klik Edit yang ada pada bagian header. Setelah itu akan muncul seperti gambar ini.

CARA MEMBUAT HEADER DENGAN PHOTOSHOP DAN MEMASANGNYA DI BLOG

Lalu klik browse untuk meng-upload foto header anda. Centang kotak susutkan agar sesuai. Maksudnya untuk menyesuaikan gambar yang Anda upload dengan ukuran header yang ada di template blog Anda. Dan tanda ketiga pilihan yang lain sesuai keinginan Anda.

CARA MEMBUAT HEADER DENGAN PHOTOSHOP DAN MEMASANGNYA DI BLOG

Selanjutnya klik simpan atau save untuk menyimpan perubahan yang telah Anda lakukan. Lihat hasilnya dengan mengklik Lihat blog.

Jika ternyata ukuran gambar yang Anda buat kekecilan atau pun kebesaran Anda bisa merubah ukuran gambar dengan masuk ke photshop lagi dengan mengklik menu Image > Image size.

Sekian. Semoga bermanfaat!

Azanul Ahyan
Azanul Ahyan Updated at: 11/09/2014

10 komentar:

  1. Replies
    1. sama-sama. Terima kasih juga tuk kunjuangannya :)

      Delete
  2. Sangat Berguna Bagi Blogger baru seperti saya. thanks gan.
    http://iza-net.blogspot.com/

    ReplyDelete
  3. terima kasih gan,
    bermanfaat untuk saya yang masih belajar :)
    kunjungi ya gan
    http://berbagi4ever.blogspot.co.id/

    ReplyDelete
    Replies
    1. Terima kasih kembali kawan. Semoga ini betul bisa bermanfaat. :). OK aku akan datang....

      Delete
  4. Nice info agan azanul

    www.temagar.com

    ReplyDelete