Skip to main content

FluentBooking

#General

Need a simpler front end

My client is a one person small barber shop who wants her clients to be able to book online. It's confusing to have the location and timezone rendering on the front end, because the location and timezone are always the same: her physical shop. Is there an easy way to remove those fields from displaying on the front end booking listings and calendar?

I have Fluent Booking Pro and I'm using the block editor 'fluent booking calendar' block, set to 'all events' and 'hide calendar info'

Need a simpler front end Need a simpler front end
  • 4 comments

Verity Cantare

Forgot to add this image too.

Thomas Oates

This custom CSS should hide most of those, if not all.

.fcal_cal_wrap .fcal_author {
    display: none;
}

.fcal_cal_wrap .slot_location {
    display: none;
}

.fcal_cal_wrap .fcal_timezone_select {
    display: none;
}

.fcal_cal_wrap .calendar-container .calendar {
    margin-bottom: 105px;
}

.fcal_cal_wrap .slot_timezone {
    display: none;
}

Verity Cantare

Thomas Oates that's very kind, thank you!

Verity Cantare

Thomas Oates I hadn't thought of using css to hide the elements. After some trial and error I came up with this which is working perfectly!

/* Hide location */
.fcal_slot_location,
.fcal_slot_location * {
    display: none !important;
}

.slot_location,
.slot_location * {
    display: none !important;
}

.fcal_loc_icon,
.location_icon,
.fcal_loc_text {
    display: none !important;
}

/* Hide host/author */

.fcal_author,
.fcal_author *,
.fcal_author_avatar,
.fcal_author_name {
    display: none !important;
}


/*Hide timezone*/

.fcal_timezone_select,
.fcal_timezone_select *,
.fcal_timezone_selector,
.fcal_timezone_selector * {
    display: none !important;
}

.slot_timezone,
.slot_timezone *,
.slot_time_range.slot_timezone {
    display: none !important;
}