Loncat ke Konten Utama

Divi tutorial: Cara menggunakan modul Tables Rate

Divi: tema WordPress termudah untuk digunakan

Divi: Tema WordPress terbaik sepanjang masa!

lebih 701.000 unduhan, Divi adalah tema WordPress paling populer di dunia. Sudah lengkap, mudah digunakan dan dilengkapi dengan lebih dari 62 template gratis. [Direkomendasikan]

Lebih mudah dari sebelumnya untuk membuat tabel harga untuk produk Anda secara online. Buat tabel sebanyak yang Anda inginkan dan kontrol harga dan fungsionalitas masing-masing menggunakan modul tabel Harga dari tema Divi WordPress Anda. Anda bahkan dapat membuat rencana khusus untuk meningkatkan konversi. Meskipun modul Anda menyertakan beberapa tabel harga, itu akan diperlakukan sebagai modul tunggal dan dapat ditempatkan di bawah ukuran kolom apa pun.

Bagaimana cara menambahkan modul Tabel Tingkat ke halaman Anda

Sebelum Anda dapat menambahkan modul tabel harga ke halaman Anda, Anda harus terlebih dahulu masuk ke Divi Builder. Setelah tema Divi dipasang di situs web Anda, Anda akan melihat sebuah tombol Gunakan Divi Builder di atas editor posting setiap kali Anda membuat halaman baru. Klik tombol ini untuk mengaktifkan Divi Builder dan mengakses semua modul Divi Builder. Kemudian klik tombolnya Gunakan Visual Builder untuk memulai generator dalam mode visual. Anda juga dapat mengklik tombol tersebut Gunakan Visual Builder ketika Anda menelusuri situs web Anda di latar depan jika Anda terhubung ke dashboard WordPress Anda.

Tabel Harga Modul

Setelah Anda memasuki Visual Builder, Anda dapat mengklik tombol plus abu-abu untuk menambahkan modul baru ke halaman Anda. Modul baru hanya dapat ditambahkan di dalam baris. Jika Anda memulai halaman baru, ingatlah untuk menambahkan baris ke halaman Anda terlebih dahulu.

divi chart harga wordpress.png

Temukan modul tabel harga di daftar modul dan klik di atasnya untuk menambahkannya ke halaman Anda. Daftar modul dapat dicari, yang berarti Anda juga dapat mengetikkan kata "tabel harga" lalu mengklik "masuk" untuk mencari dan menambahkan modul tabel harga secara otomatis! Setelah modul ditambahkan, Anda akan disambut oleh daftar opsi modul. Opsi-opsi ini dipisahkan menjadi tiga kelompok utama: Isi , Pembuahan et maju .

Kasus penggunaan: Tambahkan tabel harga untuk halaman produk

Ketika Anda mempromosikan produk Anda di halaman arahan, grafik harga dapat secara efektif menampilkan opsi harga Anda yang berbeda.

Dalam contoh ini, saya akan menambahkan modul tabel harga untuk menampilkan tiga paket harga (atau tabel) dengan salah satu paket tersebut menonjol sebagai paket unggulan untuk meningkatkan konversi.

Tabel harga WordPress divi.jpg

Pertama, tambahkan bagian reguler baru ke halaman tempat tabel harga harus ditampilkan. Tambahkan baris lebar penuh (1 kolom) ke bagian tersebut dan masukkan modul Tabel Harga ke dalam baris tersebut.

garis meja harga divi.png

Dalam pengaturan tabel harga, pada tab konten, klik + Tambahkan item baru untuk menambahkan tabel pertama Anda.

bagan harga kolom baru.png

Perbarui parameter dari tabel harga sebagai berikut:

Opsi konten

Judul: Mata uang pribadi: $ Oleh: tahun Harga: 69 Teks tombol: Isi Pendaftaran:
Akses ke semua tema Pembaruan tema abadi Dukungan teknis premium -Akses ke semua plugin -Toko file overlay -Tidak ada biaya tahunan
URL Tombol: [masukkan URL tombol] Latar belakang: #ffffff

Opsi desain

Harga Warna Teks: # 3e51b5 Gunakan Gaya Tombol Kustom: YES Warna Teks Tombol: #ffffff Warna Tombol: # 3e51b5 Lebar Tombol: 0px

Simpan pengaturan

divi grafik harga wordpress example.png

Sekarang, duplikat tabel harga yang baru saja Anda buat dua kali untuk memiliki total tiga tabel harga.

pembuatan beberapa contoh tableau.jpg

Untuk tabel harga tengah, perbarui opsi berikut:

Tab konten

Judul: Pengembang Harga: 89 Konten: Akses ke semua tema Pembaruan tema abadi Dukungan teknis premium Akses ke semua file berlapis Photoshop - tanpa biaya tahunan URL Tombol: [masukkan URL tombol]

Tab desain

Warna teks: # 0091ca Warna tombol: # 0091ca

Untuk tabel harga ketiga, perbarui pengaturan sebagai berikut:

Tab konten

Judul: Seumur Hidup Harga: 249 Tombol Teks: Berlangganan Konten: Akses ke semua tema Pembaruan tema abadi Dukungan teknis premium Akses ke semua plugin File Photoshop berlapis Tanpa biaya tahunan URL Tombol: [masukkan URL tombol]

Simpan pengaturan

Sekarang kembali ke pengaturan tabel harga dan perbarui yang berikut:

Opsi konten

Warna latar belakang tabel fitur: #0091ca

