Formularul de rezervare pentru site
Pentru a începe să utilizați formularul de rezervare pe site-ul dvs., trebuie să aflați numărul tehnic special al companiei dvs. (token). Pentru aceasta trebuie să accesați Profilul companiei, fila Companie, și să găsiți câmpul Token API. Pentru a copia token-ul, trebuie să faceți clic pe el și se va copia. După obținerea numărului, trebuie să inserați doar câteva rânduri în codul site-ului dvs.
Acest cod trebuie inserat între tag-urile <head>
<link href="https://rentprog-b5205.web.app/css/app.css" rel="stylesheet"/>
Acest cod trebuie inserat înainte de tag-ul de închidere </body>
<script src="https://rentprog-b5205.web.app/js/app.js"></script>
Acesta este codul nemijlocit al cererii, trebuie inserat între tag-urile <body> în locul dorit
<rentprog-widget
token="token"
locale="ro"
show_all_cars='true'
hidden_car_year='false'
places='[{"place":"Birou","price":0},{"place":"Portbagaj pe acoperiș","price":300},{"place":"Aeroport","price":800}]'
equipment='[{"item":"Portbagaj pe acoperiș","price":400, "daily": true},{"item":"Înregistrator video","price":600, "daily": false},{"item":"Navigator","price":500, "daily": false},{"item":"Bare transversale","price":1000, "daily": false}]'
chairs='{"price":900, "daily": false}'
boosters='{"price":600, "daily": false}'
middlename_required="false"
agreement='{"text": ", și acceptați ", "link_text": "condițiile de închiriere", "link": "https://rentprog.ru/ro/agreement"}'
button_classes="text-4xl lg:text-lg h-14 lg:h-10 bg-blue-500 flex justify-center items-center w-full text-white px-4 py-3 mt-2 rounded-md focus:outline-none"
icon_classes="h-14 w-14 bg-yellow-200 rounded-full flex flex-shrink-0 justify-center items-center text-yellow-500 text-2xl font-mono"
form_container="py-8 text-base leading-6 space-y-4 text-gray-700 sm:text-lg lg:text-base"
container_classes="relative px-2 py-4 lg:px-10 lg:py-10 bg-white lg:mx-8 mx-0 shadow"
title_container_classes="block pl-2 font-semibold text-xl self-start text-gray-700"
title_classes="lg:leading-relaxed sm:text-4xl text-xl"
show_email="false"
show_phone="false"
show_middlename="false"
show_birthday="false"
show_passport="false"
show_driver_license="false"
rental_object="Selectați barca"
>
</rentprog-widget>
token - trebuie să inserați token-ul dvs. API. Îl puteți găsi în profilul companiei, fila Companie. Trebuie să faceți clic pe el și token-ul va fi copiat în clipboard.
locale - limba formularului, trebuie să inserați ru - pentru rusă, en - pentru engleză, de - pentru germană , fr - pentru franceză, pt - pentru portugheză, es - pentru spaniolă, hi - pentru hindi, sr - pentru sârbă, tr - pentru turcă, th - pentru thai, it - pentru italiană, id - pentru indoneziană, pl - pentru poloneză, ro - pentru română.
show_all_cars - afișați toate autovehiculele; în mod implicit sunt afișate numai cele libere pentru datele specificate, ținând cont de intervalul dintre rezervări stabilit în setări.
car_id - dacă acest parametru este prezent, formularul va funcționa numai pentru un singur autovehicul/obiect de închiriere specific. În acest parametru trebuie să inserați ID-ul autovehiculului din sistemul RentProg. Îl puteți găsi în lista tuturor obiectelor sau accesând fișa auto și verificând parametrii linkului din bara de adrese a browserului.
car_name - se utilizează împreună cu parametrul car_id. În acest parametru trebuie să specificați denumirea autovehiculului/obiectului de închiriere.
show_email - afișați sau nu câmpul pentru introducerea e-mail-ului. Dacă este setat la "true", câmpul va fi afișat; dacă este setat la "false", câmpul va fi ascuns.
show_phone - afișați sau nu câmpul pentru introducerea telefonului. Dacă este setat la "true", câmpul va fi afișat; dacă este setat la "false", câmpul va fi ascuns.
show_middlename - afișați sau nu câmpul pentru introducerea patronimicului. Dacă este setat la "true", câmpul va fi afișat; dacă este setat la "false", câmpul va fi ascuns.
show_birthday - afișați sau nu câmpul pentru introducerea datei de naștere. Dacă este setat la "true", câmpul va fi afișat; dacă este setat la "false", câmpul va fi ascuns.
show_passport - afișați sau nu câmpul pentru introducerea datelor pașaportului. Dacă este setat la "true", câmpul va fi afișat; dacă este setat la "false", câmpul va fi ascuns.
show_address - afișați sau nu câmpul pentru introducerea adresei. Dacă este setat la "true", câmpul va fi afișat; dacă este setat la "false", câmpul va fi ascuns.
show_driver_license - afișați sau nu câmpul pentru introducerea datelor permisului de conducere. Dacă este setat la "true", câmpul va fi afișat; dacă este setat la "false", câmpul va fi ascuns.
rental_object - parametru care înlocuiește textul "Selectați autovehiculul" cu valoarea introdusă, de exemplu "Selectați barca".
hidden_car_year - ascundeți anul fabricației autovehiculului; dacă este setat la "true", anul va fi ascuns; dacă este setat la "false" sau parametrul lipsește, anul va fi afișat.
passport_required - câmpurile datelor pașaportului; dacă este setat la "true", câmpurile devin obligatorii.
driver_license_required - câmpurile datelor permisului de conducere; dacă este setat la "true", câmpurile devin obligatorii; dacă este setat la "false", sunt opționale.
birthday_required - câmpul datei de naștere; dacă este setat la "true", câmpul devine obligatoriu; dacă este setat la "false", este opțional.
email_required - câmpul Email; dacă este setat la "true", câmpul devine obligatoriu; dacă este setat la "false", este opțional.
phone_required - câmpul pentru introducerea telefonului; dacă este setat la "true", câmpul devine obligatoriu; dacă este setat la "false", este opțional.
middlename_required - câmpul pentru introducerea patronimicului; dacă este setat la "true", câmpul devine obligatoriu; dacă este setat la "false", este opțional.
places - acestea sunt locurile de predare și preluare cu indicarea prețurilor pentru livrare/preluare. Dacă nu aveți nevoie de aceste câmpuri, ștergeți acest parametru.
equipment - lista echipamentelor suplimentare; daily - plată zilnică sau pentru întreaga perioadă de închiriere; price - prețul. Dacă nu aveți nevoie de acest câmp, pur și simplu ștergeți parametrul.
chairs - scaune pentru copii; daily - plată zilnică sau pentru întreaga perioadă de închiriere; price - prețul. Dacă nu aveți nevoie de aceste câmpuri, ștergeți parametrul.
boosters - înălțătoare pentru copii (scăunele fără spătar); setările sunt aceleași. Dacă nu aveți nevoie de aceste câmpuri, ștergeți parametrul.
agreement - primul rând este fix, deoarece colectăm date personale; dacă doriți să adăugați un link la condițiile dvs., trebuie să completați acest parametru.
Dacă parametrii chairs, boosters, equipment, agreement nu sunt necesari, pur și simplu ștergeți-i din cod.
Design vizual
Pentru design se utilizează biblioteca Tailwind v2. Mai multe detalii despre aceasta aici. Pentru accelerarea încărcării formularului nu sunt utilizate toate clasele, ci numai cele deja utilizate în formular, precum și toate clasele de culoare de fundal și text (bg-... și text-...). Dacă aveți nevoie de o clasă suplimentară specifică, vă rugăm să scrieți în suport și o vom adăuga. Dacă doriți să efectuați modificări, utilizați variabilele de mai jos. Cel mai bine este să lăsați clasele implicite care gestionează marginile etc. și să modificați numai clasele responsabile de culoarea fundalului și textului. Dar modificarea marginilor etc. este de asemenea posibilă, însă poate afecta afișarea pe diferite dispozitive, vă rugăm să fiți atenți. Valorile implicite le puteți vedea în exemplul de mai sus, precum și în formularul generat pe site-ul dvs. Utilizarea variabilelor de mai jos este opțională; dacă nu le completați, vor fi luate valorile implicite.
button_classes - clase CSS care controlează afișarea vizuală a butoanelor.
icon_classes - clase CSS care controlează afișarea vizuală a iconitei din stânga.
container_classes - clase CSS care controlează afișarea vizuală a containerului.
form_container - clase CSS care controlează afișarea vizuală a containerului formularului.
title_container_classes - clase CSS care controlează afișarea vizuală a containerului titlului.
title_classes - clase CSS care controlează afișarea vizuală a titlului.
Exemplu de instalare a formularului pe constructorul Tilda în acest video.
Urmărirea conversiilor
Pentru urmărirea conversiilor și optimizarea campaniilor publicitare în Yandex Direct, în formular sunt integrate evenimente javascript care se activează la căutare și trimiterea cererii. Pentru funcționare este necesară prezența contorului Yandex Metrica și a obiectivelor configurate.
yandex_metrika_id - acest parametru este responsabil pentru legarea contorului Yandex Metrica și a evenimentelor integrate. În el trebuie să inserați numărul contorului. De asemenea, pentru activare trebuie să creați două obiective pe evenimente javascript.
Pentru activare trebuie să creați două obiective în Yandex Metrica pe evenimente javascript, unde identificatorul obiectivului corespunde cu search_cars și al doilea unde identificatorul obiectivului corespunde cu send_booking.
