For my website https://www.pakket-direct.nl I would like to be able to directly show my clients the price for my Dutch courier service (package delivery’s).
I have already made a design for this, see images. These images are in English, but need to become Dutch (I have the text ready). Can you help me to build this system?
It has to work like this:
1. On the homepage & the extra page (see attachments), there have to become 2 fields that have to load addresses from Google when client starts typing (see homepage image for example), and then calculate the DISTANCE between these 2 locations selected that have been suggested by Google as the client started typing.
2. When clicked on ”calculate”, the customer has to enter the price-page_START.jpg page, where the data (addresses, zip code, city and country) is already filled in, together with the price.
Prices shown = distance (km’s + the input of 1 other field, called PACKAGE SIZE). This PACKAGE SIZE field has to initially be filled in as ”small van” and can be changed. When this is changed, the price has to change accordingly. Pricing formula’s are already ready, and quite simple.
3. As step 1, the customer has to select a ”delivery speed”. The pages then have to change to the page-examples attached, while all other fields remain filled in.
4. When all data is selected by the client, he/she has to be able to request an offer as seen in Step 3. In this step 3, all filled in data (including price) has to be send to an email address. I already have Gravity Forms working (see https://www.pakket-direct.nl/prijs-berekenen) for the fields, so I think this plugin would be useful to use for this quotation email?
5. When the offer is requested by clicking ” RECEIVE ORDER”, it has to show the confirmation page.
Important things to know:
– Some fields in Gravity Forms (https://www.paket-direct.nl/prijs-berekenen) are mandatory. However, if the client doesn’t fill in the company name in the addresses fields on top, this must not be a problem and the process must continue.
– It has to work responsive and look good on tablet & mobile. That means, e.g., the fields on the homepage have to show above each other on mobile.
– When hovering over the different pricing options, colour has to slightly change to give mouse-over effect (become slightly darker: #a8164c)
– The homepage is currently using slider revolution. As this is not really necessary for current content, you can also change this for static content. Good responsive function remains important.
I hope this offers the required information you need. Please let me know if you have any questions!