Opsi desain

Warna Bola: # 3e51b5 Warna Tabel Unggulan: # 0091ca

hasil dari tabel harga divi.jpg

Simpan pengaturan

Sekarang kembali dan edit pengaturan bagian untuk memberikan bagian warna latar belakang #3e51b5.

Itu saja. Sekarang Anda memiliki tabel harga dengan tiga opsi dengan opsi tengah ditetapkan sebagai item unggulan yang menonjol dari yang lain.

opsi tabel harga divi.jpg

Opsi konten untuk tabel harga

Di tab Content, Anda akan menemukan semua elemen konten dari modul, seperti teks, gambar, dan ikon. Semua itu mengontrol apa? muncul di modul Anda akan selalu ditemukan di tab ini.

opsi desain tabel harga.png

+ Tambahkan artikel baru

Di sinilah Anda menambahkan tabel harga baru ke modul Anda. Mengklik "+ tambahkan item baru" akan membuka daftar opsi desain baru khusus untuk tabel harga tersebut. Lihat di bawah untuk pengaturan tabel harga individu.

Setelah menambahkan tab pertama Anda, bilah abu-abu akan muncul dengan judul tabel harga Anda dalam bentuk label. Bilah abu-abu juga memiliki tiga tombol yang memungkinkan Anda mengedit, menggandakan, atau menghapus tabel.

Tampilkan Bullet

Secara default, item tabel harga ditampilkan sebagai daftar berpoin. Jika Anda ingin menghapus peluru dari daftar fitur, Anda dapat mematikan opsi ini.

Warna latar belakang dari tabel unggulan

Setiap tabel harga bisa "disajikan". Tabel unggulan disorot di baris, yang membedakannya dari opsi lain. Dengan menggunakan pengaturan ini, Anda dapat mengubah warna latar belakang untuk tabel unggulan saja.

Warna latar belakang tajuk tabel

Di atas setiap tabel harga adalah area header yang menyertakan judul dan subjudul tabel Anda. Anda dapat mengontrol warna latar belakang area ini secara terpisah dari warna latar belakang tabel utama dengan memilih warna yang diinginkan dari pemilih warna.

Header tabel unggulan

Setiap tabel harga dapat "diunggulkan". Tabel unggulan disorot di baris, yang membedakannya dari opsi lain. Dengan menggunakan pengaturan ini, Anda dapat mengubah warna latar belakang header untuk tabel yang dipilih saja.

Warna latar belakang

Secara default, tabel harga memiliki warna latar belakang putih. Jika Anda ingin menggunakan warna yang berbeda untuk latar belakang tabel harga Anda, Anda dapat menyetel warna kustom Anda di sini menggunakan color picker.

Label Admin

Ini akan mengubah label modul di konstruktor untuk memudahkan identifikasi. Saat Anda menggunakan tampilan WireFrame di Visual Builder, label ini muncul di blok modul antarmuka Divi Builder.

Opsi desain tabel harga

Di tab Desain, Anda akan menemukan semua opsi gaya modul, seperti font, warna, ukuran, dan spasi. Ini adalah tab yang akan Anda gunakan untuk mengubah tampilan modul Anda. Setiap modul Divi memiliki daftar panjang pengaturan desain yang dapat Anda gunakan untuk mengubah apa pun.

pilihan desain array.png

penjajaran

Secara default, daftar fitur rata kiri di tabel harga. Jika Anda ingin meratakannya, Anda dapat mengaktifkan opsi ini.

Hapus bayangan jatuh dari tabel unggulan

Secara default, tabel harga memiliki bayangan halus di belakang setiap tabel. Jika Anda ingin menghapus bayangan ini, Anda dapat mengaktifkan opsi ini.

Artikel dari daftar di tengah

Di sini Anda dapat memilih untuk memusatkan item yang tercantum di tabel Anda.

Warna bola

Secara default, poin dalam daftar tabel harga akan mewarisi warna aksen tema Anda. Jika Anda ingin menggunakan warna yang berbeda, Anda dapat menyetelnya di sini menggunakan color picker.

Warna meja unggulan

Jika Anda ingin menggunakan warna berbeda untuk poin di tabel harga, Anda dapat menyetel warna tersebut di sini menggunakan color picker.

Warna Teks Tajuk Tabel Unggulan

Opsi ini mengontrol warna warna teks header tabel Anda. Jika Anda mengubah warna latar belakang header tabel, Anda juga dapat mengubah opsi ini untuk memastikan keterbacaan.

Font Kepala

Anda dapat mengubah fonta teks header Anda dengan memilih font yang diinginkan dari menu drop-down. Divi hadir dengan lusinan font hebat yang diberdayakan oleh Google Fonts. Secara default, Divi menggunakan font Open Sans untuk semua teks di halaman Anda. Anda juga dapat menyesuaikan gaya teks Anda menggunakan opsi tebal, miring, huruf besar, dan garis bawah.

Ukuran font tajuk

Di sini Anda dapat menyesuaikan ukuran teks header Anda. Anda dapat menyeret penggeser rentang untuk menambah atau mengurangi ukuran teks Anda atau langsung memasukkan nilai ukuran teks yang diinginkan ke dalam bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung berbagai satuan ukuran, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Buat situs web Anda dengan Elementor dengan mudah

Elementor memungkinkan Anda untuk dengan mudah membuat desain situs web apa pun dengan tampilan profesional. Berhentilah membayar mahal untuk apa yang dapat Anda lakukan sendiri. [Gratis]

