Cara Membuat Halaman Arahan KTT Virtual dengan Divi
Diterbitkan: 2020-07-02Mempromosikan acara virtual melibatkan sejumlah strategi promosi. Membuat halaman arahan yang mengundang adalah salah satunya. Membuat halaman arahan untuk pertemuan puncak virtual Anda adalah cara sempurna untuk membuat audiens Anda penasaran. Dengan kombinasi bagian yang tepat, Anda dapat mengundang, menginformasikan, dan mengumpulkan peserta terdaftar. Hari ini kami akan menunjukkan cara membuat halaman arahan puncak virtual dengan lima bagian. Desainnya mencakup gambar duotone dan pembagi bagian bergulir. Kami juga menyertakan file JSON yang dapat diunduh jika Anda ingin melewati tutorial langkah demi langkah. Di folder, Anda juga akan menemukan grafik header dan footer dalam PNG dan AI.
Mari kita lakukan!
Pratinjau
Mari kita lihat desain halaman arahan pada ukuran layar yang berbeda.
Desktop
Tablet
Seluler
Unduh Halaman Pendaratan Puncak Virtual GRATIS
Untuk mendapatkan tata letak halaman arahan puncak virtual gratis, Anda harus mengunduhnya terlebih dahulu menggunakan tombol di bawah. Untuk mendapatkan akses ke unduhan, Anda harus berlangganan daftar email Divi Daily kami dengan menggunakan formulir di bawah ini. Sebagai pelanggan baru, Anda akan menerima lebih banyak kebaikan Divi dan paket Tata Letak Divi gratis setiap hari Senin! Jika Anda sudah ada dalam daftar, cukup masukkan alamat email Anda di bawah ini dan klik unduh. Anda tidak akan "berlangganan ulang" atau menerima email tambahan.
Unduh Gratis
Bergabunglah dengan Divi Newsletter dan kami akan mengirimkan email kepada Anda salinan Paket Tata Letak Halaman Arahan Divi terbaik, ditambah banyak sumber daya, tip, dan trik Divi yang luar biasa dan gratis. Ikuti dan Anda akan menjadi master Divi dalam waktu singkat. Jika Anda sudah berlangganan cukup ketik alamat email Anda di bawah ini dan klik unduh untuk mengakses paket tata letak.
Anda telah berhasil berlangganan. Silakan periksa alamat email Anda untuk mengonfirmasi langganan Anda dan dapatkan akses ke paket tata letak Divi mingguan gratis!
Bagian Halaman Arahan KTT Virtual
Agar halaman arahan Anda melakukan tugasnya, halaman tersebut memerlukan serangkaian bagian tertentu. Selain menarik perhatian pemirsa, halaman arahan juga harus dikonversi. Laman landas pertemuan puncak virtual, misalnya, perlu menyertakan informasi yang relevan dan ajakan bertindak. Semua bagian harus mengalir dari satu ke yang lain dengan mulus agar pemirsa merasa terinspirasi untuk bertindak dan mendaftar.
Kami telah menyertakan bagian berikut di Halaman Arahan Virtual Summit:
Tajuk
Bagian header berisi informasi penting seperti judul KTT dan tanggal acara. Ini adalah informasi yang paling penting, itu sebabnya ada di paling atas. Tidak ada tajuk yang lengkap tanpa ajakan bertindak dan navigasi yang mudah ke seluruh halaman.
Dalam desain kami, kami telah menyertakan dua tombol dengan tautan jangkar yang menavigasi ke bagian speaker dan jadwal. Yang terpenting, kami telah menyertakan tombol dengan tautan ke bagian daftar. Di seluruh halaman, semua tombol "daftar" terlihat sama, agar memiliki kesatuan visual dalam desain.
Informasi
Bagian kedua adalah bagian informasi yang mendorong pemirsa untuk mempertimbangkan menghadiri pertemuan puncak virtual. Dalam desain, kami telah menambahkan empat uraian dan gambar yang dapat dengan mudah diubah menjadi video. Blurb mencantumkan empat alasan untuk menghadiri KTT dan gambar (atau video) adalah visual untuk mendukung keputusan tersebut.
Pembicara
Di bagian berikutnya, Anda akan menemukan satu set modul enam orang. Di sinilah Anda menghadirkan pembicara yang akan berpartisipasi dalam pertemuan puncak. Setiap modul mencakup elemen-elemen berikut:
- Gambar
- Nama
- Posisi
- Keterangan
- Tautan media sosial
Pastikan untuk memasukkan semua informasi yang relevan untuk setiap pembicara. Juga, coba dan gunakan jumlah garis yang sama dalam teks isi untuk menjaga desain tetap terlihat tajam. Seperti yang Anda lihat, kami menggunakan efek warna duotone pada semua foto speaker untuk memberikan desain tampilan dan nuansa yang menarik. Ada tutorial langkah demi langkah di bawah ini tentang cara mencapai efek ini di Photoshop.
Jika Anda memiliki lebih dari enam speaker, cukup duplikat baris atau klon modul menjadi baris dengan kolom lebih banyak atau lebih sedikit.
Jadwal
Bagian jadwal adalah berikutnya. Di area ini, kami dengan elegan membagikan jadwal KTT dan memastikan itu struktural. Untuk mempertahankan gaya desain teks, pastikan untuk mengubah konten tetapi bukan level heading. Coba dan pertahankan konten dengan panjang yang sama agar desainnya tetap rapi.
Baris diatur berdasarkan hari dengan gambar judul dan sekelompok uraian. Di bagian bawah kolom terakhir Anda dapat menemukan tombol ajakan bertindak bagi audiens untuk mendaftar.
Daftar
Terakhir namun tidak kalah pentingnya adalah bagian pendaftaran. Kami telah menyertakan penghitung waktu mundur untuk menambahkan rasa urgensi. Formulir kontak harus langsung ditautkan ke daftar RSVP Anda sehingga setiap orang yang diundang terdaftar secara otomatis.
Sepanjang desain halaman arahan pertemuan puncak virtual, Anda akan menemukan tiga tombol yang menavigasi ke bagian ini untuk menghasilkan prospek yang dioptimalkan.
Buat Peta Gradien Duotone dengan Photoshop
Buka Gambar di Adobe Photoshop
Jika Anda ingin meniru gambar duotone dalam desain kami, ikuti langkah-langkah di bawah ini. Pertama, buka gambar di Photoshop.
Buka Penyesuaian dan Pilih Peta Gradien
Buka toolbar penyesuaian dan klik pada peta gradien. Di tab properti, klik dua kali pada bilah gradien untuk membuka sembulan pengaturan.
Sesuaikan Warna Gradien
Dalam pengaturan gradien, klik dua kali pada setiap warna untuk menyesuaikan pengaturan.
Untuk mencapai efek desain kami, sesuaikan gradien sebagai berikut:
- Tipe Gradien: Padat
- Kehalusan: 100%
- Pemberhentian Opacity #1: 100%
- Berhenti Warna #2
- Ungu Tua #202060
- Posisi: 19%
- Titik tengah:
- Titik Tengah Opacity: 85%
- Titik Tengah Warna: 50%
- Penghentian Opacity #2: 55%
- Berhenti Warna #
- Ungu #f895f8
- Posisi: 100%
Simpan sebagai Peta Gradien Kustom
Tambahkan nama untuk gradien Anda dan klik baru untuk menyimpannya. Ini kemudian akan disimpan di perpustakaan gradien Anda. Simpan gambar untuk web dengan tinggi 700px. Ulangi proses dengan gambar sebanyak yang Anda butuhkan. Setelah menerapkan peta gradien, pilih gradien yang Anda simpan.
1. Buat Bagian Header
Tambahkan Bagian Baru
Latar belakang
Mari mulai membuat ulang halaman arahan puncak virtual. Buat halaman baru dan buka dengan Divi Builder. Sebelum menambahkan baris, tambahkan gambar latar belakang dan gradien ke bagian baru. Anda akan menemukan grafik latar belakang di folder yang dapat diunduh di atas.
- Gradien Latar Belakang
- Warna 1: #1f4068
- Warna 2: #202040
- Gambar Latar Belakang: Grafik Header
Perekat
Sesuaikan ketinggian minimum berikutnya.
- Tinggi Min: 1050px
Jarak
Spasinya juga.
- Padding Atas dan Bawah
- Meja dan Telepon: 90px
Visibilitas
Terakhir, sesuaikan pengaturan visibilitas di tab lanjutan.
- Luapan Horisontal dan Vertikal: Tersembunyi
Tambahkan Baris Baru
Struktur Kolom
Tambahkan baris dengan tiga kolom. Pilih struktur kolom 1/2, 1/4, 1/4.
Perekat
Sesuaikan ukuran baris sebagai berikut:
- Lebar: 90%
- Lebar Maks: 1800px
- Penjajaran: Pusat
Jarak
\Tambahkan beberapa margin atas juga.
- Margin Atas: 200px
Kolom 2, 3 Pengaturan
Jarak
Sesuaikan pengaturan untuk kolom 2 dan 3. Pertama spasi
- Margin Atas: 30px
Visibilitas
Kemudian, sembunyikan kolom di ponsel.
- Nonaktifkan di: Telepon
Tambahkan Modul Teks 1 Ke Kolom 1
Teks
Tambahkan modul teks pertama di kolom 1. Sisipkan judul sebagai konten H1.
- Isi: Konten H1
Teks Judul
Di tab desain, beri gaya pada teks judul berikutnya.
- Tingkat Pos: H1
- Font: Alata
- Berat: Tebal
- Penjajaran: Pusat
- Warna: Off White #eaeaea
- Ukuran
- Desktop: 85px
- Tablet: 70px
- Telepon: 44px
- Spasi Huruf: 2px
- Tinggi Garis: 1.1em
- Bayangan Teks: Opsi Pertama
- Warna Bayangan: rgba(o,0,0,0.26)
Tambahkan Modul Teks ke-2 ke Kolom 1
Teks
Tambahkan modul teks kedua. Masukkan tanggal sebagai konten H2.
- Isi: Konten H2, 15+16 Juli 2020
Teks Judul
Gaya teks judul berikutnya.
- Tingkat Pos: H2
- Font: Alata
- Berat: Reguler
- Penjajaran: Pusat
- Warna: Fucshia #b030b0
- Ukuran
- Desktop dan Tablet: 60px
- Telepon: 45 piksel
- Tinggi Garis: 1.3em
Jarak
Tambahkan beberapa spasi juga.
- Padding Bawah: 20px
Tambahkan Modul Tombol ke Kolom 1
Teks
Tambahkan modul tombol untuk ajakan bertindak.
- Tombol: Daftar
Tautan
Tambahkan tautan jangkar.
- URL Tautan: #Daftar
Penyelarasan
Pindah ke tab desain dan atur perataan.
- Penjajaran Tombol: Tengah
Gaya Kustom Tombol
Gaya tombol juga.
- Ukuran teks
- Desktop: 30px
- Tablet: 25 piksel
- Telepon: 20px
- Warna Teks: Putih #ffffff
- Latar Belakang: Ungu #602080
- Radius Perbatasan: 35px
- Spasi Huruf: 1px
- Font: Alata
Jarak
Terakhir, sesuaikan jarak.
- Batas atas
- Tablet dan Telepon: 15px
- Padding Atas: 2px
Tambahkan Modul Tombol ke Kolom 2
Teks
Pindah ke kolom 2 dan tambahkan modul tombol. Tambahkan salinan pilihan Anda.
- Tombol: Speaker
Tautan
Selanjutnya, tambahkan tautan jangkar.
- URL tautan: #Speaker
Penyelarasan
Di tab desain, atur perataan.
- Penjajaran Tombol
- Desktop: Kanan
- Tablet dan Telepon: Pusat
Gaya Kustom Tombol
Sesuaikan juga gaya tombol kustom.
- Ukuran Teks: 24px
- Warna Teks: Putih #ffffff
- Latar Belakang: Transparan
- Spasi Huruf: 1px
- Font Tombol: Alata
- Radius Perbatasan: 0px
Bayangan Kotak
Terakhir, tambahkan bayangan kotak.
- Bayangan Kotak: opsi ke-4
- Posisi Horizontal: 0px
- Posisi Vertikal: 5 px
- Warna Bayangan: Fuchsia: #b030b0
Modul Tombol Klon ke Kolom 3
Tombol Klon
Kloning tombol di kolom 2 dan tempatkan modul duplikat di kolom 3.
Sesuaikan Modul Tombol
Teks
Ubah teks di tombol kloning.
- Tombol: Jadwal
Tautan
Ubah juga tautan jangkar.
- URL Tautan: #Jadwal
Penyelarasan
Jangan lupa untuk mengubah perataan juga.
- Penjajaran Tombol
- Kiri Desktop
Tambahkan Baris Baru
Struktur Kolom
Tambahkan baris baru dengan dua kolom yang sama.
Perekat
Sesuaikan lebar talang terlebih dahulu.
- Lebar Talang Kustom: 2
Jarak
Tambahkan spasi berikutnya.
- Batas atas
- Telepon: -35px
Visibilitas
Kemudian sesuaikan visibilitas baris.
- Nonaktifkan di: Tablet dan Desktop
Modul Tombol Klon & Tempatkan Duplikat di Kolom 1
Tombol Klon
Kloning modul tombol di kolom 2 baris sebelumnya dan tempatkan modul duplikat di kolom 1 baris baru.
Sesuaikan Modul Tombol
Gaya Kustom Tombol
Sesuaikan teks di tombol baru.
- Ukuran Teks: 20px
Bayangan Kotak
Ubah juga bayangan kotak.
- Posisi Vertikal: 4px
Tambahkan Modul Tombol Kloning ke Kolom 2
Tombol Klon
Modul tombol duplikat dari kolom 3 di baris sebelumnya. Tempelkan di kolom 2 baris ini.
Sesuaikan Modul Tombol
Teks
Sesuaikan konten teks di tombol kloning.
- Teks: Jadwal
2. Buat Bagian Info
Tambahkan Bagian Baru
Latar belakang
Untuk membuat bagian informasi, tambahkan bagian baru dan gaya latar belakang terlebih dahulu.
- Gradien Latar Belakang
- Warna 1: #202040
- Warna 2: #202060
Jarak
Tambahkan beberapa bantalan juga.
- Padding Atas: 170px
- Padding Bawah: 5px
Visibilitas
Terakhir, sesuaikan pengaturan visibilitas di tab lanjutan.
- Luapan Horisontal dan Vertikal: Tersembunyi
Tambahkan Baris Baru
Struktur Kolom
Tambahkan baris baru dengan satu kolom. Kami akan menyebutnya baris judul.
Perekat
Atur ukuran selanjutnya.
- Lebar: 80%
- Lebar Maks: 1800px
Tambahkan Modul Teks
Teks
Tambahkan modul teks.
- Body: H2 Content – Mengapa menghadiri Digital Marketing Virtual Summit?
Teks Judul
Di tab desain, beri gaya pada teks judul.
- Tingkat Pos: H2
- Font: Alata
- Warna Teks: Putih #ffffff
- Ukuran
- Desktop: 55px
- Tablet: 45px
- Telepon: 40px
- Spasi Huruf: 2px
- Tinggi Garis: 1.1 em
Tambahkan Modul Pembagi
Garis
Sekarang tambahkan modul pembagi dan gaya garis di tab desain.
- Warna Garis: Fuchsia #b030b0
Perekat
Sesuaikan ukuran selanjutnya.
- Berat Pembagi: 50px
- Tinggi Maks: 50px
Efek Gulir
Di tab lanjutan, tambahkan efek gulir horizontal.
- Aktifkan Gerakan Horizontal
- Desktop
- Mulai Offset: -6
- Offset Tengah: 50% / 0
- Offset Akhir: 6
- Tablet dan Telepon
- Menyatakan Offset: -4
- Offset Tengah: 50% /0
- Offset Akhir: 4
Tambahkan Baris Baru
Struktur Kolom
Sekarang tambahkan baris baru dengan tiga kolom. Pilih struktur kolom 1/2, 1/4, 1/4.
Perekat
Sebelum menambahkan modul, sesuaikan ukuran baris.
- Lebar: 80%
- Lebar Maks: 1800px
Pengaturan Kolom 1
Jarak
Juga, sesuaikan jarak kolom pertama.
- Padding Atas: 20px
Tambahkan Modul Gambar ke Kolom 1
Gambar
Sekarang tambahkan modul gambar ke kolom 1. Gunakan salah satu gambar Anda dengan efek duotone.
- Gambar: Foto dengan efek duotone
Berbatasan
Sesuaikan juga batasnya.
- Sudut Bulat: 15px
Tambahkan Modul Blurb ke Kolom 2
Teks
Pindah ke kolom 2 dan tambahkan modul uraian. Masukkan konten.
- Judul: Buat Koneksi Baru
- Isi: Konten Deskriptif
Gambar
Unggah gambar nomor 1 yang dapat Anda temukan di folder yang dapat diunduh.
- Gambar: PNG dari #1
Gambar & Ikon
Sesuaikan penempatan gambar selanjutnya.
- Penempatan: Atas
- Perataan: Kiri
Teks Judul
Gaya teks judul juga.
- Tingkat Pos: H4
- Font: Alata
- Warna: Putih #ffffff
- Ukuran: 23px
Teks Tubuh
Jangan lupa untuk memberi gaya pada teks isi.
- Font: Buka Sans
- Warna: Putih #ffffff
- Ukuran: 14px
- Spasi Huruf: 1px
CSS khusus
Terakhir, tambahkan beberapa bantalan ekstra dengan CSS khusus ke judul uraian di tab lanjutan.
- Judul Blurb: padding-bottom: 15px;
padding-bottom: 15px;
Clone Blurb Module & Tempatkan Duplikat di Kolom 2
Klon Blurb
Duplikat uraian pertama di kolom 2.
Isi
Perbarui konten.
- Judul: Judul Baru
- Isi: Teks Deskriptif Baru
Gambar
Kemudian, ubah gambar nomor. Anda dapat menemukan yang baru di folder yang dapat diunduh.
- Gambar: PNG dari #2
Hapus Kolom 3 & Klon Kolom 2
Kolom Klon
Dalam pengaturan baris, hapus kolom ke-3 dan duplikat yang ke-2. Pastikan Anda mengembalikan struktur kolom ke 1/2, 1/4, 1/4.
Sesuaikan Blurb 1 di Kolom 3
Isi
Perbarui konten teks dalam uraian kloning.
- Judul: Judul Baru
- Isi: Teks Deskriptif Baru
Gambar
Ubah gambar nomor juga.
- Gambar: PNG dari #3
Sesuaikan Blurb 2 di Kolom 3
Isi
Ubah konten uraian ini juga. Pertama teks.
- Judul: Judul Baru
- Isi: Teks Deskriptif Baru
Gambar
Kemudian, ubah gambar nomor.
- Gambar: PNG dari #4
3. Buat Bagian Pembicara
Tambahkan Bagian Baru
Latar belakang
Pindah ke bagian untuk pembicara. Tambahkan bagian baru dan gaya latar belakang.
- Gradien Latar Belakang
- Warna 1: #202060
- Warna 2: #162447
Visibilitas
Sesuaikan pengaturan visibilitas di tab lanjutan.
- Luapan Horisontal dan Vertikal: Tersembunyi
Baris Judul Klon & Tempatkan Duplikat di Bagian Baru
Baris Duplikat
Gandakan baris judul dari bagian di atas dan tempatkan duplikat di bagian kloning. Kami akan menyebutnya, baris judul 2.
Sesuaikan Modul Teks
Teks
Kemudian, gaya pengaturan teks H3 di tab desain. Sesuaikan ID CSS dalam modul teks kloning juga. Selanjutnya, ubah warna garis modul pembagi. Sekarang tambahkan baris baru dengan 5 modul berukuran sama. Sesuaikan ukuran baris sebagai berikut: Tambahkan beberapa spasi juga. Tambahkan modul orang pertama ke kolom 1. Unggah gambar speaker dengan efek warna. Kami merekomendasikan ukuran gambar 550 x 770 px. Tambahkan beberapa sudut membulat ke gambar berikutnya. Kemudian, gaya teks judul. Gaya teks isi juga. Jangan lupa teks posisi. Terakhir, tambahkan beberapa CSS khusus untuk bantalan ekstra. Dalam pengaturan baris, hapus kolom 2-5. Gandakan kolom 1 sebanyak empat kali. Perbarui konten di semua modul kloning. Pertama teks. Kemudian gambar. Sekarang kita akan membuat bagian jadwal. Tambahkan bagian baru dan gaya latar belakang sebagai berikut: Sesuaikan pengaturan visibilitas di tab lanjutan. Kloning baris judul dari bagian di atas dan tempel di bagian ini. Ubah konten judul. Ubah ID CSS di modul teks kloning. Ubah warna pembagi juga. Sekarang, tambahkan baris baru dengan tiga kolom berukuran sama. Sesuaikan ukuran baris. Tambahkan beberapa spasi juga. Tambahkan modul teks ke kolom pertama. Masukkan konten. Pindah ke tab desain dan gaya teks judul. Tambahkan beberapa spasi berikutnya. Sekarang tambahkan modul ajakan bertindak dengan beberapa konten pilihan Anda. Tambahkan juga latar belakang gambar. Di tab desain, beri gaya pada teks judul. Gaya teks isi berikutnya. Tambahkan beberapa spasi juga. Kemudian, gaya perbatasan. Terakhir, tambahkan CSS khusus untuk gaya ekstra. Pindah ke kolom 2 dan tambahkan modul teks. Ikuti struktur konten ini: Di tab desain, beri gaya teks. Kemudian gaya semua level heading. Gaya perbatasan juga. Gandakan modul teks pertama dua kali. Ubah konten dalam modul teks kloning. Hapus batas modul terakhir di kolom. Pada pengaturan baris, hapus kolom 3. Duplikat kolom 2. Hapus modul teks ke-3 di kolom kloning. Perbarui konten di setiap modul teks baru. Salin tombol “daftar” di bagian header dan tempel di bawah modul teks terakhir di kolom 3. Ubah perataan tombol ke kiri. Sesuaikan ukuran teks sedikit. Gandakan baris 1 di bagian jadwal. Ubah konten dalam modul teks kloning. Sesuaikan konten modul ajakan bertindak. Ubah gambar latar belakang juga. Sesuaikan konten dalam modul teks juga. Bagian terakhir didedikasikan untuk pendaftaran. Tambahkan bagian baru dan gaya latar belakang sebagai berikut. Anda akan menemukan grafik footer di folder unduhan di atas. Sesuaikan jarak bagian juga. Dan ubah pengaturan visibilitas di tab lanjutan. Sekarang tambahkan baris baru dengan satu kolom. Tambahkan pembagi tak terlihat untuk bertindak sebagai tautan jangkar untuk bagian tersebut. Masukkan ID CSS yang tertaut ke semua tombol "daftar". Tambahkan baris kedua dengan dua kolom yang sama. Sesuaikan pengaturan ukuran baris. Tambahkan modul penghitung waktu mundur ke kolom pertama. Tambahkan konten dan tanggal acara. Gaya latar belakang berikutnya. Di tab desain, beri gaya pada teks judul. Gaya teks angka juga. Juga, teks label. Kemudian, sesuaikan ukuran baris. Tambahkan beberapa bantalan juga. Akhirnya, gaya perbatasan. Tambahkan modul formulir kontak baru ke kolom 2. Hapus bidang pesan. Masukkan pengaturan untuk setiap bidang. Di tab desain, di bawah tata letak, klik "buat lebar penuh". Lakukan hal yang sama untuk kolom kedua. Kembali ke pengaturan formulir kontak umum dan tambahkan beberapa konten. Kemudian, gaya bidang sebagai berikut: Gaya teks judul juga. Sesuaikan juga gaya kustom tombol. Jangan lupa untuk mengatur border-radius. Terakhir, tambahkan CSS khusus untuk bantalan ekstra. Dilakukan! Mari kita lihat lagi desain halaman arahan di berbagai ukuran layar. Kau berhasil! Bagaimana tampilan halaman arahan puncak virtual Anda? Gunakan desain ini untuk pertemuan puncak virtual Anda sendiri atau untuk klien desain web. Navigasi dioptimalkan untuk konversi dengan jumlah informasi yang tepat. Kami menambahkan pembagi bagian bergulir untuk sedikit tambahan visual juga. Beri tahu kami pendapat Anda di komentar. Apakah Anda mengunduh tata letak atau apakah Anda mengikuti langkah-langkahnya?
Teks Judul
CSS khusus
Sesuaikan Pembagi
Garis
Tambahkan Baris Baru
Struktur Kolom
Perekat
Jarak
Tambahkan Modul Orang ke Kolom 1
Teks
Gambar
Gambar
Teks Judul
Teks Tubuh
Teks Posisi
CSS khusus
padding-bottom: 10px;
padding-bottom: 20px;
padding-bottom: 20px;
Kolom Duplikat 1
Kolom Klon
Sesuaikan Konten untuk Modul Orang Baru
Teks
Gambar
4. Buat Bagian Jadwal
Tambahkan Bagian Baru
Latar belakang
Visibilitas
Baris Judul Klon 2
Baris Duplikat
Sesuaikan Modul Teks
Teks
CSS khusus
Sesuaikan Pembagi
Garis
Tambahkan Baris Baru
Struktur Kolom
Perekat
Jarak
Tambahkan Modul Teks ke Kolom 1
Teks
Teks Judul
Jarak
Tambahkan Ajakan Bertindak ke Kolom 1
Teks
Latar belakang
Teks Judul
Teks Tubuh
Jarak
Berbatasan
CSS khusus
border-radius: 15px;
background-color: #162447;
margin-top: 500px;
padding-bottom: 40px;
padding-bottom: 40px;
background-color: #q62447;
margin-top: 500px;
padding-bottom: 40px;
padding-bottom: 40px;
Tambahkan Modul Teks ke Kolom 2
Teks
Teks
Teks Judul
Berbatasan
Modul Teks Klon 2 Kali
Modul Teks Klon
Sesuaikan Modul Teks Baru
Teks
Hapus Batas Modul Teks ke-3
Berbatasan
Hapus Kolom 3 & Klon Kolom 2
Kolom Klon
Hapus & Sesuaikan Modul Teks
Hapus Modul Teks
Sesuaikan Konten
Modul Tombol Klon & Tempatkan Duplikat di Kolom 3
Tombol Klon
Sesuaikan Modul Tombol
Penyelarasan
Gaya Kustom Tombol
Kloning Baris 1 Bagian Jadwal
Baris Klon
Sesuaikan Modul Teks di Kolom 1
Teks
Sesuaikan Modul Ajakan Bertindak
Teks
Latar belakang
Sesuaikan Modul Teks
Teks
5. Buat Bagian Daftar
Tambahkan Bagian Baru
Latar belakang
Jarak
Visibilitas
Tambahkan Baris Baru
Struktur Kolom
Tambahkan Modul Pembagi
Visibilitas
ID CSS
Tambahkan Baris Baru
Struktur Kolom
Perekat
Tambahkan Modul Penghitung Waktu Mundur ke Kolom 1
Teks
Latar belakang
Teks Judul
Teks Angka
Teks Label
Perekat
Jarak
Berbatasan
Tambahkan Modul Formulir Kontak ke Kolom 2
Elemen
Tata Letak Bidang
Teks
bidang
Teks Judul
Gaya Kustom Tombol
Berbatasan
CSS khusus
padding-bottom: 30px;
Pratinjau
Desktop
Tablet
Seluler
Itu Bungkus