Di dalam toko online, keberadaan banner memiliki peran yang sangat penting. Salah satunya adalah untuk meng-highlight promo yang sedang berlangsung dan mengarahkan pengunjung ke halaman tertentu untuk melihat detail promo.
Tentu hal ini sangat berpengaruh terhadap konversi penjualan jika dibuat dengan desain dan copywriting yang menggugah.
Dan di tema Kece Toko, tersedia fitur banner yang responsive di berbagai perangkat untuk mendukung fungsi tersebut.
Bagaimana cara membuatnya?
Disinilah kemampuan kita dalam mendesain gambar banner benar-benar diuji. Kita dituntut untuk mendesain gambar yang menarik dan berkualitas supaya pengunjung tertarik.
Artinya kurang bijak jika kita menyematkan terlalu banyak tulisan di gambar banner. Kita cukup menuliskan beberapa kalimat yang menggambarkan special offers yang tidak bisa ditolak oleh calon pembeli.
Lalu dimana kita bisa menulis copywriting yang lebih panjang?
Yes.. memang benar, tugas copywriting adalah untuk membawa pengunjung kepada closing berupa penjualan. Namun kita harus bijak meletakkan kalimat copywriting panjang pada tempat yang tepat.
Misal, kita bisa menuliskannya pada deskripsi produk atau halaman tertentu yang memiliki cukup ruang untuk menuliskannya.
Psikologi pengunjung telah berubah disini. Mereka yang rela melakukan klik pada banner, artinya lebih siap untuk membaca detail yang lebih panjang.
Di tema Kece Toko, saya merekomendasikan Anda membuat gambar banner dengan ukuran 870px X 435px.
Ini penting sekali agar banner tidak memakan banyak ruang, namun tetap menarik untuk dilihat. Jika Anda benar dalam mendesain, ukuran tersebut masih proper untuk dilihat di perangkat mobile sekalipun.
Namun demi mempermudah tutorial untuk para pemula, disini saya akan mengupload gambar di halaman Blogger.
Silakan buka file banner.xml yang sudah di sediakan. Kodenya seperti ini.
<div class="featured-banner">
<a class="image-banner" href="URL-Tujuan">
<img src="URL-Gambar" />
</a>
</div>
Ganti URL-Tujuan dengan URL halaman tujuan saat banner diklik, dan ganti juga URL-Gambar dengan URL gambar yang sebelumnya Anda simpan di notepad.
Selanjutnya kembali ke Blogger dan masuk ke bagian Tata Letak. Scroll ke bawah sampai di bagian Featured Post. Terdapat widget Featured Banner kemudian klik Edit atau simbol tanda pena.
Akan muncul popup window seperti gambar di bawah. Masukkan kode dari file banner.xml yang telah Anda edit di kotak Konten. Lalu klik Simpan.
Hanya dengan teknik sederhana ini, kita telah berhasil membuat banner yang sangat resposive di berbagai perangkat.
Setelah ini kita akan belajar bersama bagaimana Cara Edit Jasa Pengiriman dan Metode Pembayaran di Tema Kece Toko.
Pasti bermanfaat!
Tentu hal ini sangat berpengaruh terhadap konversi penjualan jika dibuat dengan desain dan copywriting yang menggugah.
Dan di tema Kece Toko, tersedia fitur banner yang responsive di berbagai perangkat untuk mendukung fungsi tersebut.
Bagaimana cara membuatnya?
1. Mendesain gambar banner yang menggugah
Perlu di perhatikan bahwa tujuan banner sejatinya adalah untuk mendapatkan klik, bukan penjualan. Karena kita hanya mempunyai waktu beberapa detik saja untuk mendapatkan perhatian dari pengunjung.Disinilah kemampuan kita dalam mendesain gambar banner benar-benar diuji. Kita dituntut untuk mendesain gambar yang menarik dan berkualitas supaya pengunjung tertarik.
Artinya kurang bijak jika kita menyematkan terlalu banyak tulisan di gambar banner. Kita cukup menuliskan beberapa kalimat yang menggambarkan special offers yang tidak bisa ditolak oleh calon pembeli.
Lalu dimana kita bisa menulis copywriting yang lebih panjang?
Yes.. memang benar, tugas copywriting adalah untuk membawa pengunjung kepada closing berupa penjualan. Namun kita harus bijak meletakkan kalimat copywriting panjang pada tempat yang tepat.
Misal, kita bisa menuliskannya pada deskripsi produk atau halaman tertentu yang memiliki cukup ruang untuk menuliskannya.
Psikologi pengunjung telah berubah disini. Mereka yang rela melakukan klik pada banner, artinya lebih siap untuk membaca detail yang lebih panjang.
Di tema Kece Toko, saya merekomendasikan Anda membuat gambar banner dengan ukuran 870px X 435px.
Ini penting sekali agar banner tidak memakan banyak ruang, namun tetap menarik untuk dilihat. Jika Anda benar dalam mendesain, ukuran tersebut masih proper untuk dilihat di perangkat mobile sekalipun.
2. Mengupload gambar banner
Sebenarnya kita bisa mengupload gambar banner dimana saja, karena yang kita butuhkan adalah URL gambarnya. Bisa di Instagram, Facebook, Google Foto, dll.Namun demi mempermudah tutorial untuk para pemula, disini saya akan mengupload gambar di halaman Blogger.
- Buka Blogger dan masuk pada bagian Halaman, kemudian klik Halaman baru.
- Upload gambar seperti halnya mengupload gambar produk. Sampai disini tidak ada teknik khusus.
- Akan terlihat kode seperti ini.
Ambil URL gambarnya dan simpan dulu di notepad. URL gambar terletak diantara tanda kutip setelah kode <a href=
Anda tidak perlu mempublikasikan halaman ini. Cukup klik Tutup kemudian hapus draf halaman yang baru saja Anda buat.
3. Membuat banner
Untuk membuat banner yang responsive di tema Kece Toko, kita membutuhkan kode HTML sederhana. Kode tersebut sudah saya sertakan di dalam file tema yang Anda download.Silakan buka file banner.xml yang sudah di sediakan. Kodenya seperti ini.
<div class="featured-banner">
<a class="image-banner" href="URL-Tujuan">
<img src="URL-Gambar" />
</a>
</div>
Ganti URL-Tujuan dengan URL halaman tujuan saat banner diklik, dan ganti juga URL-Gambar dengan URL gambar yang sebelumnya Anda simpan di notepad.
Selanjutnya kembali ke Blogger dan masuk ke bagian Tata Letak. Scroll ke bawah sampai di bagian Featured Post. Terdapat widget Featured Banner kemudian klik Edit atau simbol tanda pena.
Akan muncul popup window seperti gambar di bawah. Masukkan kode dari file banner.xml yang telah Anda edit di kotak Konten. Lalu klik Simpan.
Hanya dengan teknik sederhana ini, kita telah berhasil membuat banner yang sangat resposive di berbagai perangkat.
Setelah ini kita akan belajar bersama bagaimana Cara Edit Jasa Pengiriman dan Metode Pembayaran di Tema Kece Toko.
Pasti bermanfaat!
Komentar
Posting Komentar