blogger-newbie, panduan belajar blog bagi pemula

Tutorial Lengkap Setting Squeeze Page Gunakan Photoshop

10.31.00 eka julianto arif 0 Comments



Bagi Anda pemain bisnis internet yang sudah master atau dibilang expert tidak perlu ikuti tutorial ini. Tutorial ini hanya untuk pemula seperti saya ini. Jika anda belum faham apa itu Squeeze Page bisa saya jelaskan sedikit.

Squeeze page ialah Sebuah halaman yang menarik, agar pengunjung mengisi Form Optin nya. Optinnya itu bisa berupa nama, email, nomor handphone, pekerjaan, pada umumnya Optinnya hanya untuk mendapatkan Email. Agar bisa memasarkan melalui trik email marketing. Bisa anda lihat contoh Squeeze page saya ini Disini => Contoh Squeeze Page dan Demo nya.



Dengan squeeze page anda bisa memberikan berupa bonus ebook, template, plugin WP, dan lainnya. Umumnya para internet marketing memberikannya dalam bentuk ebook.

Langsung saja dimulai yah saya lihat anda sudah tidak sabar. hehehehe..

Sebelum memulai ada baiknya anda mendownload 3 squeeze page yang eye catching ini. Yang sudah saya terapkan di bisnis internet saya. Penasaran? Download disini => Download Free Squeeze Page 

http://www.bisniseka.com/freedownload/

Jika sudah anda silahkan buka Squeeze page tersebut, coba anda ikuti tutorial dibawah ini.
Di tutorial kali ini saya ingin menggunakan contoh Squeeze page yang So Green.
Mungkin agak panjang, maka itu perhatikan baik-baik.
Buka Layoutnya di Photoshop.





Edit Bagian Headernya, contohnya, Download GRATIS!!


Pada bagian Shape yang berwarna hijau yang berada dibelakang DOWNLOAD, edit saja dengan Klik Move Tool dan pencet Tombol CTRL + T , sesuaikan ukurannya sesuai dengan tulisan DOWNLOAD nya. Jika sudah sesuai tekan tombol enter.








 Pada bagian tengahnya, sama saja mengeditnya menggunakan horizontal Type Tool (T), ubah tulisannya sesuai selera anda. Seperti contoh saya di bawah ini..


Untuk anda yang belum bisa membuat cover ebook seperti gambar diatas. Bisa Anda lihat artikel tutorial saya yang telah saya tulis dan buat dalam bentuk video tutorial.

Lihat disini: VIDEO TUTORIAL MEMBUAT COVER EBOOK

Pada bagian bawah yaitu untuk mendapatkan optin pengunjung sama juga gunakan kreatifitas anda untuk menarik pengunjung mengisi Form Optin nya. Gunakan Horizontal Type Tool, caranya sama saja.

 

Jika Sudah Save terlebih dahulu dengan eksistensi .psd. 
Agar bisa dipanggi dalam bentuk web, lihat terlebih dahulu ukuran banernya masing-masing. Disana terdapat 3 bagian saja, bagian Header, bagian tengah dan bagian Optin.

Untuk Bagian header bisa anda lihat di folder image nya dan lihat ukurannya berapa.

 

Header 1


Bagian ini anda bisa lihat ukuran gambarnya 

 

ukuran dimensionsnya 1000 x 166 pixels




 Klik Image => Canvas Size => ganti ukurannya dengan pixels: 1000 x166



Pada bagian Anchor nya klik bagian atas tanda panahnya, seperti contoh dibawah ini.




kalau sudah klik Ok dan klik Proceed.


Kemudian Save As,

Timpah namanya dengan header1.png agar tertimpah file sebelumnya.


Lihat file index.html nya, buka gunakan Front Page atau Dreamweaver, atau yang lainnya. Lihatlah sudah terjadi perubahan.



 Close Layout Photoshop tersebut, tetapi jangan di save yah. Langkah pertama sudah selesai.

