Britixo CRMBritixo CRM Enterprise Help Centre
Appointments & Scheduling · How-to guide

Change the embedded booking form width and layout

Adjust the iframe-friendly public form container so it fits the website column without altering appointment logic.

Audience: Staff who manage appointmentsFeature: Embed layoutModule v1.3.6
Feature pathAppointments > Booking Form > Embed code
Before you beginThis guide follows the supplied Britixo Appointments & Scheduling module version 1.3.6. The relevant access is Appointments: View. A menu, button, provider, time slot or client action can remain hidden when the signed-in user lacks the required permission, the module setting is disabled, the related record is in an ineligible state, or availability validation rejects the request.

What this feature does

Adjust the iframe-friendly public form container so it fits the website column without altering appointment logic. It uses Britixo's permission-aware appointment, availability, status and integration flow rather than an unconnected diary entry.

How the module flow works

The public view accepts a supported width parameter and maps it to its Bootstrap-style container presentation.

The parameter changes layout only; service, provider, availability and submission rules remain server-controlled.

The parent website must still allocate enough iframe width and height.

Step-by-step workflow

  1. Identify the available width in the parent website.
  2. Open the booking form embed URL with the supported width parameter.
  3. Adjust the iframe's responsive CSS.
  4. Test common desktop, tablet and mobile sizes.
  5. Confirm all fields, date controls and validation remain usable.

Important fields and decisions

Form widthContainer behaviour inside the booking page.
iframe widthParent-page CSS controlling the embedded frame.
iframe heightSpace required to avoid clipped content.
Responsive testVerification across device widths.

What happens after completion

After this workflow completes, Britixo keeps the appointment and its supported relationships connected. Reopen the appointment and verify the saved status, date, timezone, customer or lead, service, provider, attendees, reminder state, calendar or meeting reference, invoice reference and history that apply to this feature. External email, SMS, Google, Microsoft or payment outcomes must be checked separately from the Britixo database save.

  • Open the saved appointment and confirm the final status and source.
  • Check the participant, provider, timing and timezone from the full detail page.
  • Review the relevant table filter, calendar, history, report or linked invoice instead of relying only on a success message.

Controls, checks and common mistakes

  • Do not use a narrow fixed width on mobile.
  • Ensure the submit button and reCAPTCHA remain visible.
  • Layout changes must not hide terms or validation messages.
  • Use the least destructive correction and retain the appointment history when the booking existed operationally.
  • Never bypass a permission, availability, approval, client-access or verification control by changing an unrelated route or setting.
Scheduling and data safetyAppointment changes can notify customers, reserve provider time, update remote calendars, create meeting links or invoices and alter reports. Confirm the exact record, timezone, status and recipients before saving.
Browse connected topics:booking formcustomersschedulinginvoicepaymentcheckreportapprovalappointmentserviceprovideravailabilityremindersfeedback
Embed the appointment booking form on a website →Customise the booking form heading and description →Enable booking terms and conditions →Public booking form overview →Choose services shown on the public booking form →Allow guest appointment booking →Enable the client-area booking link →Show provider email or phone on the public form →