Elementor: Cara Membuat Halaman Kustom untuk WooCommerce

Elementor: Cara Membuat Halaman Kustom untuk WooCommerce

Apakah Anda ingin mempelajari cara membuat halaman khusus untuk toko WooCommerce dengan Elementor?

Seperti yang Anda ketahui, Elementor Pro hadir dengan fitur pembuat WooCommerce yang memungkinkan Anda membangun situs web e-Commerce khusus dengan WooCommerce tanpa pengkodean. Fitur ini memungkinkan Anda membuat halaman WooCommerce khusus menggunakan editor visual Elementor yang menawarkan antarmuka intuitif.

Lihat juga: Cara menginstal Elementor di WordPress

Pada saat menulis artikel ini, Anda dapat membuat halaman kustom untuk halaman toko, halaman produk, dan halaman arsip produk (tag dan kategori). Segera Anda juga akan dapat membuat halaman kustom untuk halaman checkout dan halaman keranjang.

Pada artikel ini, kami akan menunjukkan cara membuat halaman toko WooCommerce kustom menggunakan fitur pembangun WooCommerce Elementor Pro.

Halaman toko itu sendiri adalah salah satu halaman default di WooCommerce. Halaman ini berfungsi sebagai etalase untuk menampilkan produk Anda. Anda dapat mengakses halaman ini dengan pergi ke situsanda.com/store. Secara default, halaman toko WooCommerce hanya menampilkan produk WooCommerce.

Dengan membuat halaman toko kustom menggunakan Elementor Pro, Anda dapat menambahkan elemen untuk membuat etalase Anda lebih menarik.

Cara membuat halaman kustom toko WooCommerce dengan Elementor

Setidaknya ada dua widget Elementor yang dapat Anda gunakan untuk membuat halaman kustom toko WooCommerce: Produk Arsip serta Produk.

Dalam contoh ini, kami menggunakan yang terakhir.

Fungsi widget Produk-produk sangat mirip dengan widget Posting. Perbedaannya adalah widget Produk digunakan untuk menampilkan produk WooCommerce sedangkan widget Posting digunakan untuk menampilkan postingan blog.

Baca juga: Cara mengimpor atau mengekspor model di Elementor

Harap dicatat bahwa Anda hanya dapat menemukan widget Produk saat plugin WooCommerce diinstal dan diaktifkan.

Untuk mulai membuat halaman toko WooCommerce kustom menggunakan Elementor Pro, buka Pertama à Template -> Pembuat Tema di dasbor WordPress Anda. Klik pada tab Produk-produk arsip dari halaman Pembuat Tema, lalu klik tombol menambahkan sebuah ARSIP PRODUK.

Beri nama model Anda dan klik tombolnya BUAT MODEL.

cara membuat halaman khusus untuk toko WooCommerce dengan ElementorAda tiga templat halaman toko kustom yang dapat Anda pilih jika Anda ingin membuat halaman toko kustom dari sebuah templat. Jika Anda ingin membangun halaman toko kustom dari awal, Anda bisa menutup perpustakaan template.

Lihat juga: Cara menggunakan Sampler Warna di Elementor

Dalam contoh ini, kami akan membuat halaman toko kustom dari awal. Seperti disebutkan di atas, kita akan menggunakan widget Produk untuk menampilkan produk.

Sebelum menambahkan widget Produk ke kotak edit, Anda dapat menentukan tata letak dengan menambahkan bagian dan kolom. Setelah tata letak siap, Anda cukup menyeret widget Produk ke dalam kotak edit.

Seperti yang Anda lihat, widget Produk secara otomatis memuat dan menampilkan produk WooCommerce terbaru. Anda dapat mengubah kueri dengan membuka blok Pertanyaan di bawah tab Isi dari panel pengaturan. Ada lima pilihan untuk dipilih:

  • Kueri Saat Ini - Kueri Saat Ini
  • Produk Terbaru - Produk Terbaru
  • Penjualan - Penjualan
  • Unggulan - Unggulan
  • Seleksi Manual - Seleksi Manual

Anda juga dapat mengatur urutan di mana produk ditampilkan atau mengecualikan tertentu

cara membuat halaman khusus untuk toko WooCommerce dengan Elementor

Untuk mengatur jumlah kolom dan baris, Anda dapat membuka blok kadar di bawah tab Kandungan. Dari blok ini Anda juga dapat mengaktifkan pagination.

Anda dapat bermain-main dengan panel pengaturan sampai Anda mendapatkan pengaturan terbaik untuk widget Produk. Setelah Anda selesai dengan widget Produk, Anda dapat menambahkan lebih banyak widget ke halaman Anda.

Baca juga: Cara menggunakan pemilih warna di Elementor

Setelah Anda selesai mengedit halaman, Anda dapat mengklik tombol MENERBITKAN di bagian bawah panel pengaturan.

Tambahkan kondisi tampilan dengan mengklik tombol menambahkan kondisi. Karena Anda ingin membuat halaman toko khusus, pilih opsi Toko Halaman. Klik tombol SIMPAN & TUTUP untuk menyimpan perubahan.

cara membuat halaman khusus untuk toko WooCommerce dengan Elementor

Sejauh ini, Anda telah berhasil membuat halaman toko WooCommerce kustom menggunakan Elementor Pro. Anda bisa pergi di situs Anda.com/store untuk memeriksa hasilnya.

Sesuaikan widget Produk

Sebelum menerbitkan halaman Anda, Anda dapat menyesuaikan widget Produk agar lebih menarik. Untuk melakukannya, klik widget di kotak edit dan navigasikan ke tab Gaya dari panel pengaturan. Ada empat blok yang bisa Anda buka sebagai berikut:

  • Produk-produk

Anda dapat membuka blok ini untuk menentukan jarak antara kolom dan baris. Dari blok ini, Anda juga dapat mengatur tipografi (keluarga font, ukuran font, dll.) serta warna teks elemen produk seperti judul produk, harga produk, peringkat produk, produk, dll…. Anda juga dapat mengatur batas gambar produk,

  • Kotak

