As I understand it, its not possible for an employee to have multiple services booked at the same time. 

And I understand you cannot remove an employee from a service. 

This results in quite a limitation in Amelia for certain scenarios and I am trying to find a work around. 

Our scenario is we are trying to have bookings for tables. The tables are available to book at 2:30pm, 2:35pm, 2:40pm etc all the way to 3pm. 

I dont want to create dummy employees I will have loads to manage due to the various different types of services we have. 

What works is setting the service duration to 5 minutes, and so people can book the slots then. 

BUT I dont want to show the end time on the booking, it shows 2:30pm to 2:35pm. In fact they can leave whenever they want, there is no end time to the service. 

So how can I hide the end time? The HTML code does not include any span with class for me to target it in the CSS. 

Thanks

I’m having the same issue. End time takes up to much space and customers don’t realize they can scroll to see the rest of my appointment times.

I am happy to use JQuery to change it, although I am getting strange results. This does not work for example, but it should do:

$('body').on('click', '.c-day', function()
{
    console.log('Yay');
});

This JQuery is working for me (thanks to Yong Wang https://stackoverflow.com/a/61511955) although I hate hacking code, I wish Amelia had hooks to tap into like most other plugins!

function waitForElm(selector){
     return new Promise(resolve => {
         if (document.querySelector(selector)) {
             return resolve(document.querySelector(selector));
         }

         const observer = new MutationObserver(mutations => {
             if (document.querySelector(selector)) {
                 resolve(document.querySelector(selector));
                 observer.disconnect();
             }
         });

         observer.observe(document.body, {
             childList: true,
             subtree: true
         });
     });
}
waitForElm('#am-service-booking .el-radio-button__inner').then(function()
{
    $('#am-service-booking .el-radio-button__inner').each(function()
    {
        var text = $(this).text();
        var text = text.split(' - ')[0]; 
        $(this).text(text)
    });
});

WOW, that seems to be working perfectly! :) 

Thank you so much!

hello, thanks for the replies. where should I add this script to?

Are you or do you have a developer for your site? Its best a developer adds it. 

Otherwise it may depend on your theme. For our sites we have a custom JS file included for our website themes, so I add it in there. 

Some themes may not support editing the files, it could be overwritten for example, so they may have a box in the theme settings to add Javascript code to the site, so you could try there.

It just needs to be added to the website code somehow, and it depends on your theme how. 

If you are not sure, there are probably plugins you can add to add Javascript code, such as https://wordpress.org/plugins/javascript-inserter/, but I have never used it, I cant vouch for its quality. There may be others with reviews. 

awesome, the script worked. now the only thing is it changed the time to 24hr time instead of 12hr. anyway of switching it back to 12hr?

My time format is set correctly. here are some screen shots. also is there anyway of making the time button smaller so more times can fit with out scrolling?

awesome, thank you so much that worked!