Warna Teks Tajuk

Secara default, semua warna teks di Divi muncul dalam warna putih atau abu-abu tua. Jika Anda ingin mengubah warna teks header, pilih warna yang diinginkan dari color picker menggunakan opsi ini.

Spasi huruf header

Penspasian huruf mempengaruhi jarak antara setiap huruf. Jika Anda ingin menambah ruang di antara setiap huruf di teks header, gunakan penggeser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung berbagai satuan ukuran, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Tinggi Baris Tajuk

Tinggi baris memengaruhi ruang antara setiap baris teks header Anda.Jika Anda ingin menambah ruang di antara setiap baris, gunakan bilah geser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di kolom input di sebelah kanan kursor. Kolom masukan mendukung berbagai satuan ukuran, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Warna teks dari tabel unggulan

Ini mengubah warna teks tubuh untuk tabel unggulan Anda. Jika Anda mengubah warna latar belakang tabel, Anda mungkin perlu mengubah opsi ini untuk memastikan keterbacaan.

Font tubuh

Anda dapat mengubah font tubuh Anda dengan memilih font yang diinginkan dari menu drop-down. Divi hadir dengan lusinan font hebat yang diberdayakan oleh Google Fonts. Secara default, Divi menggunakan font Open Sans untuk semua teks di halaman Anda. Anda juga dapat menyesuaikan gaya teks Anda menggunakan opsi tebal, miring, huruf besar, dan garis bawah.

Ukuran font tubuh

Di sini Anda dapat menyesuaikan ukuran teks tubuh Anda. Anda dapat menyeret penggeser rentang untuk menambah atau mengurangi ukuran teks Anda atau langsung memasukkan nilai ukuran teks yang diinginkan ke dalam bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung berbagai satuan ukuran, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Warna teks badan

Secara default, semua warna teks di Divi muncul dalam warna putih atau abu-abu tua. Jika Anda ingin mengubah warna teks Anda, pilih warna yang diinginkan dari color picker menggunakan opsi ini.

Spasi huruf tubuh

Penspasian huruf mempengaruhi jarak antara setiap huruf. Jika Anda ingin menambah ruang di antara setiap huruf dalam teks Anda, gunakan penggeser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung berbagai satuan ukuran, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Ketinggian garis tubuh

Ketinggian garis memengaruhi ruang antara setiap baris teks di tubuh Anda Jika Anda ingin menambah ruang di antara setiap baris, gunakan bilah geser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan terletak di sebelah kanan kursor. Kolom masukan mendukung berbagai satuan ukuran, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Warna teks dari subtitle tabel

Ini mengubah warna teks keterangan untuk tabel unggulan Anda. Jika Anda mengubah warna latar belakang tabel Anda, Anda mungkin perlu mengubah opsi ini untuk memastikan keterbacaan.

Font subtitle

Anda dapat mengubah font teks keterangan Anda dengan memilih font yang diinginkan dari menu drop-down. Divi hadir dengan lusinan font hebat yang diberdayakan oleh Google Fonts. Secara default, Divi menggunakan font Open Sans untuk semua teks di halaman Anda. Anda juga dapat menyesuaikan gaya teks Anda menggunakan opsi tebal, miring, huruf besar, dan garis bawah.

Ukuran font subtitle atau subtitle

Di sini Anda dapat menyesuaikan ukuran teks subheader Anda. Anda dapat menyeret penggeser rentang untuk menambah atau mengurangi ukuran teks Anda, atau langsung memasukkan nilai ukuran teks yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung satuan ukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Warna teks dari sub-header

Secara default, semua warna teks di Divi muncul dalam warna putih atau abu-abu tua. Jika Anda ingin mengubah warna teks keterangan Anda, pilih warna yang diinginkan dari pemilih warna menggunakan opsi ini.

Spasi huruf sub-header

Penspasian huruf mempengaruhi jarak antara setiap huruf. Jika Anda ingin menambah ruang di antara setiap huruf dalam teks teks Anda, gunakan penggeser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung unit pengukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis unitnya.

Ketinggian garis sub-header

Ketinggian baris memengaruhi ruang di antara setiap baris teks teks Anda. Jika Anda ingin menambah ruang di antara setiap baris, gunakan penggeser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung unit pengukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis unitnya.

Mata Uang Mata Uang dan Frekuensi

Anda dapat mengubah font mata uang dan teks frekuensi dengan memilih font yang Anda inginkan dari menu drop-down. Divi hadir dengan lusinan font hebat yang diberdayakan oleh Google Fonts. Secara default, Divi menggunakan font Open Sans untuk semua teks di halaman Anda. Anda juga dapat menyesuaikan gaya teks Anda menggunakan opsi tebal, miring, huruf besar, dan garis bawah.

Mata Uang Ukuran dan Frekuensi Mata Uang

Di sini Anda dapat menyesuaikan ukuran mata uang dan teks frekuensi Anda. Anda dapat menyeret penggeser rentang untuk menambah atau mengurangi ukuran teks Anda atau langsung memasukkan nilai ukuran teks yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung satuan ukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Warna dan frekuensi teks mata uang

Secara default, semua warna teks di Divi muncul dalam warna putih atau abu-abu tua. Jika Anda ingin mengubah warna teks mata uang dan frekuensi Anda, pilih warna yang diinginkan dari pemilih warna menggunakan opsi ini.

Jarak huruf dan mata uang

