Umumnya, Landing Page digunakan bisnis online untuk menarik perhatian audiens dan memperkenalkan brand atau produk mereka.

Berikut 5 kegunaan Landing Page yang dapat memperbesar bisnis online dan meningkatkan omzet Anda:

TUTORIAL

1. Buka link di bawah ini:

Ketika Anda membukanya, tampilannya akan seperti di bawah ini.

 

Lalu klik SIGN UP FREE atau DAFTAR GRATIS yang ada di pojok kanan atas.

2. Isi data diri Anda dimulai dari NAMA LENGKAP, EMAIL, dan KATA SANDI.

Setelahnya klik daftar gratis.

3. Anda bebas pilih mau FREE PLAN, atau PAGE PLAN.

Di sana sudah tertera jika PAGE PLAN adalah page yang berbayar, yang pastinya memiliki banyak kelebihan dibandingkan dengan FREE PLAN.
 
Lalu klik continue.

4. Pilih BUAT LANDING PAGE.

5. Isi NAMA PAGE, DESKRIPSI, dan LINK sesuai yang Anda inginkan agar mesin pencari bisa mengidentifikasi halamanmu.

Setelahnya Anda bisa klik MULAI di bagian bawah sebelah kiri.

6. Pilih TEMPLATE sesuai kebutuhanmu.

Anda bisa menggunakan TEMPLATE yang sudah disediakan oleh TRIBELIO maupun membuatnya secara mandiri alias custom.
 
Ada banyak template yang bisa Anda gunakan, lho!
Caranya dengan meng-klik tanda > di bawah tulisan TEMPLATE.
Setelahnya klik template tersebut kemudian Anda akan diarahkan untuk membuat konten landing page dengan memanfaatkan fitur komponen.

7. Klik ADD COMPONENT.

8. Pilih COMPONENT yang ingin ditambahkan.

9. TEXT

Untuk menambahkan teks, headline, dan deskripsi produk yang ingin kamu tampilkan pada landing page

CARANYA

1. Tambahkan teks pada "Text Form"
2. Kamu bisa mengatur tipe karakter menggunakan Bold, Italic, dan Underlined
3. Untuk Font Size di komponenText, kamu bisa memilih font size Paragraph, Heading 1, Heading 2, Heading 3, Heading 4, Heading 5, Heading 6, serta Preformatted.
5. Untuk Align dari Text, kamu bisa memilih: Align Left, Middle, Right, dan Justify
6. Atur ukuran spacing dengan Line Spacing

TEXT SETTING

1. Untuk menambahkan Background Color, klik menu "Setting" lalu pilih warna untuk komponen Text kamu.
2. Gunakan "Text Color" untuk mengubah warna teks.
3. Gunakan "Font" untuk mengubah jenis font pada teks.
4. Gunakan "Padding Top dan Bottom" untuk mengatur jarak di bagian atas dan bawah Background.
5. Jika kamu ingin menghapus semua pengaturan komponen Text yang telah kamu buat, klik tombol "Reset" yang berada di bagian bawah layar.

10. BUTTON

Untuk menambahkan Tombol yang dapat kamu tambahkan link atau thumbnail

CARANYA

1. "URL" untuk menambahkan link pada Button yang berfungsi untuk mengarahkan (redirect) user ketika meng-klik Button.
2. "Upload Thumbnail" dan pilih gambar pilihanmu untuk menambahkan Thumbnail pada Button.
3. "Button Alignment" untuk mengatur posisi Button. Terdapat 3 pilihan posisi, yaitu: Center, Left, dan Right.

BUTTON SETTING

1. Untuk menambahkan Background Color, klik menu "Setting" lalu pilih warna untuk Button kamu.
2. Gunakan "Button Color" untuk mengubah warna Button.
3. Gunakan "Text Color" untuk mengubah warna teks pada Button.
4. Gunakan "Font" untuk mengubah jenis font pada Button.
5. Gunakan "Font Size" untuk mengubah ukuran teks pada Button.
6. Gunakan "Border Radius" untuk mengatur lengkungan pada Button.
7. Gunakan "Padding Top dan Bottom" untuk mengatur jarak di bagian atas dan bawah Background.
8. Jika kamu ingin menghapus semua pengaturan komponen Button yang telah kamu buat, klik tombol "Reset" yang berada di bagian bawah layar.

