Eerst krijgen we een Crocoblock-abonnement. Daarna installeren we JetEngine, JetAppointment, JetElements en JetPopup.
Dan zullen we 2 aangepaste berichttypes maken. Diensten en kappers. Maar het kan van alles zijn. Huizen, advertenties, appartementen, leraren. We zullen de diensten met de kappers verbinden zodat we kunnen beslissen welke kapper welke service aanbiedt. Dus bijvoorbeeld: Kapper Roy kan wel kapsels en baard trimmen, maar geen snor trimmen.
We passen het boekingsformulier aan zodat het er beter uitziet en makkelijker in te vullen is. We zullen het stylen zodat het past bij het ontwerp van de website. Vervolgens zullen we JetPopup gebruiken om het formulier in een pop-up te plaatsen. We zullen het in Elementor activeren met een knopelement.
Dan beslissen wij wat er moet gebeuren als er een nieuwe boeking wordt ingediend. We sturen een melding naar WordPress, een e-mail naar de bedrijfseigenaar, een bevestigingsmail naar de boeker en we leiden de boeker door naar een bedankpagina.
Voorbeeld website: https://jetappointment.cbexample.com
Crocoblock: https://ferdykorp.com/cb
Overzicht met tijdstempels:
00:00 Intro
00:14 Het eindresultaat
04:04 Wat we in deze zelfstudie zullen behandelen
08:26 Koop Crocoblock
13:38 Installeer JetEngine
14:11 Activeer de licentie
14:35 Installeer meer JetPlugins
16:30 Aangepaste berichttypen maken
21:21 Diensten en kappers toevoegen
24:36 Jet-afspraak instellen
26:05 Configureer de openingstijden
29:37 Single versus algemeen boekingsformulier
30:34 JetAfspraak Instellingen
32:50 Voeg aanbevolen afbeeldingen toe aan kappers
35:14 Straalmotorformulieren
35:37 Voeg het formulier toe in Elementor
38:36 Koppel de kappers aan de diensten
40:52 Vul het formulier in
43:06 Pas het boekingsformulier aan
46:12 Prijzen toevoegen aan de diensten
47:55 Toon de totale prijs in het formulier
50:18 Splits het formulier in 4 delen
52:30:50 Maak een pop-up
58:30 Kopieer de stijl van de pop-up
59:53 Pas de kleuren aan
01:06:40 Voeg een triggerknop toe voor de pop-up
01:10:35 Pas de vormstijl aan in Elementor
01:18:44 Laat de boeker vooraf betalen met WooCommerce
01:24:00 Inleiding tot aanbiedingen
01:29:43 Verbind de vermelding met het formulier
01:33:00 Maak een tweede aanbieding
01:37:40 Wijzig het pop-upgebied
01:38:22 Een terugknop toevoegen
01:42:25 Maak een e-mailsjabloon voor de winkeleigenaar
01:48:45 Maak een bevestigingsmailsjabloon voor de boeker
01:51:10 Maak een bedankpagina
01:55:00 Maak het formulier persoonlijker door een naam toe te voegen
01:59:10 Bedankt