Header 2

Langkah selanjutnya yaitu mengubah Header 2. 
Caranya sama seperti mengubah header 1.
Buka kembali File Layout Photoshop Squeeze Page tadi.

Lihat Size Dimensionsnya 

Pada bagian Anchor nya klik bagian tengahnya, seperti contoh dibawah ini.



Karena tampilannya kacau seperti di bawah ini, bisa anda akalin.


caranya dengan lihat Layernya hilangkan tanda mata di bagian logo dan Optinnya. Kemudian drag saja header2 tersebut ke bawah. Lihat contoh dibawah ini:



Drag eCoverDescriptor nya atau Header 2 tadi kebawah



Selanjutnya Save As, timpah File Header2.png tadi dengan file baru ini.
Close photoshopnya tetapi jangan di save, tinggal satu langkah lagi.

Coba Anda lihat hasilnya di index.html nya tadi, dengan di refresh dan lihatlah hasilnya berubah.



Opt In

Pada bagian Opt In terbagi 3 di folder image tersebut, ada bagian OptInTop.png , OptIn.png dan OptInBottom. Caranya juga sama saja sih.
OpInTop        : dimensions 1000 x 136 pixels

Pada layer OptIn-nya saja di tampilkan, layer yang lainnya disembunyikan saja.
Seperti biasa klik image => Canvas Size => Lihat Gambar dibawah

 
Sesuaikan gambar tersebut dengan ukuran dimensinya. Save As dan Replace seusai nama yaitu OpInTop.png. Agar tertimpah file sebelumnya dengan file baru.

Tampilan di Index.html nya seperti dibawah ini, baru diatasnya yang jadi.




OpIn               : Dimensions 1000 x 302 pixels

Pada layer OptIn-nya saja di tampilkan, layer yang lainnya disembunyikan saja.
Seperti biasa klik image => Canvas Size => Lihat Gambar dibawah

 

Drag saja OpInnya dan sesuaikan tampilannya seperti sebelumnya.


Buka index.html nya lihat hasilnya seperti dibawah ini, tampilan bawahnya masih pecah, maka itu kita edit OpInBottomnya:


OpInBottom : Dimensions 1000 x 88 pixels
 

Pada layer OptIn-nya saja di tampilkan, layer yang lainnya disembunyikan saja.
Seperti biasa klik image => Canvas Size => Lihat Gambar dibawah
 



Kemudian Save As dan timpah file OptInBottom.png nya di folder image.

Lihat hasilnya dengan melihat index.html nya, seperti contoh gambar dibawah ini.

Untuk Ubah Tombol Claim It Now! bisa anda buka file button.psd nya kemudian edit sesuka hati anda.

Pada bagian Form Opt In bisa anda edit menggunakan Microsoft Front Page, Dreamweaver dan lainnya. Yang penting gunakan software edit html. Setelah selesai kemudian di save.

Untuk kode script Autorespondernya berbeda setiap akunnya. Anda terlebih dahulu membuat akun autoresponder untuk menangkap list pelanggan.

Pada bagian Form class, ganti dengan script autoresponder anda.


Ganti dengan script Autoresponder anda seperti contoh autoresponder saya.



Jika Anda belum punya akun Autoresponder untuk email marketing, bisa anda Gunakan Fasilitas ini Silahkan KLIK DISINI

Oh iya jangan lupa Upload file squeeze page anda tadi dengan menggunakan File Zila atau upload di File Manager Cpanel anda. Upload di Public_html dan buat di folder baru, misalnya freedownload. Jadi untuk mengakses Squeezepage anda yaitu www.namadomain.com/folder/. Contohnya www.bisniseka.com/freedownload/


Enjoy dan jangan lupa di share jika anda mengambil manfaat artikel saya ini.

0 komentar:

Silahkan beri komentar, terima kasih sudah berkunjung..