Dalam konteks ini, Box mengacu pada wadah setiap produk. Anda dapat membuka blok Kotak untuk menentukan lebar batas wadah, radius batas, bayangan kotak, warna latar belakang, warna batas, dll.

  • Pemberian nomor pd halaman buku

Jika Anda mengaktifkan opsi Pemberian nomor pd halaman buku dari blok Kandungan, Anda dapat membuka blok Pemberian nomor pd halaman buku di bawah tab Gaya untuk menyesuaikan pagination. Anda dapat mengatur hal-hal seperti spasi, warna batas, warna latar belakang, dll.

Anda juga dapat menentukan parameter yang berbeda pada setiap status (normal, menunjuk dan aktif).

  • Penjualan Flash

Saat Anda menambahkan produk baru di WooCommerce, Anda dapat menetapkan atribut harga jual untuk menunjukkan kepada pengunjung Anda bahwa produk terkait didiskon. Untuk menekankan hal ini, Anda dapat menampilkan atribut sale di halaman toko sehingga produk yang didiskon memiliki badge obral.

Anda dapat membuka blok Penjualan Flash untuk mempersonalisasi lencana penjualan. Anda dapat menentukan elemen seperti warna teks, warna latar belakang, tipografi, radius batas, ukuran (lebar dan tinggi), jarak, dll….

Pada akhirnya

WooCommerce Builder adalah salah satu fitur yang ditawarkan oleh Elementor Pro. Ini memungkinkan Anda untuk membangun situs web eCommerce yang dipersonalisasi dan unik dengan WooCommerce dan tanpa pengkodean. Tidak perlu menginstal tema WordPress yang mengklaim dirancang untuk WooCommerce. Sebagai gantinya, Anda dapat membuat halaman WooCommerce khusus sendiri menggunakan editor visual Elementor.

Baca juga: Bagaimana cara menambahkan pembagi untuk membuat bagian di Elementor

Hingga versi 3.2.2, Elementor Pro hanya memungkinkan Anda membuat Halaman Toko Kustom, Halaman Produk Tunggal Kustom, dan Halaman Arsip Produk Kustom. Tetapi Elementor mengumumkan bahwa pada versi Elementor Pro berikutnya, Anda juga akan dapat membuat halaman keranjang kustom, halaman checkout kustom, dan halaman akun pelanggan kustom.

Dapatkan Elementor Pro Sekarang!

Kesimpulan

Di sini adalah ! Itu saja untuk artikel ini yang menunjukkan cara membuat halaman khusus untuk toko WooCommerce dengan Elementor. Jika Anda memiliki kekhawatiran tentang cara menuju ke sana fberi tahu kami di komentar.

Namun, Anda juga bisa berkonsultasi sumber daya kita, jika Anda memerlukan lebih banyak elemen untuk melaksanakan proyek pembuatan situs Internet Anda, dengan membaca panduan kami di Pembuatan blog WordPress atau yang di Divi: tema WordPress terbaik sepanjang masa.

Namun sementara itu, bagikan artikel ini di berbagai jejaring sosial Anda.

...

Elementor Pro: 10 Fitur Luar Biasa untuk Dibuka - Bagian II

Elementor Pro: 10 Fitur Luar Biasa untuk Dibuka - Bagian II

Di salah satu artikel kami sebelumnya, kami telah menyajikan 10 fitur teratas Elementor yang akan Anda buka saat Anda meningkatkan ke Elementor Pro

Artikel ini memperkenalkan Anda ke 10 fitur luar biasa lainnya yang akan meningkatkan produktivitas Anda.

1. Lebih dari 300 model siap pakai

Di Elementor, Anda memiliki dua opsi untuk membuat halaman atau template. Pertama-tama, Anda dapat membangun halaman Anda dari awal menggunakan konsep desain Anda sendiri. Kedua, Anda dapat membangun halaman Anda dari template siap pakai yang ditawarkan oleh Elementor.

Jika Anda menggunakan Elementor Pro, Anda akan memiliki akses ke semua template siap pakai yang tersedia di perpustakaan template, termasuk yang berlabel "PRO". Elementor sendiri memiliki total lebih dari 300 template siap pakai. Anda dapat mengklik ikon folder di area editor Elementor untuk membuka perpustakaan template.

Elementor Pro

2. Model kit

En Agustus 2019, Elementor merilis edisi pertama kit template bulanan. Apa itu template kit?

Kit template Elementor adalah kumpulan template Elementor yang dirancang khusus untuk jenis situs web tertentu. Semua model dalam model kit memiliki konsep desain yang sama. Tipografi, warna, dll. Kit template memungkinkan Anda membangun situs web lebih cepat.

3. Editor situs web lengkap

Konsep pengeditan situs lengkap memungkinkan Anda mengedit dua atau lebih elemen situs web Anda dari satu tempat. Dalam konteks Elementor, Anda dapat mengedit footer, header, dan template seperti template posting tunggal atau template halaman kategori semua dari satu tempat.

Misalkan Anda mengedit templat posting unik khusus situs web Anda, dan Anda ingin membuat beberapa perubahan tajuk khusus. Dalam hal ini, Anda tidak perlu menutup editor Elementor untuk membuat perubahan pada header.

Anda cukup mengarahkan mouse ke header (atau footer) dan klik pada pegangan kuning. Demikian juga, ketika Anda mengedit tajuk khusus dan ingin membuat perubahan pada templat posting tunggal khusus, Anda cukup mengarahkan mouse ke templat posting tunggal dan mengklik pegangan kuning juga.

4. Widget Global

Widget Global adalah fitur Elementor Pro yang didedikasikan untuk merampingkan alur kerja Anda. Selain itu, fungsionalitasnya membantu Anda memiliki desain yang konsisten pada beberapa elemen seperti tombol atau formulir.

