Okay
  Public Ticket #3555846
Layout issues Booking Form 2.0 - Payment section
Closed

Comments

  •  11
    Christian started the conversation

    Hi there,

    On the payment section in the Booking form 2.0 there are a number of layouting bugs. Please check the attached picture.

    1. On the package description, there is no space left for the price to be shown comfortably, especially on longer product names. There needs to be some spacing between the name and the price

    2. It is not ok for the price to be split onto two lines, please make it so that the price, no matter how long, ALWAYS fits on a single line

    3. Because there is no GDPR field at the bottom to check before making the order that the customer read and understood the sites' policies, I was forced to add it in the label for online payments. But now the whole Stripe logo is smushed and looks just really bad.

    4. Please add either a separate place just above the continue button to add the GDPR text, prefferably with a mandatory checkbox

    5. Please allow to add links in that text!


    How many of these issues can be solved asap?


    Thanks,

    Christian

    Attached files:  Screenshot 2024-01-06 050121.png

  •  1,323
    Marko replied

    Hello there,

    Thank you for reaching out to us.

    Sorry for late reply we were away due to national holidays. 

    When you have multiple questions or issues please open a new ticket for each subject, and we will help/advise more effectively. 

    In that way, issues and questions which are related to different subjects will be in separate tickets so other users or our support agents can find them easily. 

    Our policy is to have one issue or question per ticket for the reasons described already.

    Thank you for understanding.

    1. On the package description, there is no space left for the price to be shown comfortably, especially on longer product names. There needs to be some spacing between the name and the price - Same answer as below

    2. It is not ok for the price to be split onto two lines, please make it so that the price, no matter how long, ALWAYS fits on a single line - This is not possible to achieve by default if your service names are to long but for first two questions perhaps applying custom CSS to expand the booking form can help.

    Our support does not fully provide customization solutions, but we can try to provide some basic CSS in situations like this.

    For manipulating the width of the "outer Booking container", you can try this CSS:

    .amelia-v2-booking #amelia-container.am-fs__wrapper {
        max-width: 1200px !important;
        width: 100%;
        height: 560px;
        margin: 99px auto;
        border-radius: 8px;
        box-shadow: 0 30px 40px #0000001f;
    }

    For example, on our Demo page, if i add that CSS, the outer container expands like this :

    3146601994.png

    Just the background colour we set is transparent, so it is not very visible on our page,

     but that width can be changed like that.

    -

    Now, if you also wish to manipulate this "inner Booking container width", you can use this CSS selector :

    .amelia-v2-booking #amelia-container .am-fs__main {
        
        max-width: 1200px;
        width: 100%;
    }

    If i add that to our Demo, here is the result :

    5856364923.png

    As you see, we have successfully changed the width this way.

    The main property to edit is "max-width" with a fixed pixel value.

    3. Because there is no GDPR field at the bottom to check before making the order that the customer read and understood the sites' policies, I was forced to add it in the label for online payments. But now the whole Stripe logo is smushed and looks just really bad. - This is the wrong approach for this but we can help. You can add terms and conditions via custom fields easily. 

    To add a link to Terms & Conditions, you can use "Checkbox" or "Radio" custom fields. In the custom field you need to add an anchor tag like this:

    <a href="https://wpamelia.com/terms-and-conditions/" target="_blank">Terms & Conditions</a>
    

    So this text appears as a hyperlink that opens a new tab (target="_blank") and takes the customers to your Terms & Conditions without them leaving the booking form. So the custom field on the back-end would look like this:

    6933203237.png

    As you can see, we made this radio button a mandatory field, so no one can book an appointment without checking the "I agree" button. 

    4. Please add either a separate place just above the continue button to add the GDPR text, prefferably with a mandatory checkbox - The suggestion above should help with this

    5. Please allow to add links in that text! - 

    In light of this, we encourage you to kindly consider submitting this valuable suggestion as a feature request through the following link: https://features.wpamelia.com/. The prioritization of feature development is greatly influenced by the number of customer requests received. By participating and expressing your support, you contribute significantly to the potential expedited implementation of this feature. 

    Should you have any further inquiries, we kindly request that you open separate tickets for each question and we will gladly help you there.

    Our policy is to have one issue or question per ticket.

    We wish you all the best and hope you have a wonderful day ahead. 

    Kind Regards, 

    Marko Davidovic
    [email protected]

    Rate my support

    wpDataTables: FAQ | Facebook | Twitter | InstagramFront-end and back-end demo | Docs

    Amelia: FAQ | Facebook | Twitter | InstagramAmelia demo sites | Docs | Discord Community

    You can try wpDataTables add-ons before purchasing on these sandbox sites:

    Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables