Cara Membuat Situs Web Janji Temu Dinamis dengan OceanWP & Crocoblock

Apakah Anda ingin membangun situs web pemesanan janji temu yang dinamis? Bagi mereka yang merasa sulit untuk menerapkannya, ada kabar baik – ternyata tidak. Saat ini, Anda tidak memerlukan pengembang, pembuat kode, dan desainer. Anda hanya perlu alat yang tepat.

Dalam artikel ini, Anda akan mengetahui apa yang membuat situs web janji temu bagus. Kami akan membawa Anda melalui seluruh rutinitas pembuatan situs dan membagikan alat yang telah kami gunakan. Pada akhirnya, Anda akan mengetahui cara membuat sistem pemesanan hanya dengan menggunakan OceanWP dan beberapa plugin Crocoblock.

Apa yang Membuat OceanWP & Crocoblock Hebat Bersama

• Pembuatan situs visual . Karena Gutenberg adalah editor blok visual, pengembang situs web dapat menghemat waktu untuk beralih antara panel admin dan front-end. Cukup dengan membuat struktur halaman di editor dan memastikan versi front-end terlihat sama.
• Lebih sedikit plugin eksternal . Lupakan plugin terpisah untuk jenis posting khusus, formulir, manajemen pemesanan, bidang khusus, dll. Untuk mengaktifkan dan menjalankan fungsi janji temu, Anda hanya memerlukan dua plugin Crocoblock.
• Tidak ada perantara . Artinya, pengembang tidak harus bergantung pada desainer. Anda dapat mengambil template demo oleh OceanWP, menata ulang tata letaknya sesuka Anda, dan menambahkan fungsionalitas dinamis Crocoblock ke dalamnya.

Situs Web Janji Temu 101

Apa itu situs web pemesanan janji temu?

Situs web janji temu adalah platform penyedia layanan yang memungkinkan untuk memesan slot waktu tertentu. Seringkali, situs web ini menawarkan layanan bayar per jam.

Seperti apa tampilan situs web janji temu?

Mereka dapat berupa situs web kartu nama satu halaman, di mana dimungkinkan untuk memesan layanan tertentu dari satu penyedia. Di sisi lain, situs web janji temu dapat menampung banyak penyedia. Dalam hal ini, situs web telah mendedikasikan satu halaman dan katalog Penyedia dan Layanan.

Apakah sulit untuk membuat situs web janji temu?

Tidak lagi. Saat ini, Anda dapat membangun situs web dinamis dari awal menggunakan alat yang tepat – pembuat halaman yang Anda sukai, penyedia tema, beberapa plugin konten dinamis, dan inti pemesanan janji temu.

Apa elemen situs web janji temu utama?

Ini akan menjadi tema, jenis posting kustom, mesin pemesanan janji temu, formulir pemesanan, halaman Penyedia, halaman Layanan, halaman katalog, dan daftar.

Bisakah saya menambahkan beberapa penyedia ke situs web yang sama?

Kenapa tidak? Beberapa profesional dapat memberikan satu layanan. Pastikan untuk menetapkan penyedia layanan untuk menghindari kebingungan pada tahap pengisian formulir pemesanan.

Situs Web Janji Temu: Persiapan Dasar

Kami memutuskan untuk menghilangkan persiapan tahap awal seperti mendapatkan nama domain dan memilih penyedia hosting. Sebaliknya, kita akan fokus pada esensi. Bagi mereka yang ingin menggali lebih dalam, ada video super informatif oleh Ferdy Korpershoek.

Dapatkan plugin Crocoblock

Crocoblock memperkenalkan harga terbarunya enam bulan lalu. Apa yang membuatnya keren? Ini adalah paket langganan Kustom . Sekarang, untuk membuat situs web janji temu yang bisa diterapkan, Anda tidak perlu menghabiskan banyak uang. Buka halaman harga Crocoblock, buka tab JetPlugins , dan tambahkan plugin yang diperlukan ke keranjang.

Anda membutuhkan JetEngine – plugin konten dinamis yang memungkinkan pembuatan Jenis Posting Kustom – dan JetAppointment – plugin WordPress pemesanan layanan.

Paket khusus semacam itu akan dikenakan biaya $45/tahun untuk satu situs web dan $93/tahun untuk situs web tak terbatas. Plus, Anda akan mendapatkan pembaruan plugin dan dukungan kualitas selama satu tahun penuh. Unggah plugin ini ke dasbor WordPress dan siapkan untuk pekerjaan lebih lanjut.

Instal tema OceanWP dan pilih templat situs web

Ada dua cara untuk menginstal tema inti – yang tradisional dan cara Crocoblock.

Memasang tema OceanWP dengan cara tradisional

Buka Appearance > Themes di panel admin WordPress dan tekan “ Add New .” Anda dapat menggunakan bilah pencarian untuk menemukan tema. Setelah ditemukan, instal OceanWP dan aktifkan.

Memasang tema OceanWP dengan cara Crocoblock

Gunakan Wizard Instalasi Crocoblock. Itu dapat diunduh dari akun Crocoblock dan kemudian digunakan untuk menginstal OceanWP.

Untuk memilih template demo, buka Panel Tema > Instal Demo dan pilih yang Anda butuhkan. Kami akan menggunakan template demo Gym hari ini. Ingatlah bahwa demo tidak dapat berfungsi sebagaimana mestinya jika beberapa ekstensi premium tidak ada. Anda mungkin ingin mendapatkannya terlebih dahulu.

Segera setelah instalasi template demo selesai, Anda siap untuk membangun situs web janji temu yang dinamis.

Membangun Situs Web Janji Temu Khusus

Di dalam setiap situs web janji temu dan penjadwalan acara, ada jenis posting khusus untuk Penyedia dan Layanan , inti pemesanan janji temu otomatis, integrasi kalender, dan formulir pemesanan. Ini adalah elemen penting, tetapi Anda bebas untuk memperpanjang daftar sesuka Anda.

Sekarang, mari gunakan plugin JetEngine dan JetAppointment dengan baik.

Pembuatan Jenis Posting Kustom

Mengapa Anda perlu membuat CPT? Mereka akan membantu Anda mengatur posting situs web – layanan ke layanan, penyedia ke penyedia. Setelah itu, posting-posting ini dapat dengan mudah saling terkait untuk memungkinkan pengguna situs web memesan layanan tertentu dari mereka yang menyediakannya.

Ikuti JetEngine > Post Types > Add New Pathway di panel admin WordPress untuk membuat CPT. Ingatlah bahwa Anda memerlukan dua jenis posting – satu untuk Penyedia dan satu untuk Layanan. Karena kami sedang membangun situs web Gym, jenis posting akan diberi nama Pelatih dan Latihan yang sesuai.

Tambahkan bidang meta yang diperlukan ke kedua jenis posting. Untuk CPT Pelatih , ini bisa berupa:

• foto;
• biografi singkat;
• pengalaman kerja;
• prestasi;
• galeri;
• kontak.

Untuk CPT Latihan , bidang meta dapat berupa sebagai berikut:

• galeri;
• keterangan;
• kapasitas maksimum;
• peralatan;
• Keuntungan sehat.

Tip cepat : JetEngine memiliki fitur Glosarium yang berguna. Ini memungkinkan Anda untuk membuat satu set bidang meta dan menggunakannya sebagai opsi untuk Jenis Posting Kustom.

Selanjutnya, tambahkan sebanyak mungkin postingan ke Jenis Postingan yang baru dibuat seperlunya. Untuk melakukannya, arahkan mouse ke nama CPT di panel admin WordPress dan kemudian tekan “ Add New .”

Setelah selesai, Anda dapat melanjutkan untuk mengonfigurasi plugin JetAppointment.

Pengaturan JetAppointment

Tidak sulit untuk mengatur plugin pemesanan janji temu oleh Crocoblock. Yang harus Anda lakukan adalah menjalankan Setup Wizard dan menyelesaikan empat langkah instalasi.

Buka Janji Temu > Siapkan di panel admin. Anda akan dibawa ke halaman Pengaturan JetPlugins , yaitu ke tab Pengaturan JetAppointment. Klik tombol dengan nama yang sama untuk menjalankan Wizard.

• Langkah 1 . Anda harus memilih jenis posting Layanan dan Penyedia di pilihan drop-down yang sesuai. Jangan lupa untuk mengaktifkan tombol Tambah penyedia ; jika tidak, bidang tidak akan muncul. Klik “ Selanjutnya .”

• Langkah 2 . Di sini, Anda dapat melihat kolom tabel database yang diperlukan. Lanjutkan penginstalan jika Anda tidak ingin menambahkan kolom lagi. Kami akan menambahkan Telepon dan Komentar.