Penspasian huruf mempengaruhi jarak antara setiap huruf. Jika Anda ingin menambah jarak antara setiap huruf dalam mata uang dan teks frekuensi Anda, gunakan slider rentang untuk menyesuaikan spasi atau masukkan ukuran spasi yang diinginkan di kolom input di sebelah kanan slider. Kolom masukan mendukung satuan ukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Garis mata uang frekuensi

Ketinggian garis memengaruhi ruang antara setiap baris mata uang dan teks frekuensi Anda. Jika Anda ingin menambah spasi di antara setiap baris, gunakan slider rentang untuk menyesuaikan spasi atau masukkan ukuran spasi yang diinginkan di lapangan di sebelah kanan kursor. Kolom masukan mendukung unit pengukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis unitnya.

Harga Warna Unggulan

Ini mengubah warna harga untuk tabel unggulan Anda. Jika Anda mengubah warna latar belakang tabel Anda, Anda mungkin perlu mengubah opsi ini untuk memastikan keterbacaan.

Harga Polisi

Anda dapat mengubah font teks harga Anda dengan memilih font yang Anda inginkan dari menu drop-down. Divi hadir dengan lusinan font hebat yang diberdayakan oleh Google Fonts. Secara default, Divi menggunakan font Open Sans untuk semua teks di halaman Anda. Anda juga dapat menyesuaikan gaya teks Anda menggunakan opsi tebal, miring, huruf kapital, dan garis bawah.

Harga Ukuran Huruf

Di sini Anda dapat menyesuaikan ukuran teks harga Anda. Anda dapat menyeret penggeser rentang untuk menambah atau mengurangi ukuran teks Anda, atau langsung memasukkan nilai ukuran teks yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung satuan ukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Harga warna teks

Secara default, semua warna teks di Divi muncul dalam warna putih atau abu-abu tua. Jika Anda ingin mengubah warna teks harga Anda, pilih warna yang diinginkan dari pemilih warna menggunakan opsi ini.

Jarak huruf harga

Penspasian huruf mempengaruhi jarak antara setiap huruf. Jika Anda ingin menambah ruang di antara setiap huruf dalam teks harga Anda, gunakan penggeser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung satuan ukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Ketinggian garis harga

Tinggi baris memengaruhi ruang antara setiap baris teks harga Anda Jika Anda ingin menambah ruang di antara setiap baris, gunakan penggeser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan terletak di sebelah kanan kursor. Kolom masukan mendukung satuan ukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Gunakan perbatasan

Mengaktifkan opsi ini akan memberi batas di sekitar modul Anda. Perbatasan ini dapat disesuaikan menggunakan parameter bersyarat berikut.

Warna perbatasan

Pilihan ini mempengaruhi warna perbatasan Anda. Pilih warna kustom dari color picker untuk diterapkan ke perbatasan Anda.

Lebar perbatasan

Secara default, batasnya selebar 1 piksel. Anda dapat meningkatkan nilai ini dengan menyeret penggeser rentang atau memasukkan nilai kustom di bidang masukan di sebelah kanan penggeser. Satuan ukuran khusus didukung, yang berarti Anda dapat mengubah satuan default dari "px" ke sesuatu yang lain seperti em, vh, vw dll.

Gaya batas

Perbatasan mendukung delapan gaya berbeda: solid, dotted, double, groove, crest, overlay, dan start. Pilih gaya yang Anda inginkan dari menu drop-down untuk menerapkannya ke perbatasan Anda.

Gunakan gaya khusus untuk tombol

Mengaktifkan opsi ini mengungkapkan berbagai pengaturan kustomisasi tombol yang dapat Anda gunakan untuk mengubah tampilan tombol modul Anda.

Ukuran teks tombol

Pengaturan ini dapat digunakan untuk menambah atau mengurangi ukuran teks di tombol. Tombol menyesuaikan saat ukuran teks bertambah dan berkurang.

Warna teks tombol

Secara default, tombol mengadopsi warna aksen tema Anda seperti yang ditentukan dalam Penyesuai Tema. Opsi ini memungkinkan Anda untuk menetapkan warna teks kustom ke tombol modul ini. Pilih warna kustom Anda menggunakan color picker untuk mengubah warna tombol.

Warna latar tombol

Secara default, tombol memiliki warna latar transparan. Ini dapat diubah dengan memilih warna latar belakang yang diinginkan dari pemilih warna.

Lebar Batas Tombol

Semua tombol Divi memiliki batas 2px secara default. Perbatasan ini dapat ditingkatkan atau dikurangi menggunakan pengaturan ini. Perbatasan dapat dihapus dengan memasukkan nilai 0.

Warna batas tombol

Secara default, batas tombol mengadopsi warna aksen tema Anda seperti yang ditentukan dalam Penyesuai Tema. Opsi ini memungkinkan Anda untuk menetapkan warna tepi kustom ke tombol modul ini. Pilih warna kustom Anda menggunakan color picker untuk mengubah warna batas tombol.

Radius batas tombol

Jari-jari perbatasan memengaruhi kebulatan sudut tombol Anda. Secara default, tombol di Divi memiliki radius batas kecil yang membulatkan sudut sebesar 3 piksel. Anda dapat mengurangi nilai ini menjadi 0 untuk membuat tombol persegi atau meningkatkannya secara signifikan untuk membuat tombol dengan tepi melingkar.

Jarak dari huruf-huruf tombol