Baca panduan kami di Cara menggunakan warna global di Elementor

Misalkan Anda sedang membuat sebuah website yang terdiri dari beberapa halaman. Pada beberapa halaman Anda ingin menambahkan tombol. Dalam hal ini, Anda dapat menentukan widget tombol global. Anda kemudian dapat menggunakan widget tombol global yang ditentukan pada setiap halaman yang Anda buat, alih-alih menambahkan widget tombol baru dan menatanya langsung dari awal. Ini akan menghemat banyak waktu dalam menjalankan dan menjalankan proyek Anda.

Saat Anda membuat perubahan pada widget global, perubahan tersebut diterapkan ke semua halaman tempat widget global terkait ditambahkan.

5. Tautan aksi

Saat Anda membuat halaman arahan menggunakan Elementor, Anda dapat menambahkan tindakan tertentu. Misalnya, Anda mungkin ingin pengunjung menghubungi Anda melalui WhatsApp atau email. Elementor Pro memungkinkan Anda menambahkan tindakan tertentu ke tombol atau tautan. Anda dapat menggunakan fitur ini untuk menambahkan tombol WhatsApp, tombol email, dll… ke halaman arahan Anda.

Temukan tutorial kami di Bagaimana cara menambahkan tombol Skype di Elementor

Berikut adalah tindakan yang dapat Anda tentukan:

  • Kirim e-mail
  • Kontak melalui WhatsApp
  • Mengirim pesan teks (SMS)
  • Lakukan panggilan
  • Mulai percakapan Skype
  • Mulai percakapan Messenger
  • Mulai obrolan Viber
  • Tambahkan acara ke Google Kalender
  • Tambahkan acara ke kalender Outlook
  • Tambahkan acara ke kalender Yahoo

Untuk menentukan tindakan tertentu, Anda dapat mengklik ikon dinamis di bidang tautan dan memilih URL kontak. Anda kemudian dapat mengklik ikon kunci inggris untuk memilih tindakan yang ingin Anda atur.Elementor Pro

6. Font khusus

Elementor sudah memiliki koleksi font yang kaya, tetapi jika Anda menginginkan lebih, Anda dapat menginstal keluarga font apa pun yang Anda inginkan. Versi pro Elementor memungkinkan Anda untuk menambahkan font baru dalam format berikut:

  • WOFF
  • WOFF2
  • TTF
  • SVG
  • EOT

Anda juga bisa integrasikan Elementor Anda dengan Adobe Fonts jika Anda menggunakan font Adobe.

7. Ikon khusus

Elementor memiliki perpustakaan ikon yang kaya bagi Anda untuk menambahkan ikon ke halaman Anda. Elementor sendiri menggunakan vendor pihak ketiga untuk menyediakan koleksi ikon (Font Awesome dalam hal ini).

Lire aussi Cara menggunakan font Adobe di Elementor

Jika Anda ingin menggunakan ikon Anda sendiri, Elementor Pro memungkinkan Anda melakukannya. Anda dapat mengunduh kumpulan ikon dan Elementor akan menyediakannya di pustaka ikon. Anda bisa pergi ke Elementor -> Ikon Kustom untuk menambahkan ikon khusus di Elementor.

8. Warna dinamis

Elementor Pro memungkinkan Anda untuk menambahkan konten dinamis ke WordPress Anda. Selain bidang khusus dan konten dinamis WordPress default, Anda juga dapat menambahkan warna dinamis. Dengan menggunakan fitur ini, Anda dapat (secara dinamis, tentu saja) mengatur warna terpisah pada elemen yang sama pada model tertentu.

Misalnya, Anda dapat menggunakan fitur untuk mengatur warna judul posting yang berbeda untuk situs web Anda. Warna judul posting diatur melalui bidang khusus saat Anda menulis posting baru.

9. Manajer peran

Anda dapat menggunakan Manajer Peran untuk mengontrol siapa yang dapat mengakses editor Elementor di situs web WordPress Anda. Fitur ini berguna jika Anda memiliki situs WordPress besar dengan jumlah pengguna yang tinggi. Anda dapat mengakses fitur ini dengan membuka Elementor -> Manajer peran di dashboard WordPress Anda.

10. Kode Kustom

Sebelum Elementor Pro versi 3.1.1, Anda harus menambahkan widget HTML ke header / footer khusus Anda untuk instal Google Analytics di situs web bertenaga Elementor Anda. Tetapi Anda sekarang dapat menginstal Google Analytics tanpa mengubah header atau footer Anda berkat fitur Kode Kustom.

Selain menginstal Google Analytics, Anda juga dapat menggunakan fitur untuk menginstal alat analisis lain seperti Facebook Pixel.

Pada akhirnya

Dalam banyak kasus, memutakhirkan ke Elementor Pro tidak hanya memungkinkan Anda untuk membuka kunci fitur profesional, tetapi juga mengungkapkan fitur WordPress yang mungkin belum pernah Anda dengar, seperti bidang khusus dan jenis publikasi yang dipersonalisasi.

Elementor menawarkan paket pro yang dapat Anda gunakan tergantung pada kebutuhan Anda. Untuk penggunaan pribadi, misalnya, Anda dapat menggunakan paket PENTING. Atau jika Anda bekerja untuk agensi, Anda dapat menggunakan rencana tersebut AGEN.

Dapatkan Elementor Pro Sekarang!

Kesimpulan

Di Sini ! Itu saja untuk artikel ini yang memperkenalkan Anda ke 10 fitur lain yang akan Anda buka kuncinya jika Anda meningkatkan ke Elementor versi Pro. Jika Anda memiliki kekhawatiran tentang cara menuju ke sana fberi tahu kami di komentar.

Namun, Anda juga bisa berkonsultasi sumber daya kita, jika Anda memerlukan lebih banyak elemen untuk melaksanakan proyek pembuatan situs Internet Anda, dengan membaca panduan kami di Pembuatan blog WordPress atau yang di Divi: tema WordPress terbaik sepanjang masa.

