Various questions about layout / translation

Hello,

I’ll be happy to assist you.

1. The ‘Read more’ text cannot be changed, but it can be translated if you are using a language other than English. More information on translation can be found here: https://webba-booking.com/documentation/translations-wording/
2. Unfortunately, in the current version there is no option to change the layout. Probably, you can do that by customizing CSS.
3. —
4. —
5. —
6. For points 3-6 – could you please share explanation screenshots to us? It appears a bit difficult for understanding without visual explanation.
7. Please, explain this point.
8. When integrating CF7 you can omit those fields. Just make sure to disable the option Phone field is mandatory on the SETTINGS – User interface – Advanced settings.

1. Could this be added as a feature request ? Looks like an easy improvement as most of the labels / texts can already be modified. I could trick it by editing PO files but would be much better if available through UI
2. Same, if it can be addded as feature request, would be really nice !
3. I’d like to be able to remove the input marked as “1” on screenshot
4. Look at the time slot on left and right of the number “2” on screenshot, they are vertically misaligned because left one has a name . Being able to vertically align from top rather than center would solve this layout / appearance issue
5. Would like to see the “15 min” duration where the number “3” is, so it’s easy to remind this service has a 15 minutes duration without having to set the “start – end” time on *each* slot
6. This one is harder to see on screenshot. I’d like to be able to have a “read more” (or popup, whatever) with some extra description for ex on the “20:00” slot to give some extra details for this specific slot
7. Let’s say I select 10 slots on 3 different services then I click “next”, which sends me to the “details” tab, asking me for email / name. At this point, I can’t see which slots I choosed, the summary is only displayed *after* the submission so I can’t check / it’s too late.
8. Perfect, will give it a try, thanks !

• This reply was modified 4 months, 2 weeks ago by sp4rky35.

1. Of course. I just added it in our dev. plan.
2. Please, submit a new feature request here: https://webba-booking.com/feature-requests/. If it get some votes, we will include it in the dev. plan.
3. In this case todays date is selected by default, correct?
4. Got it. We will try to fix it.
5. Makes sense. We will consider adding it.
6. Guess it’s a bit specific case. Please, clarify – does it means there needs to be an interface also to set up the description?
7. What do you think if this information will be shown in the left sidebar? For example selected time slots will be shown under each service.

Many thanks for suggestions and engagement.

1. Thanks
2. I’ll do ! In meantime I achieved to do it with some CSS (way too many nth-child thing to be reliable, but works for now)

/* service name */
li.wbk_service_item > label:nth-child(1) > span:nth-child(2) > span:nth-child(1) {
flex: 0 0 auto;
margin-right: 5px;
font-weight: bold;
}

/* clock */
li.wbk_service_item > label:nth-child(1) > span:nth-child(2) > img {
flex: 0 0 4%;
margin-right: 5px;
}

/* duration */
li.wbk_service_item > label:nth-child(1) > span:nth-child(2) > span:nth-child(4) {
flex: 1 0 50%;
}

3. Yes ! Same, easily done with

.styled-as-select-w  {
  display: none !important;
}

4. Thanks ! Fixed it with :

.appontment-time-list-w.group-list-w .radio-time-block-w {
	vertical-align: top !important;
}

btw it seems there is a typo in you classes (shouldn’t it be appoIntment ?)

5. Thank you !

6. Yes. But I understand it’s really specific to my usecase, so will find some workaround

7. That would be awesome, and even more readable than the existing list on top of all the slots !

Thank you for sharing CSS code!

As for the point 6 – will that help if we add a PHP hook for each time slot so that text can be customized be adding custom filters in the functions.php of your theme?

yes, that would be more than enough for my need I think !

Ok, great. As soon as we will have some update ton the points I’ll let you know here.

Thank you very much !

9. Another small layout request (that’s why I put it here), active and disabled slots do not have the same layout, active have :

           <input class="timeslot_radio-w" type="radio" name="day-1731625200_1731699900_1">
            <span class="radio-time-block-w radio-time-block-w timeslot-animation-w">
                <span class="radio-time-inner-w">
                    <span class="radio-checkmark"></span>
                    <span class="time-w time-long-w">
                        20:45                    </span>
                </span><!-- /.radio-time-inner-w -->
                <span class="available-w">
                  [...]
        

while disabled have

            <input class="timeslot_radio-w" type="radio" name="time-1" disabled="">
            <span class="radio-time-block-w timeslot-animation-w">
                <span class="radio-checkmark"></span>
                <span class="time-w time-long-w">
                    19:30
                </span>
                <span class="available-w1">
                  [...]
        

I’ve removed extra data attributes for clarity, but basically, active slots have an extra radio-time-inner-w span which includes radio-checkmark and time-w, while disabled put everything on same depth, it makes things complicated when you want to customize slots without, apparently, any reason.

Hi,

We have implemented a few points from your list, and these changes will be included in the next version. If you are interested in receiving a pre-release version, please feel free to contact us at [email protected].

Sorry, had no time to check (holiday time) ?? Just checked, I only see the “read more” customization (which works fine, thanks !)

Hi,

A filter for the service name was also added above the time slots. Please find an example of its usage below:

add_filter( 'wbk_service_name_before_timeslots', custom_wbk_service_name_before_timeslots');
function custom_wbk_service_name_before_timeslots($input){
     return $input . ' 30 minutes';
}

Since you’ve resolved some issues by adding custom CSS code, could you please provide an updated list of those issues? This way, we can consider incorporating them into the next version. Thanks.

Oh, didn’t notice it / see it in changelog. It works well, thank you !

I think the main remaining issues are the 6 & 7 :

6. could be fixed with some filter to customize time slot (need to have the service as well in filter parameters)

7. having summary in left bar instead of top of the right section sounds good on large screen, but does not help much in mobile (and most of our/the traffic is mobile). Having a summary *before* asking for extra info (with a previous/next button) would be perfect.

Thanks !

Thank you for clarifying.

For 6 you can try the filter wbk_template_file:

$file_name = apply_filters(
            'wbk_template_file',
            $file_name,
            $template,
            $data
        );

This allows you to replace the default template with a custom one while retaining all the data associated with the rendered time slot. If you have any questions regarding usage, feel free to ask.

For 7: in the current version selected time slots are shown in the sidebar

I assume you need to display the service names in the ‘Date and Time’ section, correct?

Thanks for 6, will give it a try !

For 7, I just noticed it appears only at the 3rd step, not during 2nd. It’s better but not visible on mobile, so a dedicated summary step seems better. I did not understand in our previous messages that the summary on left side would be on 3rd step, I thought it would replace the list on top of the right side during 2nd step.