Okay
  Public Ticket #2875692
Calender booking and add to chart in single product page
Closed

Comments

  •  2
    Yvette started the conversation

    Hi,

    Thanks for your great product, and excellent documentation and videos. With your help, I have now managed to create my first WooCommerce product page with a calender for booking appointments. 

    On this page there is also an Add to Chart Button. With Astra themes I can turn hide the Add to Chart for all pages, but not for only Amelia product pages. 

    The result is that if customers click Add to Chart (no. ¨Kjøp¨) they are directed away from the page even though they have not booked the appointment.

    Any idea about how to solve this? 

  • [deleted] replied

    Hi Yvette

    Thank you for reaching out to us and for your kind wordssmile.png

    There's a way to do this through the database (it's explained in the second part of my response), but you can manage appointments and products with or without a cart using this plugin: https://wordpress.org/plugins/woo-direct-checkout-button/

    If you want to change this behavior in the database, and skip the cart, please go to wp_options table, and search for "amelia_settings" in "option_name" column:

    6360232811.png

    That will return only one row, so you need to edit it:

    7483114469.png

    In "option_value" column, you need to search for "wc", and in it find "page":"cart". Just change that to "page":"checkout" and that's it.

    9451134887.png

    After that, successful bookings will go straight to checkout instead of cart page.

  •  2
    Yvette replied

    Hi,

    Thank you for your kind and helpful reply. I only need to have this solution on som pages. Do you have any advice for how to solve this?

    FYI: Is using WooCommerce and not all my products are bookable and will have Amelia. Therefore I also need to have the chart solution for these product pages


  • [deleted] replied

    Hi, Yvette,

    Thank you for choosing Amelia and for your kind words.

    Amelia works independently from other WooCommerce products, and basically, WooCommerce plays the role of a payment getaway in Amelia, therefore the "add to cart" option is not that important since it's not possible to use it fully (for example, to add multiple bookings to the page). Bookings are being directed to the cart automatically, and we can just skip this step by following the instructions that my colleague Blazenka had shared. It should not affect other Woo products, only the way Amelia functions.

    Best Regards. 

  •  2
    Yvette replied

    Hi,

    Noted, with thanks.


    Kind regards,

    Yvette Boye

     

  •  2
    Yvette replied

    Hi,

    Has now executed the change in the database and all work well. Customers who fill the appointments are automatically directed to the checkout page. When next revision of Amelia, WooCommerce, or WordPresscomes comes will the change disappear?

    Could you kindly advice how the WooCommerce button chart on the product page can be hidden on only the pages I have Amelia?

    Now customers can clink on both the Add to Chart and Amelia calender (see attachment). 

    Have a great weekend!

    Kind regards,

    Yvette Boye

  • [deleted] replied

    Yvette,

    1. I'm glad to hear the solution worked for yousmile.png 

    No, since this change was made in the database, it should not be affected by an update.

    2. I believe that the only way to hide the button is to do it with custom CSS. Could you please try to add this CSS to the booking page:

    button.single_add_to_cart_button.button.alt {display: none;}

    If you need help with adding custom CSS to the page, please take a look at this article.

    Looking forward to hearing from you. 


  •  2
    Yvette replied

    Hi,

    Thank you so much for your quick feedback.

    Tried the code and it works perfectly. Used Code Snippets and added it to my other excellent codes I have been getting from Amelia lately (see attachment ¨Code working everywhere¨). Now all the Amelia /WooCommerce product pages can use only Amelia for purchasing.The add to chart is not showing anymore.

    Which leaves product page without Amelia booking without any way to purchase. There is not Add to Chart anymore. Seems the new code works for all pages. 

    For example, see attachment Product without Amelia missing Add to Chart from:

    https://www.kursiseo.no/produkt/kurs-i-seo/

    Is there a way to get the Amelia code to only work for those Amelia product pages?


    FYI: See ticket #2881836


    Kind regards,

    Yvette Boye


  • [deleted] replied

    Yvette,

    Sorry for the misunderstanding, I thought that you wanted to remove the button from all pages.

    Please try this CSS instead:

    #product-2967 > div.summary.entry-summary > form > button {display: none;}

    It should be added to this page only: https://www.kursiseo.no/produkt/seo-coaching/

    If it works, please provide me with the other links to the pages where you installed Amelia. I will have to look for suitable CSS selectors, so the buttons will be hidden only on these particular pages.

    Looking forward to hearing from you. 

  •  2
    Yvette replied

    Hi Liza,

    Thank you for your kind email. Used your code with the plugin Code Snippets and it worked perfectly.

    Really appreciated that you offered to help with the remaining pages even though I know your team is under pressure because of covid. 

    Was looking at the code and understood the number was for the page. Thought then that I could copy the line for the 4 other pages and just change the page number. Changed the page number and it worked like a charm. The Add to Cart disappeared on pages. Now potential customers will only see the Amelia calender and not also the Add to Chart. 

    The code used ended up looking like the following:

    add_action( 'wp_head', function () { ?>

    <style>

    #product-2967 > div.summary.entry-summary > form > button {display: none;}
    #product-3035 > div.summary.entry-summary > form > button {display: none;}
    #product-3037 > div.summary.entry-summary > form > button {display: none;}
    #product-3038 > div.summary.entry-summary > form > button {display: none;}
    #product-3039 > div.summary.entry-summary > form > button {display: none;}

    </style>
    <?php } );

    I am very happy that this is solved.


    Thank you so much for your help.

    Hope you will get the rest of the weekend off.

    Kind regards,

    Yvette Boye



  • [deleted] replied

    Yvette,

    I first responded to this ticket, and only after seeing your comment under the other ticket, I realized that you have dynamic pages.

    I'm really sorry for this confusion.

    And thank you for sharing your solution, that's very kind of you!smile.png

    Best Regards. 

  •  2
    Yvette replied

    Hi Liza,

    Noted with thanks/YB