Namun sementara itu, bagikan artikel ini di berbagai jejaring sosial Anda.

Elementor Pro: 10 Fitur Luar Biasa Untuk Dibuka - Bagian I

Elementor Pro: 10 Fitur Luar Biasa Untuk Dibuka - Bagian I

Apakah Anda ingin mengetahui fitur terbaik untuk dikuasai di Elementor Pro?

Semua pengguna WordPress telah mengetahuinya. Elementor adalah salah satu pembuat halaman paling populer. Menjadi plugin freemium, Anda dapat menikmati pengalaman membuat halaman yang indah secara visual menggunakan Elementor dengan opsi untuk meningkatkan ke versi pro untuk membuka fitur yang lebih canggih.

Baca panduan kami di: Cara menginstal Elementor di WordPress

Sebenarnya ada dua cara untuk memperluas fungsionalitas Elementor. Selain meningkatkan ke versi pro, Anda juga dapat menginstal add-on pihak ketiga yang dikembangkan oleh pengembang terkenal seperti developers weDevs, Pengembang WP, untuk Crocoblock. Jika Anda lebih suka meningkatkan ke Elementor Pro dan masih bertanya-tanya fitur apa yang dapat Anda buka, inilah daftarnya.

20 Fitur Teratas Elementor Pro

1. Pembuat tema

WordPress ditulis dalam PHP. Konon, untuk membuat plugin atau tema WordPress, Anda juga harus mahir dalam PHP dan bahasa pendukung seperti JavaScript. Tapi itu dulu. Hari ini, Anda dapat membuat tema WordPress Anda sendiri tanpa coding berkat fitur pembuat tema yang ditawarkan oleh beberapa plugin pembuat halaman seperti Elementor.

Apa itu pembuat tema?

Untuk memahami konsep pembuat tema, Anda harus terlebih dahulu memahami komponen tema WordPress. Tema WordPress terdiri dari file template. Setiap file template mengontrol tata letak bagian dari tema. Misalnya file header.php mengontrol tata letak tajuk tema, sedangkan file footer.php mengontrol tata letak footer tema. Sebagian besar tema WordPress memiliki file template berikut:

  • header.php: Untuk mengontrol tata letak header.
  • footer.php: Untuk mengontrol tata letak footer.
  • tunggal.php: Untuk mengontrol tata letak artikel tunggal (posting blog).
  • sidebar.php: Untuk mengontrol tata letak bilah sisi.
  • arsip.php: Untuk mengontrol tata letak halaman arsip.
  • halaman.php: Untuk mengontrol tata letak halaman.

Pembuat tema memungkinkan Anda membuat templat khusus untuk menggantikan templat di atas, serta templat lain yang termasuk dalam tema. Anda dapat membuat template khusus menggunakan editor visual dari pembuat halaman yang Anda gunakan (Elementor dalam hal ini).

elemen-pro-fitur-luar biasa-untuk-master

Salah satu keuntungan menggunakan pembuat tema alih-alih tema adalah Anda dapat menentukan di mana templat khusus akan diterapkan. Misalnya, Anda dapat menentukan templat tajuk khusus untuk diterapkan ke posting, halaman, posting tertentu di bawah kategori tertentu, seluruh situs web, dll.

Dengan kata lain, Anda dapat memiliki tata letak yang berbeda dari bagian tertentu dari tema (misalnya header) dengan membuat beberapa template kustom untuk bagian yang sama. Keuntungan lain, Anda memiliki opsi penyesuaian tanpa batas.

2. Pembuat WooCommerce

Apakah Anda memiliki situs web eCommerce bertenaga WooCommerce? Elementor Pro juga mampu membawa desain situs web eCommerce Anda ke tingkat berikutnya dengan memungkinkan Anda membuat template khusus untuk toko online WooCommerce Anda. Tidak perlu membeli tema WooCommerce.

Baca: Cara membuat halaman kustom toko WooCommerce dengan Elementor

Sebagai gantinya, Anda dapat menyesuaikan sendiri bagian-bagian WooCommerce menggunakan editor visual Elementor. Bagian WooCommerce tempat Anda dapat membuat template khusus adalah:

  • Halaman produk tunggal
  • Halaman arsip produk (kategori dan tag)
  • halaman toko

Anda memiliki widget berikut untuk membuat template khusus untuk WooCommerce:

Produk-produk Peringkat Produk
Remah roti WooCommerce Stok Produk
Tambahkan ke Keranjang Khusus Produk Meta
Halaman WooCommerce Deskripsi Singkat
Kategori Produk Konten Produk
Keranjang Menu Tab Data Produk
Judul Produk Informasi Tambahan
Gambar produk Terkait Produk
Daftar Harga Upsell
Add To Cart

3. Pembuat Formulir

elemen-pro-fitur-luar biasa-untuk-master

Elementor Pro memberi Anda akses ke widget Formulir. Anda dapat menggunakan widget ini untuk menambahkan formulir ke template pembuat halaman/tema yang sedang Anda kerjakan. Widget ini memungkinkan Anda membuat berbagai jenis formulir, berkat dukungan jenis bidangnya yang luas. Berikut adalah jenis bidang yang didukung oleh widget Formulir Elementor:

Teks Penerimaan
Surel Tersembunyi
Textarea HTML
URL Kata Sandi
tel Upload File
memilih Waktu
kotak centang Tanggal
radio Jumlah

Anda dapat menyematkan formulir Anda di reCAPTCHA untuk melindunginya dari spammer. Dengan sedikit trik, Anda juga dapat menggunakan widget Formulir untuk membuat halaman pendaftaran di situs web Anda. Elementor juga memungkinkan Anda untuk buat formulir dalam beberapa langkah untuk memungkinkan Anda membuat formulir panjang yang disederhanakan, serta memberikan a pengalaman pengguna terbaik kepada pengguna Anda.