10. SOCIAL MEDIA ICON

Untuk menambahkan akun media sosial kamu di dalam sebuah icon

CARANYA

1. Untuk menambahkan icon, klik "Add Icon".
2. Kamu bisa pilih akun sosial media yang mau dibagikan dengan klik "Social Media Type".
3. Masukkan akun sosial media kamu pada form yang tersedia.
4. Kamu bisa menambahkan icon sosial media kembali, dengan klik menu "Add Icon".
5. Jika kamu mau menghapus icon sosial media, kamu bisa klik "Delete".

SOCIAL MEDIA BUTTON SETTING

1. Untuk menambahkan Background Color, klik menu "Setting" lalu pilih warna untuk Button kamu.
2. Kamu bisa pilih style icon dengan pilihan "Original", "Filled", dan "Outline".
3. Jika kamu memilih style Filled dan Outline, kamu bisa memilih warna icon di form yang tersedia.
4. Gunakan "Padding Top dan Bottom" untuk mengatur jarak di bagian atas dan bawah Background.

11. DIVIDER

Berfungsi sebagai pemisah antar komponen di dalam page

CARANYA

1. Klik "Divider.
2. Kamu bisa mengatur jarak divider menggunakan "Size".
3. Untuk mengatur bentuk divider kamu bisa menggunakan "Style".
4. Kamu bisa mengatur warna divider dengan menggunakan "Color".

12. IMAGE

Untuk menambahkan gambar yang ingin kamu tampilkan pada landing page

CARANYA

1. Kamu bisa menambahkan image, dengan format "PNG", "JPG", atau "GIF".
2. Untuk menambahkan gambar, klik "Upload Image or GIF".
3. "URL" untuk menambahkan link pada Image yang berfungsi untuk mengarahkan (redirect) user ketika meng-klik Image.
4. Kamu bisa mengatur bentuk gambar menggunakan "Shape".
5. Untuk memangkas gambar bisa klik menu "Crop".
6. amu bisa upload ulang gambar kamu dengan klik "Edit".
7. Jika kamu mau menghapus gambar, kamu bisa klik "Delete".
8. Untuk mengatur style yang ada pada komponen Image, klik tab "Setting".

IMAGE SETTING

1. Untuk menambahkan Background Color, klik menu "Setting" lalu pilih warna untuk komponen Image kamu.
2. Gunakan "Image Size" untuk mengatur ukuran tampilan Image.
3. Gunakan "Border Radius" untuk mengatur lengkungan pada Image.
4. Gunakan "Padding Top dan Bottom" untuk mengatur jarak di bagian atas dan bawah Background.
5. Jika kamu ingin menghapus semua pengaturan komponen Image yang telah kamu buat, klik tombol "Reset" yang berada di bagian bawah layar.

13. IMAGE GRID

Untuk menambahkan kolase gambar yang ingin kamu tampilkan pada landing page

CARANYA

1. Kamu bisa upload Image per kolase dengan klik "Upload Image or GIF" di tiap komponen Image.
2. "URL" untuk menambahkan link di setiap Image yang berfungsi untuk mengarahkan (redirect) user ketika meng-klik Image.
3. "Caption" untuk menambahkan teks di setiap Image.
4. "Delete" untuk menghapus salah satu Image.
5. "Swap Image" mengubah posisi Image.

IMAGE GRID SETTING

1. Untuk menambahkan Background Color, klik menu "Setting" lalu pilih warna untuk komponen Image Grid kamu.
2. Gunakan "Padding Top dan Bottom" untuk mengatur jarak di bagian atas dan bawah Background.
3. Jika kamu ingin menghapus semua pengaturan Image Grid yang telah kamu buat, klik tombol "Reset" yang berada di bagian bawah layar.