Penspasian huruf mempengaruhi jarak antara setiap huruf. Jika Anda ingin menambah ruang di antara setiap huruf dalam teks tombol Anda, gunakan penggeser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung unit pengukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis unitnya.

Polisi Boutton

Anda dapat mengubah fonta teks tombol Anda dengan memilih font yang diinginkan dari menu drop-down. Divi hadir dengan lusinan font hebat yang diberdayakan oleh Google Fonts. Secara default, Divi menggunakan font Open Sans untuk semua teks di halaman Anda. Anda juga dapat menyesuaikan gaya teks Anda menggunakan opsi tebal, miring, huruf besar, dan garis bawah.

Tambahkan ikon tombol

Dinonaktifkan, pengaturan ini akan menghapus ikon dari tombol Anda. Secara default, semua tombol Divi menampilkan ikon panah.

Ikon tombol

Jika ikon diaktifkan, Anda dapat menggunakan pengaturan ini untuk memilih ikon mana yang akan digunakan di tombol Anda. Divi memiliki ikon berbeda untuk dipilih.

Warna ikon tombol

Menyesuaikan parameter ini akan mengubah warna ikon yang muncul di tombol Anda. Secara default, warna ikon sama dengan warna teks tombol Anda, tetapi pengaturan ini memungkinkan Anda menyesuaikan warna secara mandiri.

Penempatan ikon tombol

Anda dapat memilih untuk menampilkan ikon tombol Anda di sebelah kiri atau kanan tombol Anda.

Tampilkan hanya ikon saat mengarahkan tombol

Secara default, ikon tombol hanya ditampilkan saat melayang. Jika Anda ingin ikon selalu muncul, matikan pengaturan ini.

Warna teks di flyover tombol

Saat tombol diarahkan oleh mouse pengunjung, warna ini akan digunakan. Warna akan berubah dari warna dasar yang ditentukan dalam pengaturan sebelumnya.

Warna latar tombol hover

Saat tombol diarahkan oleh mouse pengunjung, warna ini akan digunakan. Warna akan berubah dari warna dasar yang ditentukan dalam pengaturan sebelumnya.

Tombol Border Hover Warna

Saat tombol diarahkan oleh mouse pengunjung, warna ini akan digunakan. Warna akan berubah dari warna dasar yang ditentukan dalam pengaturan sebelumnya.

Apakah Anda mencari tema dan plugin WordPress terbaik?

Unduh plugin terbaik dan tema WordPress di Envato dan buat situs web Anda dengan mudah. Sudah lebih dari 49.720.000 unduhan. [EKSKLUSIF]

Tombol Radius Hover Border

Saat tombol digerakkan oleh mouse pengunjung, nilai ini akan digunakan. Nilai akan berubah dari nilai dasar yang ditentukan di pengaturan sebelumnya.

Menunjuk tombol spasi catatan

Saat tombol digerakkan oleh mouse pengunjung, nilai ini akan digunakan. Nilai akan berubah dari nilai dasar yang ditentukan di pengaturan sebelumnya.

Opsi kartu tingkat lanjut

Pada tab lanjutan, Anda akan menemukan opsi yang mungkin berguna bagi desainer web yang lebih berpengalaman, seperti atribut CSS dan HTML khusus. Di sini Anda dapat menerapkan CSS khusus ke salah satu dari banyak elemen modul. Anda juga dapat menerapkan kelas dan ID CSS khusus ke modul, yang dapat digunakan untuk menyesuaikan modul dalam file style.css tema anak Anda.

opsi lanjutan divi price chart.png

ID CSS

Masukkan ID CSS opsional untuk digunakan untuk modul ini. ID dapat digunakan untuk membuat gaya CSS kustom atau untuk menautkan ke bagian tertentu halaman Anda.

Kelas CSS

Masukkan kelas CSS opsional yang akan digunakan untuk modul ini. Kelas CSS dapat digunakan untuk membuat gaya CSS khusus. Anda dapat menambahkan beberapa kelas, dipisahkan oleh spasi. Kelas-kelas ini dapat digunakan dalam tema anak Divi Anda atau di lembar gaya CSS khusus yang Anda tambahkan ke halaman Anda atau ke situs web Anda menggunakan opsi tema Divi atau pengaturan halaman Divi Builder.

CSS khusus

CSS khusus juga dapat diterapkan ke modul dan bagian internal modul mana pun. Di bagian CSS Khusus, Anda akan menemukan bidang teks tempat Anda dapat menambahkan lembar gaya CSS khusus langsung ke setiap elemen. Entri CSS dalam pengaturan ini sudah dibungkus dalam tag gaya. Jadi masukkan saja aturan CSS yang dipisahkan oleh titik koma.

jarak penglihatan

Opsi ini memungkinkan Anda untuk mengontrol perangkat tempat modul Anda muncul. Anda dapat memilih untuk menonaktifkan modul Anda pada tablet, smartphone atau desktop satu per satu. Ini berguna jika Anda ingin menggunakan mod berbeda pada perangkat berbeda, atau jika Anda ingin menyederhanakan desain seluler dengan menghilangkan elemen tertentu dari laman.

Opsi konten dari tabel harga individu

tabel harga bagian individu.png

Judul

Judul yang Anda masukkan di sini akan digunakan untuk opsi penetapan harga (Premium) ini.

anak judul

Subtitle yang Anda masukkan di sini akan muncul di bawah judul Anda.

Merancang

Masukkan simbol mata uang yang Anda inginkan di sini.