Elementor sendiri tidak memiliki fitur default untuk menangani pengiriman formulir. Widget Formulir Elementor mendukung integrasi dengan layanan populer GetResponse, ActiveCampaign, ConvertKit, Discord, dll.

4. Pembangkit Popup

Pembuat pop-up adalah salah satu fitur yang dapat Anda buka setelah meningkatkan ke Elementor Pro. Fitur ini memungkinkan Anda membuat pop-up yang indah di situs web Anda tanpa coding. Anda bahkan dapat menggunakan Templat formulir siap pakai yang ditawarkan untuk merampingkan alur kerja Anda.

Ada lebih dari 100 template pop up siap pakai yang ditawarkan oleh Elementor.

elemen-pro-fitur-luar biasa-untuk-master

Generator pop-up Elementor itu sendiri mendukung jenis pemicu berikut:

  • Saat memuat halaman - Saat memuat halaman
  • Saat menggulir - Saat menggulir
  • Saat menggulir ke elemen - Saat menggulir ke elemen
  • Saat diklik - Saat diklik
  • Setelah tidak aktif - Setelah tidak aktif
  • Maksud keluar di halaman - Maksud keluar di halaman

Generator Popup Elementor Pro juga mendukung kondisi tampilan, yang memungkinkan Anda menentukan di mana pop-up akan muncul. Ini juga memungkinkan Anda untuk menampilkan jendela pop-up berdasarkan kondisi berikut:

  • Setelah x tampilan halaman
  • Setelah x sesi
  • Saat tiba dari url tertentu
  • Ketika mesin pencari tiba
  • Tampilkan jendela pop-up hanya untuk pengguna yang tidak masuk
  • Tampilan pada jenis perangkat tertentu (desktop, tablet, smartphone)
  • Tampilkan di browser web tertentu

Dengan dukungan pemicu klik, Anda juga dapat menggunakan generator pop-up untuk membuat keduanya menu layar penuh dan menu di luar kanvas.

5. Integrasi pihak ketiga

Seperti disebutkan di atas, Anda dapat menggunakan widget Formulir Elementor untuk membuat berbagai macam formulir berkat dukungan ekstensifnya untuk bidang formulir. Salah satunya memungkinkan Anda menggunakan widget Formulir untuk membuat formulir pendaftaran email untuk menghasilkan prospek.

Anda dapat menghubungkan formulir Anda ke layanan pemasaran email populer seperti ActiveCampaign, GetResponse, dll.

Berikut adalah layanan pihak ketiga yang dapat Anda gunakan untuk mengintegrasikan formulir Anda:

  • GetResponse
  • ActiveCampaign
  • MailerLite
  • KonverKit
  • MailPenyair
  • MailChimp
  • Menitik
  • Kendur
  • Discord
  • Hubspot

Integrasi pihak ketiga ini sangat berguna jika Anda ingin menggunakan Elementor untuk membuat halaman arahan.

6. CSS Khusus

Memang benar bahwa Elementor memungkinkan Anda membuat halaman yang indah di situs WordPress Anda tanpa harus berurusan dengan CSS. Namun, jika Anda ingin membuat situs web yang benar-benar unik, Anda dapat menggunakan keterampilan CSS Anda. Fitur ini memungkinkan Anda untuk mengimplementasikan fitur CSS yang belum tersedia di Elementor, seperti CSS Transform untuk menambahkan efek hover yang bergaya ke Elementor.

Baca juga: Cara mengimpor atau mengekspor model di Elementor

Anda dapat menambahkan CSS khusus ke setiap elemen Elementor. Baik itu bagian, kolom, atau widget. Anda dapat mengakses blok CSS khusus di bawah tab maju dari panel pengaturan (panel di sisi kiri) di editor Elementor untuk menambahkan CSS khusus.

7. Efek gerak

Elementor Pro hadir dengan opsi penyesuaian untuk memungkinkan Anda menerapkan efek gerakan ke elemen pada halaman yang sedang Anda kerjakan. Anda dapat menggunakan fitur ini untuk menambahkan efek animasi ke halaman Anda tanpa perlu memahami JavaScript.

Efek gerak yang ditawarkan Elementor Pro terbagi menjadi dua jenis: efek gulir dan efek mouse. Selain itu, Anda juga dapat menerapkan opsi lengket ke bagian dan widget.

8. Lebih dari 90 widget

Seperti yang Anda ketahui, Elementor dirilis sebagai plugin freemium, yang berarti ada versi gratis yang tersedia bagi Anda untuk menikmati pengalaman pengguna Elementor tanpa mengeluarkan uang sepeser pun. Meskipun Elementor Free menawarkan widget dasar, versi pro hadir dengan widget yang lebih canggih seperti Formulir, Postingan, Login, Daftar Harga, dll.

Berikut adalah widget yang dapat Anda buka kuncinya setelah meningkatkan ke Elementor Pro.

Posts Countdown posting Kutipan
Portofolio Bagikan Tombol Gambar Pilihan
Slides blockquote Kotak Penulis
Bentuk Tombol Facebook Posting Komentar
Masuk Facebook Komentar Posting Navigasi
Judul Animasi Facebook Embed Kirim Info
Daftar Harga Halaman Facebook Produk-produk
Harga Table Contoh Remah roti WooCommerce
Kotak Flip Logo Situs Kustom Tambahkan ke Troli
Call to Action Judul situs Halaman WooCommerce
Korsel Media Ubin Halaman Kategori Produk
Korsel Testimonial Nav menu Keranjang Menu
Review Formulir Pencarian Lottie
Peta Situs Judul posting Sorot kode
Daftar putar video Tombol PayPal hotspot

Ada lebih dari 90 widget yang dapat Anda buka secara total (widget gratis dan widget pro)

9. Konten dinamis