14. VIDEO

Untuk menampilkan video dari YouTube

CARANYA

1. Isi "Title" untuk mengubah judul Video. Lihat cara pengaturannya di menu Text.
2. Isi "Description" untuk menambahkan deskripsi pada Video.
3. "YouTube URL" untuk memasukkan link video YouTube dan menampilkan Thumbnail dari video tersebut.

VIDEO SETTING

1. Untuk menambahkan Background Color, klik menu "Setting", aktifkan "Background Color" dan pilih warna untuk background Video kamu.
2. Gunakan "Title Color" untuk mengubah warna teks pada Judul Video.
3. Gunakan "Description Color" untuk mengubah warna teks deskripsi pada Video.
4. Gunakan "Padding Top dan Bottom" untuk mengatur jarak di bagian atas dan bawah Background.
5. Gunakan "Width Image" untuk mengatur ukuran tampilan Video.
6. Jika kamu ingin menghapus semua pengaturan komponen Video yang telah kamu buat, klik tombol "Reset" yang berada di bagian bawah layar.

15. INSTANT PAYMENT

Berfungsi sebagai tempat untuk bertransaksi dan menjual produk, dan kamu bisa share instant payment yang telah kamu buat di landing page

CARANYA

1. Pilih instant payment yang sudah dibuat, jika kamu belum membuat instant payment, kamu bisa membuatnya terlebih dahulu di Commerce - Instant Payment.
2. Kamu bisa masukkan text di "Button Text".
3. Jika kamu mau masukkan gambar di button kamu bisa klik "Button Image".
4. Kamu bisa pilih jenis button dengan "Button Style".

INSTANT PAYMENT SETTING

1. Untuk menambahkan Background Color, klik menu "Setting" lalu pilih warna untuk Button kamu.
2. Gunakan "Button Color" untuk mengubah warna Button.
3. Gunakan "Text Color" untuk mengubah warna teks pada Button.
4. Gunakan "Font" untuk mengubah jenis font pada Button.
5. Gunakan "Font Size" untuk mengubah ukuran teks pada Button.
6. Gunakan "Button Position" untuk mengatur posisi button.
7. Gunakan "Button Width" untuk mengatur lebar button.
8. Gunakan "Border Radius" untuk mengatur lengkungan pada Button.
9. Gunakan "Padding Top dan Bottom" untuk mengatur jarak di bagian atas dan bawah Background.
10. Jika kamu ingin menghapus semua pengaturan komponen Button yang telah kamu buat, klik tombol "Reset" yang berada di bagian bawah layar.

16. SIGNUP FORM

Berfungsi untuk mengumpulkan database user, seperti: email, nama, dan nomor telepon

CARANYA

1. Kamu bisa “Add Field”, untuk mengatur kolom pertanyaan yang ingin kamu dapatkan dari audiens, ada beberapa field seperti “Phone Number”, “Gender”, dan “Text”. 
2. Jika kamu mau mengganti nama field, kamu bisa klik “Rename”. 
3. Kamu bisa delete field kamu dengan klik “Delete”.
4. "Text Form" untuk menambahkan Judul dan Deskripsi Sign Up Form kamu
5. Untuk melihat pengaturan form text, bisa dilihat di menu Text.
6. "Button Text" untuk menambahkan teks pada button di Sign Up Form kamu .
7. "URL Directed To" untuk menambahkan link pada Button yang berfungsi untuk mengarahkan (redirect) user ke link pilihan kamu setelah user mengisi Sign Up Form.
8. Langkah terakhir, kamu harus menambahkan "Tags" yang berfungsi untuk menandai audience yang mengisi form kamu.

SIGN UP FORM SETTING