oleh

Jika harga Anda berbasis langganan, masukkan siklus langganan di sini (misalnya, Tahun).

prix

Masukkan nilai produk di sini.

Teks tombol

Tentukan teks tombol di sini.

Isi

Bidang ini adalah tempat Anda dapat memasukkan daftar fitur yang disertakan atau tidak disertakan dengan produk Anda. Pisahkan setiap item daftar di baris baru dan mulai setiap baris dengan simbol + atau -. A + menentukan fitur yang disertakan, sedangkan A - menentukan fitur yang dikecualikan.

URL tombol

Di bagian bawah setiap tabel, Anda dapat memasukkan tombol Ajakan Bertindak dengan memasukkan url web yang valid di bidang ini. Tinggalkan ini dan
kolom teks tombol kosong jika Anda tidak ingin memiliki tombol di tabel harga Anda.

Warna latar belakang

Tentukan warna latar belakang kustom untuk modul Anda atau biarkan kosong untuk menggunakan warna default.

Opsi desain untuk tabel harga individual

harga kolom kolom style divi.png

Jadikan tabel ini ditampilkan

Pilih untuk mengedepankan tabel harga ini atau tidak dengan menu tarik-turun ini. Ini akan memungkinkan papan menonjol dari yang lain.

Warna item dikecualikan

Untuk item dalam daftar Anda yang telah ditetapkan sebagai dikecualikan menggunakan simbol -, Anda dapat menyesuaikan warnanya menggunakan pengaturan ini. Misalnya, Anda mungkin ingin mengubah warna menjadi merah atau mengurangi opasitasnya untuk menandakan secara visual bahwa item dikecualikan dari paket saat ini.

Font Header

Anda dapat mengubah fonta teks header Anda dengan memilih font yang diinginkan dari menu drop-down. Divi hadir dengan lusinan font hebat yang diberdayakan oleh Google Fonts. Secara default, Divi menggunakan font Open Sans untuk semua teks di halaman Anda. Anda juga dapat menyesuaikan gaya teks Anda menggunakan opsi tebal, miring, huruf besar, dan garis bawah.

Ukuran font tajuk

Di sini Anda dapat menyesuaikan ukuran teks header Anda. Anda dapat menyeret penggeser rentang untuk menambah atau mengurangi ukuran teks Anda atau langsung memasukkan nilai ukuran teks yang diinginkan ke dalam bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung berbagai satuan ukuran, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Warna Teks Tajuk

Secara default, semua warna teks di Divi muncul dalam warna putih atau abu-abu tua. Jika Anda ingin mengubah warna teks header, pilih warna yang diinginkan dari color picker menggunakan opsi ini.

Spasi huruf header

Penspasian huruf mempengaruhi jarak antara setiap huruf. Jika Anda ingin menambah ruang di antara setiap huruf di teks header, gunakan penggeser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung berbagai satuan ukuran, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Tinggi Baris Tajuk

Tinggi baris memengaruhi ruang antara setiap baris teks header Anda.Jika Anda ingin menambah ruang di antara setiap baris, gunakan bilah geser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di kolom input di sebelah kanan kursor. Kolom masukan mendukung berbagai satuan ukuran, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Font tubuh

Anda dapat mengubah font tubuh Anda dengan memilih font yang diinginkan dari menu drop-down. Divi hadir dengan lusinan font hebat yang diberdayakan oleh Google Fonts. Secara default, Divi menggunakan font Open Sans untuk semua teks di halaman Anda. Anda juga dapat menyesuaikan gaya teks Anda menggunakan opsi tebal, miring, huruf besar, dan garis bawah.

Ukuran font tubuh

Di sini Anda dapat menyesuaikan ukuran teks tubuh Anda. Anda dapat menyeret penggeser rentang untuk menambah atau mengurangi ukuran teks Anda atau langsung memasukkan nilai ukuran teks yang diinginkan ke dalam bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung berbagai satuan ukuran, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Warna teks badan

Secara default, semua warna teks di Divi muncul dalam warna putih atau abu-abu tua. Jika Anda ingin mengubah warna teks Anda, pilih warna yang diinginkan dari color picker menggunakan opsi ini.

Spasi huruf tubuh

Penspasian huruf mempengaruhi jarak antara setiap huruf. Jika Anda ingin menambah ruang di antara setiap huruf dalam teks Anda, gunakan penggeser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung berbagai satuan ukuran, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Ketinggian garis tubuh

Ketinggian garis memengaruhi ruang antara setiap baris teks di tubuh Anda Jika Anda ingin menambah ruang di antara setiap baris, gunakan bilah geser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan terletak di sebelah kanan kursor. Kolom masukan mendukung berbagai satuan ukuran, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Font subtitle

Anda dapat mengubah font teks keterangan Anda dengan memilih font yang diinginkan dari menu drop-down. Divi hadir dengan lusinan font hebat yang diberdayakan oleh Google Fonts. Secara default, Divi menggunakan font Open Sans untuk semua teks di halaman Anda. Anda juga dapat menyesuaikan gaya teks Anda menggunakan opsi tebal, miring, huruf besar, dan garis bawah.

Ukuran font subtitle

Di sini Anda dapat menyesuaikan ukuran teks subheader Anda. Anda dapat menyeret penggeser rentang untuk menambah atau mengurangi ukuran teks Anda, atau langsung memasukkan nilai ukuran teks yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung satuan ukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Warna teks subtitle