Anda tidak hanya dapat menggunakan Elementor untuk membangun situs web statis. Dengan dukungan konten dinamis, Anda juga dapat menggunakan Elementor untuk membangun situs web dinamis seperti blog, portal berita, situs iklan, dan jenis situs web dinamis lainnya. Anda dapat menambahkan konten dinamis ke halaman template atau pembuat tema menggunakan widget berikut:

  • Logo Situs
  • Judul situs
  • Page Title
  • Judul posting
  • posting Kutipan
  • Gambar Pilihan
  • Kirim Info
  • Posts

10. Bidang khusus

Widget yang kami sebutkan pada poin 9 di atas dapat digunakan untuk menambahkan konten dinamis WordPress default, seperti judul posting, meta posting, gambar unggulan, dll.

Bagaimana dengan bidang khusus? Elementor Pro juga memungkinkan Anda untuk menambahkan bidang khusus. Dengan memaksimalkan fungsi ini, Anda dapat menggunakan Elementor untuk membangun segala jenis situs web dengan plugin seminimal mungkin. Elementor Pro kompatibel dengan plugin bidang kustom populer berikut:

  • polong
  • Canggih Custom Fields
  • Toolset
  • Mesin jet

Bagaimana cara mengintegrasikan plugin bidang khusus tertentu dengan Elementor?

Anda cukup membuat grup bidang khusus menggunakan plugin bidang khusus favorit Anda dan menggunakan Elementor untuk menampilkan data bidang khusus yang Anda buat. Anda dapat menampilkan bidang khusus pada template. Anda dapat membaca artikel kami sebelumnya untuk mengetahuinya cara menambahkan bidang khusus di Elementor.

Pada akhirnya

Elementor adalah alat yang hebat untuk membangun situs web yang indah tanpa berurusan dengan kode apa pun. Baik itu kode CSS, kode HTML, kode PHP atau kode JavaScript. Versi gratis Elementor sangat bagus, tetapi untuk membuka potensinya sebagai plugin pembuat halaman terbaik, Anda perlu membuka kunci semua fitur, yang dapat Anda lakukan dengan meningkatkan ke versi pro.

Di sini berakhir daftar fitur pertama yang dapat Anda buka menggunakan Elementor Pro. Anda akan menemukan yang berikutnya di artikel lain.

Dapatkan Elementor Pro Sekarang!

Kesimpulan

Di Sini ! Itu saja untuk artikel ini yang memperkenalkan Anda pada fitur luar biasa terbaik untuk dikuasai di Elementor Pro. Jika Anda memiliki kekhawatiran tentang cara menuju ke sana fberi tahu kami di komentar.

Namun, Anda juga bisa berkonsultasi sumber daya kita, jika Anda memerlukan lebih banyak elemen untuk melaksanakan proyek pembuatan situs Internet Anda, dengan membaca panduan kami di Pembuatan blog WordPress atau yang di Divi: tema WordPress terbaik sepanjang masa.

Namun sementara itu, bagikan artikel ini di berbagai jejaring sosial Anda.

...

Elementor: Buat tombol unduh file PDF

Elementor: Buat tombol unduh file PDF

Apakah Anda ingin membuat tombol unduh file PDF dengan Elementor Page Builder?

Saat membuat halaman Bantuan Elemen (apakah itu halaman beranda, halaman arahan, dll...), Anda dapat menambahkan tombol unduh yang, ketika pengunjung mengklik tombol, file langsung diunduh alih-alih diarahkan ke tab browser web baru untuk melihat mengajukan.

Baca juga: Cara menyematkan PDF di Elementor tanpa menulis kode

Elementor mempunyai sebuah Widget tombol yang dapat Anda gunakan untuk membuat tombol unduh file. Saat menambahkan widget Tombol, Anda cukup menambahkan tautan file Anda di panel pengaturan.

Baca juga: Cara menginstal Elementor di WordPress

Namun, pengaturan default akan mengarahkan pengunjung Anda ke tab baru untuk melihat file untuk format file tertentu, termasuk PDF dan format gambar seperti JPG dan PNG. Jika Anda ingin file diunduh secara langsung, Anda harus menambahkan atribut khusus ke tautan unduhan.

Membuat tombol unduh file PDF di Elementor

Pertama, unggah file PDF ke perpustakaan media WordPress. Untuk melakukannya, masuk ke dasbor WordPress Anda dan navigasikan ke Media -> Tambahkan. Klik tombol Pilih file untuk memilih file Anda.

Setelah file diunggah, Anda akan melihat tombol Salin URL ke papan klip untuk menyalin URL file dan tautan Mengubah untuk mengedit file.

Klik tombol Salin URL ke papan klip.

Anda juga dapat menemukan URL file dari perpustakaan media WordPress (Media -> Pustaka media). Cukup pilih file yang ingin Anda gunakan dan klik Salin URL ke File. papan klip di jendela yang muncul.

Setelah URL disalin, buka editor Elementor dan tambahkan widget Tombol. Rekatkan URL yang baru saja Anda salin ke bidang Hak gadai dari panel pengaturan.

buat tombol unduh file PDF dengan Elementor

Untuk menambahkan atribut khusus, klik ikon roda gigi di bidang Link. Anda dapat mengetikkan nama apa pun di bidang Atribut Kustom.