• Langkah 3 . Langkah ini didedikasikan untuk mengonfigurasi layanan dan detail khusus penyedia seperti durasi, waktu buffer, hari libur, jam kerja, dll. Untuk ikhtisar langkah mendetail, silakan lihat tutorial video ini.

• Langkah 4 . Terakhir, Anda dapat mengintegrasikan WooCommerce dan membuat dua formulir pemesanan janji temu. Opsi yang tersedia termasuk “JetEngine Forms” dan “JetFormBuilder.” Yang pertama ditujukan untuk Elementor, dan yang kedua untuk Gutenberg.

Tekan tombol "Selesai" untuk menyelesaikan pengaturan.

Sebelum Anda mengedit formulir pemesanan janji temu, Anda harus menghubungkan pos Penyedia dan Layanan. Buka pos Penyedia dan temukan tab Layanan Terkait di bilah sisi kiri. Ketik tiga karakter ke dalam area teks itu dan pilih layanan yang diperlukan setelah sistem menyarankannya.

Ulangi prosedur ini sebanyak ada posting Penyedia khusus. Setelah selesai, Anda siap untuk bermain-main dengan formulir.

JetFormBuilder dan penambahan formulir ke halaman

Keunggulan produk Crocoblock adalah beberapa di antaranya benar-benar gratis. Ambil JetFormBuilder. Ini adalah plugin pembuatan formulir WordPress yang memungkinkan pengembang situs membuat formulir dinamis di editor halaman Gutenberg. Anda dapat mengunduh plugin, mengaktifkannya, dan langsung menggunakannya.

Buka JetFormBuilder > Formulir . Dua bentuk yang dihasilkan akan ada di sana. Kita harus mengeditnya karena kita menambahkan dua kolom ke tabel DB selama pengaturan janji temu. Sekarang, kita perlu menambahkan bidang meta yang diperlukan ke formulir dan tindakan pasca-pengiriman.

Klik untuk mengedit Formulir Pemesanan Halaman Statis dan menambahkan bidang meta yang hilang dengan drag-n-drop blok Gutenberg yang sesuai. Kita membutuhkan dua – Bidang Teks dan Bidang Textarea – untuk menambahkan bidang Telepon dan Komentar.

Selanjutnya, Anda perlu memasukkan bidang-bidang ini ke dalam Tindakan Kirim Kiriman. Untuk melakukannya, tekan tab JetForm , gulir ke bawah ke bagian Post Submit Actions , dan klik ikon pensil di bawah nama action. Anda akan melihat jendela pengeditan Post Submit Action, di mana Anda seharusnya memilih bidang formulir di mana mereka berada.

Selain itu, Anda dapat mengatur integrasi WooCommerce di sini, asalkan Anda telah mengaktifkannya pada Langkah 4. Setelah selesai, klik tombol “ Perbarui ”.

Tip cepat . Jangan ragu untuk menambahkan beberapa Tindakan Kirim Kiriman sekaligus tetapi pastikan kondisinya tidak bertentangan satu sama lain. Dalam hal ini, pengiriman formulir akan gagal.

Setelah Anda selesai menyesuaikan Formulir Pemesanan Halaman Statis, perbarui dan tambahkan ke halaman situs web. Kami telah membuat halaman Semua Latihan khusus, yang menampilkan Daftar JetEngine dinamis. Formulir pemesanan akan terlihat cantik di bawah kisi-kisi.

Buka halaman tempat Anda ingin meletakkan formulir, temukan blok JetForm di bilah sisi kiri, seret dan jatuhkan ke area yang diinginkan, lalu pilih formulir yang baru saja Anda edit di drop-down Pilih Formulir di bilah sisi kanan .

Perbarui halaman dan lihat tampilannya di bagian depan.

Sekarang, pembaca yang paling penuh perhatian seperti, "Kenapa bentuknya ditata?". Itu karena kami telah memasukkan plugin lain ke dalam campuran. Teruslah membaca untuk mencari tahu yang mana.

Kembali ke dasbor WordPress dan buka jalur Janji Temu > Janji Temu . Itu dia – semua janji sedang menunggu. Anda dapat melihat, mengedit, menghapus, memfilter, dan mengubah statusnya di sini.

Seperti yang Anda lihat, fungsi pemesanan janji temu aktif dan berjalan. Namun, ada lebih banyak hal yang dapat Anda lakukan untuk membuat situs web penjadwalan janji temu menjadi lebih dinamis.