Secara default, semua warna teks di Divi muncul dalam warna putih atau abu-abu tua. Jika Anda ingin mengubah warna teks keterangan Anda, pilih warna yang diinginkan dari pemilih warna menggunakan opsi ini.

Jarak huruf subtitle

Penspasian huruf mempengaruhi jarak antara setiap huruf. Jika Anda ingin menambah ruang di antara setiap huruf dalam teks teks Anda, gunakan penggeser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung unit pengukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis unitnya.

Ketinggian garis subtitle

Ketinggian baris memengaruhi ruang di antara setiap baris teks teks Anda. Jika Anda ingin menambah ruang di antara setiap baris, gunakan penggeser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung unit pengukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis unitnya.

Mata Uang Mata Uang dan Frekuensi

Anda dapat mengubah font mata uang dan teks frekuensi dengan memilih font yang Anda inginkan dari menu drop-down. Divi hadir dengan lusinan font hebat yang diberdayakan oleh Google Fonts. Secara default, Divi menggunakan font Open Sans untuk semua teks di halaman Anda. Anda juga dapat menyesuaikan gaya teks Anda menggunakan opsi tebal, miring, huruf besar, dan garis bawah.

Ukuran Font untuk Mata Uang dan Frekuensi

Di sini Anda dapat menyesuaikan ukuran mata uang dan teks frekuensi Anda. Anda dapat menyeret penggeser rentang untuk menambah atau mengurangi ukuran teks Anda atau langsung memasukkan nilai ukuran teks yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung satuan ukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Warna teks untuk mata uang dan frekuensi

Secara default, semua warna teks di Divi muncul dalam warna putih atau abu-abu tua. Jika Anda ingin mengubah warna teks mata uang dan frekuensi Anda, pilih warna yang diinginkan dari pemilih warna menggunakan opsi ini.

Jarak huruf dan mata uang

Penspasian huruf mempengaruhi jarak antara setiap huruf. Jika Anda ingin menambah jarak antara setiap huruf dalam mata uang dan teks frekuensi Anda, gunakan slider rentang untuk menyesuaikan spasi atau masukkan ukuran spasi yang diinginkan di kolom input di sebelah kanan slider. Kolom masukan mendukung satuan ukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Garis mata uang dan frekuensi

Ketinggian garis memengaruhi ruang antara setiap baris mata uang dan teks frekuensi Anda. Jika Anda ingin menambah spasi di antara setiap baris, gunakan slider rentang untuk menyesuaikan spasi atau masukkan ukuran spasi yang diinginkan di lapangan di sebelah kanan kursor. Kolom masukan mendukung satuan ukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Kebijakan harga

Anda dapat mengubah font teks harga Anda dengan memilih font yang Anda inginkan dari menu drop-down. Divi hadir dengan lusinan font hebat yang diberdayakan oleh Google Fonts. Secara default, Divi menggunakan font Open Sans untuk semua teks di halaman Anda. Anda juga dapat menyesuaikan gaya teks Anda menggunakan opsi tebal, miring, huruf besar, dan garis bawah.

Ukuran font harga

Di sini Anda dapat menyesuaikan ukuran teks harga Anda. Anda dapat menyeret penggeser rentang untuk menambah atau mengurangi ukuran teks Anda, atau langsung memasukkan nilai ukuran teks yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung satuan ukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Harga warna teks

Secara default, semua warna teks di Divi muncul dalam warna putih atau abu-abu tua. Jika Anda ingin mengubah warna teks harga Anda, pilih warna yang diinginkan dari pemilih warna menggunakan opsi ini.

Jarak huruf harga

Penspasian huruf mempengaruhi jarak antara setiap huruf. Jika Anda ingin menambah ruang di antara setiap huruf dalam teks harga Anda, gunakan penggeser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung satuan ukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Ketinggian garis harga

Tinggi baris memengaruhi ruang antara setiap baris teks harga Anda Jika Anda ingin menambah ruang di antara setiap baris, gunakan penggeser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan terletak di sebelah kanan kursor. Kolom masukan mendukung satuan ukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis satuannya.

Gunakan gaya khusus untuk tombol

Mengaktifkan opsi ini mengungkapkan berbagai pengaturan kustomisasi tombol yang dapat Anda gunakan untuk mengubah tampilan tombol modul Anda.

Ukuran teks tombol

Pengaturan ini dapat digunakan untuk menambah atau mengurangi ukuran teks di tombol. Tombol menyesuaikan saat ukuran teks bertambah dan berkurang.

Warna teks tombol

Secara default, tombol mengadopsi warna aksen tema Anda seperti yang ditentukan dalam Penyesuai Tema. Opsi ini memungkinkan Anda untuk menetapkan warna teks kustom ke tombol modul ini. Pilih warna kustom Anda menggunakan color picker untuk mengubah warna tombol.

Warna latar tombol

Secara default, tombol memiliki warna latar transparan. Ini dapat diubah dengan memilih warna latar belakang yang diinginkan dari pemilih warna.

Buat Toko Online Anda dengan mudah

Unduh WooCommerce gratis, plugin e-commerce terbaik untuk menjual produk fisik dan digital Anda di WordPress. [Rekomendasi]

Lebar Batas Tombol

Semua tombol Divi memiliki batas 2px secara default. Perbatasan ini dapat ditingkatkan atau dikurangi menggunakan pengaturan ini. Perbatasan dapat dihapus dengan memasukkan nilai 0.