Anda dapat menggunakan format berikut: Télécharger|[nom fichier]. Di rumah saya akan memiliki Télécharger|[Elementor

buat tombol unduh file PDF dengan Elementor

Di Sini. Anda dapat mengakses tab Gaya untuk menyesuaikan tombol. Setelah Anda selesai mengedit seluruh halaman, Anda dapat memperbarui atau menerbitkan halaman Anda.

buat tombol unduh file PDF dengan Elementor

pendek kata

Elementor memiliki widget Tombol yang dapat Anda gunakan untuk menambahkan tombol unduh file di halaman Anda. Anda dapat menambahkan file apa pun yang didukung oleh sistem WordPress, seperti: PDF, ZIP, JPG, PNG, dll…

Namun, untuk format file seperti PDF, JPG, dan PNG, Anda perlu menambahkan atribut tautan khusus agar file dapat diunduh secara langsung.

Jika Anda menggunakan Elementor Pro, Anda juga dapat menggunakan widget Tombol untuk membuat tombol yang dapat ditindaklanjuti seperti tombol obrolan whatsapp, tombol facebook messenger, dll ...

Kesimpulan

Di Sini ! Itu saja untuk artikel ini yang menunjukkan kepada Anda Cara Membuat Tombol Unduh File PDF dengan Elementor Page Builder. Jika Anda menyukai artikel ini, jangan ragu untuk bagikan di jejaring sosial favorit Anda.

Namun, Anda juga akan dapat berkonsultasi dengan kami ressources, jika Anda memerlukan lebih banyak elemen untuk melaksanakan proyek pembuatan situs Internet Anda, dengan membaca panduan kami di Pembuatan blog WordPress.

Ceritakan tentang Anda komentar dan saran di bagian khusus.

... 

Elementor Pro: Cara Membuat Template Posting Unik

Elementor Pro: Cara Membuat Template Posting Unik

Apakah Anda ingin membuat template posting unik dengan Elementor Pro?

Saat Anda menggunakan tema WordPress untuk situs web Anda, Anda mendapatkan templat posting unik di atasnya. Itu terdiri dari elemen yang berbeda: judul publikasi, konten publikasi, gambar unggulan, metadata, komentar, dll.

dengan Elementor, Anda dapat mengontrol tata letak dan desain templat posting unik - pada tema WordPress apa pun.

Pada artikel ini, kami akan menunjukkan cara melakukannya.

Tapi pertama-tama, cari tahu: Cara menginstal Elementor di WordPress

Buka dasbor Anda dan di bawah Model -> Tambahkan 

Cara Membuat Template Postingan Unik dengan Elementor Pro

Dari daftar drop-down, pilih Postingan Tunggal dan beri nama, lalu klik Buat template.

Pilih template posting dan klik Imemasuki.

Cara Membuat Template Postingan Unik dengan Elementor Pro

Tapi, Anda juga harus tahu bahwa jika Anda ingin membuat template dari awal, tutup saja popup dan mulailah membuat template posting unik Anda.

Baca juga: Cara membuat halaman kustom toko WooCommerce dengan Elementor

Klik ikon roda gigi di sudut kiri bawah panel widget untuk memilih posting tertentu sebagai contoh pratinjau saat mengedit.

Edit semua elemen sesuai keinginan. Ketika desain selesai, klik menerbitkan dan mengatur kondisi tampilan.

Cara Membuat Template Postingan Unik dengan Elementor Pro

Hanya publikasi yang menggunakan template bawaan akan memiliki template posting unik yang akan diterapkan padanya, bahkan jika mereka memenuhi kriteria kondisi tampilan. Postingan yang menggunakan template Canvas atau Full Width (atau template apa pun selain Default) tidak akan melihat template Single Post yang diterapkan.

Dapatkan Elementor Pro Sekarang!

Kesimpulan

Di Sini ! Itu saja untuk artikel ini yang menunjukkan cara membuat template posting unik dengan Elementor Pro. Jika Anda memiliki kekhawatiran tentang cara menuju ke sana fberi tahu kami di komentar.

Namun, Anda juga bisa berkonsultasi sumber daya kita, jika Anda memerlukan lebih banyak elemen untuk melaksanakan proyek pembuatan situs Internet Anda, dengan membaca panduan kami di Pembuatan blog WordPress atau yang di Divi: tema WordPress terbaik sepanjang masa.

Namun sementara itu, bagikan artikel ini di berbagai jejaring sosial Anda.

Pembuat Tema WordPress: Semua yang Perlu Anda Ketahui

Pembuat Tema WordPress: Semua yang Perlu Anda Ketahui

Tema adalah salah satu komponen WordPress yang diperlukan. Inilah yang membuat setiap situs web berbasis WordPress unik dalam hal tampilan. Tema WordPress mengontrol tampilan dan tampilan situs web WordPress melalui template (file PHP) dan lembar gaya (file CSS).

Temukan: Cara menginstal Elementor di WordPress

Dengan kata lain, Anda harus mahir dalam PHP dan CSS untuk dapat membuat tema WordPress. Saat ini, sebagian besar tema WordPress modern juga menggunakan JavaScript. Yang sekarang memungkinkan Anda untuk membuat tema WordPress Anda sendiri tanpa pengkodean, tetapi menggunakan pembuat tema WordPress.

Apa itu pembuat tema?

Itulah yang akan kami bahas dalam artikel ini.

Pembuat tema atau Pembuat tema adalah fitur dari plugin pembuat halaman. Fitur ini biasanya tersedia pada versi pro pembuat halaman. Beberapa contoh plugin pembuat halaman yang datang dengan fungsionalitas pembuat tema adalah Elementor et divi.

Lit Cara mengimpor atau mengekspor model di Elementor

Pembuat Tema memungkinkan Anda membuat templat khusus untuk mengganti templat default untuk tema WordPress Anda. Tidak diperlukan keterampilan pengkodean karena semua plugin pembuat halaman dilengkapi dengan editor visual di mana semuanya dilakukan dengan drag and drop. Anda hanya perlu sedikit selera desain.

Akan lebih baik lagi jika Anda memiliki latar belakang desain.

Memahami bagian-bagian dari tema WordPress

Sebelum Anda mulai menggunakan pembuat tema WordPress untuk membuat tema WordPress Anda sendiri, sangat penting untuk memahami bagian-bagian dari tema WordPress. Secara umum, ini adalah bagian dari tema WordPress:

  • Header
  • Footer
  • Tata letak satu publikasi
  • Tata letak tunggal
  • Halaman arsip
  • Halaman hasil pencarian
  • halaman 404

Jika Anda menggunakan WooCommerce, Anda juga memiliki satu halaman produk, halaman kategori produk, dan halaman arsip produk. Tampilan semua bagian ini ditentukan menggunakan template dan stylesheet pada tema yang Anda gunakan.

Pembuat Tema memungkinkan Anda membuat templat khusus untuk mengganti templat default untuk tema WordPress Anda.

Cara kerja pembuat halaman

Anda hanya membacanya. Pembuat Tema memungkinkan Anda membuat templat khusus untuk mengganti templat default tema Anda. Anda dapat membuat template kustom secara visual menggunakan editor pembuat halaman yang Anda gunakan.

Temukan juga: Elementor Pro: 10 Fitur Luar Biasa Untuk Dibuka - Bagian I

Salah satu manfaat menggunakan pembuat tema adalah Anda dapat menetapkan templat khusus tertentu ke halaman atau posting tertentu di situs web WordPress Anda melalui fitur kondisi tampilan. Misalnya, Anda dapat membuat templat posting unik ubahsuaikan dan tetapkan ke pos di bawah kategori tertentu sehingga templat hanya diterapkan ke pos dalam kategori yang Anda tetapkan untuk templat khusus.

Ini bagus karena Anda dapat membuat templat yang berbeda untuk berbagai jenis posting.

Kemampuan untuk mengatur kondisi tampilan juga memungkinkan Anda untuk memiliki beberapa template header / footer di satu situs web yang sangat bagus karena memberi Anda fleksibilitas untuk menjalankan kampanye yang berbeda pada halaman yang berbeda menggunakan header / footer yang berbeda.

Baca juga: Elementor Pro: 10 Fitur Luar Biasa untuk Dibuka - Bagian II

Fakta yang menyenangkan. Semua bagian dari situs web ini (header, footer, tata letak posting tunggal, halaman 404, halaman hasil pencarian, dll.) juga dibuat menggunakan tema pembangun (Elementor).

Untuk memberikan ilustrasi yang lebih jelas, mari kita lihat gambar berikut.

Gambar di atas adalah header default untuk tema WordPress yang disebut Agensi Lainnya. Dengan pembuat tema WordPress, Anda dapat mengganti header default di atas dengan membuat template header kustom. Berikut ini contohnya:

Gambar di atas adalah contoh template header khusus yang dibuat dengan Elementor. Selain desain khusus, Anda juga dapat menerapkan perilaku tajuk yang lebih menarik seperti efek lengket, penyembunyian saat menggulir, dll.

Plugin pembuat halaman dengan fungsionalitas pembuat tema

Kami menyebutkan bahwa pembuat tema adalah fitur dari plugin pembuat halaman. Namun, tidak semua plugin pembuat halaman dilengkapi dengan fitur pembuat tema. Berikut adalah 2 plugin pembuat halaman WordPress yang datang dengan fungsionalitas pembuat tema:

1. Elementor

Elementor adalah tolok ukur terkemuka untuk pembuat tema WordPress. Sejauh ini plugin pembuat halaman paling populer di WordPress dengan lebih dari 5 juta pengguna aktif menurut statistik WordPress.org. Elementor dirilis sebagai plugin freemium, tetapi Anda harus menggunakan versi pro untuk dapat menggunakan fitur pembuat temanya.

Pembuat Tema

Fitur Pembuat Tema Elementor memungkinkan Anda membuat templat khusus untuk bagian tema berikut:

Jika Anda menggunakan WooCommerce, Elementor juga memungkinkan Anda untuk buat halaman produk pribadi yang unik dan halaman lain di WooCommerce.

2. Divi Builder

Divi Builder adalah plugin pembuat halaman premium yang dikembangkan oleh Elegant Themes. Tidak ada pilihan untuk menggunakannya secara gratis. Elegant Themes sendiri adalah pengembang dari dua tema WordPress premium populer: Divi dan Extra. Meskipun demikian, Divi Builder dapat diinstal pada tema WordPress apa pun, tanpa terbatas pada tema Divi dan tema Ekstra.

Pembuat Tema

Jika Anda lebih suka menggunakan Divi Builder daripada tema Divi atau tema Ekstra, Anda tidak perlu menginstal plugin Divi Builder karena tersedia sebagai bagian integral dari tema-tema ini. Divi Builder juga dilengkapi dengan fitur pembuat tema yang memungkinkan Anda membuat templat khusus untuk bagian tema berikut:

  • Header
  • Footer
  • Templat posting tunggal
  • Templat halaman tunggal
  • Halaman arsip (kategori dan tag)
  • Halaman Penulis
  • halaman 404
  • Halaman hasil pencarian

Pada akhirnya

Anda harus mahir dalam PHP, CSS, JavaScript, dan HTML untuk membuat tema WordPress. Sekali lagi, itu cerita lama. Era pembuat halaman akan memungkinkan Anda membangun situs web WordPress yang sepenuhnya disesuaikan, apa pun tema yang Anda gunakan.

Beberapa plugin pembuat halaman - termasuk Elementor dan Divi Builder - hadir dengan pembuat tema yang memungkinkan Anda membuat templat khusus untuk mengganti templat default untuk tema aktif Anda.

Dapatkan Elementor Pro Sekarang!

Kesimpulan

Di Sini ! Itu saja untuk artikel ini yang menjelaskan semua yang perlu Anda ketahui tentang pembuat tema. Jika Anda memiliki kekhawatiran tentang cara menuju ke sana fberi tahu kami di komentar.

Namun, Anda juga bisa berkonsultasi sumber daya kita, jika Anda memerlukan lebih banyak elemen untuk melaksanakan proyek pembuatan situs Internet Anda, dengan membaca panduan kami di Pembuatan blog WordPress atau yang di Divi: tema WordPress terbaik sepanjang masa.

Namun sementara itu, bagikan artikel ini di berbagai jejaring sosial Anda.