1. Untuk menambahkan Background Color, klik menu "Setting" lalu pilih warna untuk Sign Up Form kamu.
2. Gunakan "Title Color" untuk mengubah warna teks pada Judul Form.
3. Gunakan "Description Color" untuk mengubah warna teks pada Deskripsi Form.
4. Gunakan "Label Color" untuk mengubah warna teks Label pada Form.
5. Gunakan "Button Color" untuk mengubah warna Button.
6. Gunakan "Button Text Color" untuk mengubah warna teks pada Button.
7. Gunakan "Padding Top dan Bottom" untuk mengatur jarak di bagian atas dan bawah Background.
8. Jika kamu ingin menghapus semua pengaturan Sign Up Form yang telah kamu buat, klik tombol "Reset" yang berada di bagian bawah layar.

17. HTML EMBED

Berfungsi untuk menyisipkan script HTML dan script lainnya untuk ditampilkan pada landing page kamu

CARANYA

1. Klik "HTML Embed".
2. Untuk menambahkan Background Color, klik menu "Setting" lalu pilih warna background untuk komponen HTML Embed kamu.
3. Gunakan "Padding Top dan Bottom" untuk mengatur jarak di bagian atas dan bawah Background.
4. Jika kamu ingin menghapus semua pengaturan HTML Embed yang telah kamu buat, klik tombol "Reset" yang berada di bagian bawah layar.

18. COLUMN

Berfungsi untuk mengkombinasikan elemen Image, Button, dan Text dalam satu kolom

COLUMN SETTING

1. Untuk menambahkan Background Color, klik menu "Setting", lalu pilih warna untuk background column kamu.
2. Gunakan "Padding Top dan Bottom" untuk mengatur jarak di bagian atas dan bawah Background.
3. Gunakan "Minimum Height" untuk mengatur tinggi minimum column.
4. Jika kamu memasukkan elemen Text pada column, kamu bisa mengatur Text Color, dan juga Font Style.
5. Jika kamu memasukkan elemen Image pada column, kamu bisa mengatur Border Radius pada gambar yang kamu pilih.
6. Jika kamu memasukkan elemen Button pada column, kamu bisa mengatur Button Color, Button Text Color, Font, dan juga Font Size.
7. Jika kamu ingin menghapus semua pengaturan Column yang telah kamu buat, klik tombol "Reset" yang berada di bagian bawah layar.

19. BANNER

Berfungsi sebagai tempat untuk Image, Button, dan Text yang berada di satu komponen.

CARANYA

1. Klik "Upload Image or GIF" untuk menambahkan Image atau GIF pada Banner  .
2. Isi "Title" untuk mengubah judul Banner. Lihat cara pengaturannya di menu Text.
3. Isi "Description" untuk menambahkan deskripsi pada Banner.
4. Jika kamu mau menambahkan Button pada Banner, Klik "Show Button". Kamu bisa menambahkan Button Text, dan URL pada button.

BANNER SETTING

1. Untuk menambahkan Background Color, klik menu 'Setting", aktifkan "Background Color" dan pilih warna untuk background Banner kamu.
2. Atur Image Opacity, Image Height, dan Image Width.
3. Gunakan "Padding Top dan Bottom" untuk mengatur jarak di bagian atas dan bawah Background.
4. Gunakan "Title Color" untuk mengubah warna teks pada Judul Banner.
5. Gunakan "Title Font" untuk mengubah jenis font pada Judul Banner.
6. Gunakan "Description Color" untuk mengubah warna teks deskripsi pada Banner.
7. Gunakan "Description Font" untuk mengubah jenis font deskripsi pada Banner.
8. Gunakan "Button Color" untuk mengubah warna Button.
9. Gunakan "Button Text Color" untuk mengubah warna teks pada Button.
10. Jika kamu ingin menghapus semua pengaturan Banner yang telah kamu buat, klik tombol "Reset" yang berada di bagian bawah layar.

20. Jika sudah selesai mengedit landing page yang Anda inginkan, lanjut klik PRATINJAU yang ada di bagian kanan atas untuk melihat secara keseluruhan komponen yang Anda buat

21. Jika Anda sudah yakin tidak ada kesalahan di landing page, Anda bisa langsung klik PUBLIKASI

SELAMAT MENCOBA!