Warna batas tombol

Secara default, batas tombol mengadopsi warna aksen tema Anda seperti yang ditentukan dalam Penyesuai Tema. Opsi ini memungkinkan Anda untuk menetapkan warna tepi kustom ke tombol modul ini. Pilih warna kustom Anda menggunakan color picker untuk mengubah warna batas tombol.

Radius batas tombol

Jari-jari perbatasan memengaruhi kebulatan sudut tombol Anda. Secara default, tombol di Divi memiliki radius batas kecil yang membulatkan sudut sebesar 3 piksel. Anda dapat mengurangi nilai ini menjadi 0 untuk membuat tombol persegi atau meningkatkannya secara signifikan untuk membuat tombol dengan tepi melingkar.

Jarak dari huruf-huruf tombol

Penspasian huruf mempengaruhi jarak antara setiap huruf. Jika Anda ingin menambah ruang di antara setiap huruf dalam teks tombol Anda, gunakan penggeser rentang untuk menyesuaikan ruang atau masukkan ukuran jarak yang diinginkan di bidang masukan di sebelah kanan penggeser. Kolom masukan mendukung unit pengukuran yang berbeda, yang berarti Anda dapat memasukkan "px" atau "em" bergantung pada nilai ukuran Anda untuk mengubah jenis unitnya.

Font tombol

Anda dapat mengubah fonta teks tombol Anda dengan memilih font yang diinginkan dari menu drop-down. Divi hadir dengan lusinan font hebat yang diberdayakan oleh Google Fonts. Secara default, Divi menggunakan font Open Sans untuk semua teks di halaman Anda. Anda juga dapat menyesuaikan gaya teks Anda menggunakan opsi tebal, miring, huruf besar, dan garis bawah.

Tambahkan ikon ke tombol

Dinonaktifkan, pengaturan ini akan menghapus ikon dari tombol Anda. Secara default, semua tombol Divi menampilkan ikon panah di hover.

Ikon tombol

Jika ikon diaktifkan, Anda dapat menggunakan pengaturan ini untuk memilih ikon mana yang akan digunakan di tombol Anda. Divi memiliki ikon berbeda untuk dipilih.

Warna ikon tombol

Menyesuaikan parameter ini akan mengubah warna ikon yang muncul di tombol Anda. Secara default, warna ikon sama dengan warna teks tombol Anda, tetapi pengaturan ini memungkinkan Anda menyesuaikan warna secara mandiri.

Penempatan tombol ikon

Anda dapat memilih untuk menampilkan ikon tombol Anda di sebelah kiri atau kanan tombol Anda.

Tampilkan hanya ikon saat mengarahkan tombol

Secara default, ikon tombol hanya ditampilkan saat melayang. Jika Anda ingin ikon selalu muncul, matikan pengaturan ini.

Warna teks di flyover tombol

Saat tombol diarahkan oleh mouse pengunjung, warna ini akan digunakan. Warna akan berubah dari warna dasar yang ditentukan dalam pengaturan sebelumnya.

Warna latar tombol pada flyover

Saat tombol diarahkan oleh mouse pengunjung, warna ini akan digunakan. Warna akan berubah dari warna dasar yang ditentukan dalam pengaturan sebelumnya.

Warna batas di jalan layang

Saat tombol diarahkan oleh mouse pengunjung, warna ini akan digunakan. Warna akan berubah dari warna dasar yang ditentukan dalam pengaturan sebelumnya.

Radius batas tombol pada ikhtisar

Saat tombol digerakkan oleh mouse pengunjung, nilai ini akan digunakan. Nilai akan berubah dari nilai dasar yang ditentukan di pengaturan sebelumnya.

Jarak dari huruf-huruf tombol pada flyover

Saat tombol digerakkan oleh mouse pengunjung, nilai ini akan digunakan. Nilai akan berubah dari nilai dasar yang ditentukan di pengaturan sebelumnya.

Opsi Tabel Harga Individual Pilihan Lanjutan

opsi lanjutan divi.png

CSS khusus

CSS khusus juga dapat diterapkan ke modul dan bagian internal modul mana pun. Di bagian CSS Khusus, Anda akan menemukan bidang teks tempat Anda dapat menambahkan lembar gaya CSS khusus langsung ke setiap elemen. Entri CSS dalam pengaturan ini sudah dibungkus dalam tag gaya. Jadi masukkan saja aturan CSS yang dipisahkan oleh titik koma.

Tutorial Divi lainnya

Artikel ini berisi komentar 2

  1. Halo,
    Terima kasih atas artikel yang sangat tepat dan terperinci ini. Saya baru menggunakan pembangun DIVI dan saya perhatikan bahwa setelah membuat tabel tarif saya dengan 3 kolom, tampilan untuk seluler adalah bencana (2 kolom ekstra sempit dan kolom ketiga di baris…).
    Apakah ada cara (selain menduplikasi tabel dan menyembunyikannya) untuk mengkonfigurasi ini seperti di Bootstrap misalnya (berikan kolom dengan lebar 33% di desktop dan 100% di ponsel)?
    Merci pour votre aide.

Tinggalkan komentar

Alamat email Anda tidak akan dipublikasikan. Bidang yang harus diisi ditandai *

Situs ini menggunakan Akismet untuk mengurangi yang tidak diinginkan. Pelajari lebih lanjut tentang bagaimana data komentar Anda digunakan.

Kembali ke atas
5 saham
saham2
menciak
Register3