Form for website with API integrations
[MODULE: xpressoil_booking_form_v1]
Type: Popup window
Purpose: Booking form on the website https://xpressoil.pro
General description:
It is necessary to implement a responsive 4-step service booking form. The form should open as a modal window with a semi-transparent, slightly blurred background (glassmorphism), not covering the entire site. The visual style must strictly match the site https://xpressoil.pro. After submission, all data are transmitted to Telegram and Excel. CRM and SAP integrations are planned at the processing stage after form submission.
Example: https://quick-oilbook.preview.emergentagent.com/
Example 2: Elite Auto Care
🔹 Step 1 — Type of replacement, package selection, and additional services:
- Switch:
• Private replacement
• Commercial replacement
- Choose one of 3 packages:
• Basic
• Standard
• Premium
- Under each package — a brief description of included services
- Additional services block — checkboxes (without price indication):
• Tire rotation
• Brakes
• Rotors
• Battery
• Light bulb
• Air filter – engine
• Air filter – cabin
• Windshield wipers
🔹 Step 2 — Vehicle information:
- VIN (optional)
- Make
- Model
- Year of manufacture (dropdown from 1990 to current)
- Engine type
- Additional field (comment, optional)
- Text at the bottom of the block:
“We use oil and consumables according to your vehicle’s specifications.”
- ⚠️ Integration with API Motor.com and SAP is performed **after form submission**, technical information (oil types, filters, fluids) is fetched **in the background** for internal processing. The client does not see this data.
🔹 Step 3 — Contact information:
- Name (required)
- Surname
- Phone (required, with US format mask and validation)
- Email (optional, with format validation)
- Dropdown: Contact method (Call / Text / Email)
🔹 Step 4 — Address and date:
- Address input with autocomplete via Google Maps API
- Automatic city and ZIP code filling
- Date selection via calendar
- Time selection (intervals of 1 hour from 08:00 to 20:00)
- Integration with Google Calendar API to display only available slots
- Switch: “Call before arrival” (optional)
Data submission:
- After filling out, a message appears: “Thank you! Your request has been received.”
- Data are sent:
• To Telegram via Webhook or N8N
• To Google Sheets / Excel according to the specified structure
• ⚠️ To the server for background processing using Motor.com https://www.motor.com/developer-hub/ (integration after submit, invisible to the client)
- Data includes: request type, package, additional options, vehicle, date/time, address, client contact
Validation:
- Phone: digits only, required, US format
- Email: format validation
- Required fields: name, phone, address, request type, package
Visual style:
- Strictly according to the site https://xpressoil.pro
- White form, rounded corners, light blurred background
- Colors: dark blue, green, white
- All elements are responsive for mobile and desktop
Comment:
The client enters only basic data. All technical information is retrieved after submission and used for internal purposes.
Applications 5
-
5 days89 USD
277 1 0 5 days89 USD
https://xpressoil.pro according to your technical specifications.
Planning to do:
A modal window with a glassmorphism background that does not cover the entire site;
All 4 steps with the necessary fields and validation (replacement type, packages, auto-information, contacts, address, date and time);
Integrations for sending data to Telegram, Google Sheets/Excel;
Connecting Google Maps API for address auto-completion and Google Calendar API for selecting available time;
Ensuring proper validation and responsiveness.
I will start working immediately.
-
10 days223 USD
1486 4 0 10 days223 USD
Good afternoon.
Currently open to collaboration, I have more than 10 years of experience in development
-
30 days223 USD
692 21 0 30 days223 USD
Hello. I can place an order. I have experience. Write to us, and we will agree.
-
7 days267 USD
94346 1269 1 10 7 days267 USD
Hello. I have extensive experience in website development. Ready to cooperate
-
12 days223 USD
510 2 0 1 12 days223 USD
Good day!
I have reviewed your technical task regarding the implementation of a 4-step booking form for the XpressOil website — the task is clear, structured, and entirely feasible for quality implementation.
I have experience developing custom forms with multi-level logic, integrations with APIs (Google Maps, Telegram, Google Sheets, calendars), as well as working with responsive layouts and modal windows in the style of glassmorphism. I am well-versed in frontend development (React / Tailwind / Next.js), and confidently work with backend integrations via Webhook/N8N.
What I can guarantee:
- Implementation of a full step-by-step form with adaptation for mobile devices
… - Connection of Google Maps Autocomplete + dynamic calendar (with available slots)
- Sending data to Telegram, Google Sheets, or Excel according to the specified structure
- Background integration with Motor.com API (or a placeholder for it)
- Precise validation, UX details, and a consistent design in line with the website style
- Clean code, with the possibility of further support or expansion
I can start immediately after agreeing on the technical details (API keys, Google account for Calendar/Sheets). The deadline is up to 12 working days turnkey. Payment is fixed.
Best regards,
Nazar Slidenko
-
5 days178 USD
2245 22 0 5 days178 USD
Good day, Andriy. I will prepare the booking form on the website in the best way. I will do everything strictly according to the design and implement a convenient and intuitive interaction with the form. I can create a small instruction so that if needed, you can set it up yourself.
I am always available. I will do everything quickly and with quality.
Current freelance projects in the category Python
Creation of a multifunctional bot in Telegram
22 USD
(I will provide all materials in private messages) Here is a detailed project description: After pressing the button /start The bot sends a text with rules and terms of use (under the text, the button ‘acknowledged’) After pressing the button, the next message is… Python, Bot Development ∙ 2 days 19 hours back ∙ 94 proposals |
Find a product feed (Google Merchant XML) for a website on OpenCart
16 USD
It is necessary to find a direct link to the active product feed (XML) of a competitor for Google Merchant Center Platform (CMS): OpenCart / ocStore Find the original feedRequirements for the result: Working link to the XML file Python, Data Parsing ∙ 5 days 9 hours back ∙ 28 proposals |
Development of a TikTok farm (content factory)It is necessary to develop a system for centralized management of multiple TikTok accounts with automatic content publishing, using individual proxies and simulating natural account activity. Functional Requirements1. Account Management Adding and removing TikTok accounts.… Python, Bot Development ∙ 5 days 20 hours back ∙ 21 proposals |
Improve the performance of Claude Code and work on software development.I am currently developing CRM and Analytics software. I am using Claude Code, but I understand that the results are not the best in terms of changes. There are 2 tasks - Need help creating a preset for skills, MD, and so on to improve quality. Take verified ones that have been… AI & Machine Learning, Python ∙ 6 days 3 hours back ∙ 26 proposals |
OCR systemA system for recognizing text on postal envelopes (index for whom - only numbers). The text can sometimes be handwritten. Recognition of stamps (counting quantity and denomination) Python ∙ 6 days 6 hours back ∙ 28 proposals |
Kyiv