Booking service templates

Templates for E-mail and PDF Document

These templates are designed to handle all types of bookings. Everything is already coded and ready to use. You just need to perform the following steps to use them:

Click "Copy template" to copy the contents of the template.
Go to "Workflow" or "PDF Document" in the main menu. Click the "Code View" button while editing the content. Paste the copied content.
Click on "Code View" again.
Now you have the option to edit and customize the content further, if desired.
Save.

User guide: Click here.

Booking information

Suitable for all statuses. Approved, Cancelled, Rejected, Time change, and more. Shows the status of the booking at the top.

Copy HTML Code 1

<body style="margin:0;padding:0;background:#ffffff;font-family:'Inter',Arial,sans-serif;">
  <table width="100%" bgcolor="#ffffff" cellpadding="0" cellspacing="0">
    <tr>
      <td align="center" style="padding:15px 4px 26px 4px;">
        <table width="100%" style="max-width:520px;background:#fff;border-radius:18px;overflow:hidden;">
          
          <tr>
            <td style="padding:22px 8px 24px 8px;text-align:center;">
              <img decoding="async" src="{company_image_url}" width="120" alt="Logo"
                   style="background:#ffffff;display:block;margin:0 auto;width:120px;max-width:100%;height:auto;" />
              <div style="font-size:23px;font-weight:800;color:#26263c;letter-spacing:-.5px;line-height:1.25;margin-top:20px;">
                {company_name}
              </div>
              <div style="font-size:14px;color:#7a8199;margin:8px 0 8px 0;">
                <span style="font-size:16px;">📅</span> Order ID <b>#{appointment_id}</b>
              </div>
   <span style="background:#ecf4fe; color:#23263b; font-weight:700; border-radius:8px; padding:4px 16px 3px 16px; font-size:15px; display:inline-block; margin-top:3px; letter-spacing:0.6px;">
  {appointment_status}
</span>

<tr>
  <td style="padding:0 8px 24px 8px;">
    <div style="background:#f6f8fb;border-radius:13px;padding:30px 20px;">
      <div style="font-size:18px;font-weight:800;color:#23263b;margin:0 0 12px 0;">Customer</div>
      
      <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">Name</div>
      <div style="font-size:14px;color:#23263b;">{customer_first_name} {customer_last_name}</div>
      
      <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">Email</div>
      <div style="font-size:14px;color:#23263b;">
        <a href="mailto:{customer_email}" style="color:#23263b; text-decoration:underline;">{customer_email}</a>
      </div>
      
      <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">Telephone</div>
      <div style="font-size:14px;color:#23263b;">{customer_phone}</div>
    </div>
  </td>
</tr>

<tr>
  <td style="padding:0 8px 24px 8px;">
    <div style="background:#f6f8fb;border-radius:13px;padding:30px 20px;">
      <div style="font-size:18px;font-weight:800;color:#23263b;margin:0 0 12px 0;">Total price</div>
      <div style="font-size:17px;color:#1f2937;font-weight:900;">{appointments_total_price}</div>
      <div style="font-size:13px;color:#4b5563;font-weight:600;margin-top:10px;">{appointment_paid_price} has been paid</div>
    </div>
  </td>
</tr>

<tr>
            <td style="padding:0 8px 24px 8px;">
              <div style="background:#fff;border-radius:12px;border:1px solid #eaeaef;padding:30px 20px;">
                <div style="font-size:18px;font-weight:800;color:#23263b;margin:0 0 12px 0;">Service</div>
                <img decoding="async" src="{service_image_url}" width="120" alt="Service"
                     style="display:block;margin:0 0 11px 0;width:120px;max-width:100%;height:auto;" />
                <div style="font-size:14px;font-weight:700;color:#23263b;letter-spacing:-.1px;">{service_category_name} / {service_name}</div>
                <div style="color:#23263b;font-size:14px;margin-top:3px;">{service_notes}</div>
                
                <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">Additional services</div>
                <div style="color:#23263b;font-size:14px;margin-top:3px;">{appointment_extras_list}</div>
                
                <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">Number of people</div>
                <div style="color:#23263b;font-size:14px;margin-top:3px;">{appointment_total_attendees}</div>

<div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">Products ({appointment_products_quantity})</div>
                <div style="color:#23263b;font-size:14px;margin-top:3px;">{appointment_products_list}</div>

</div>
            </td>
          </tr>

<tr>
  <td style="padding:0 8px 24px 8px;">
    <div style="background:#fff; border-radius:12px; border:1px solid #eaeaef; padding:30px 20px; color:#23263b; font-family: Arial, sans-serif;">
      
      <div style="font-size:18px; font-weight:800; margin:0 0 12px 0;">Option</div>
      
      <img decoding="async" src="{staff_profile_image_url}" width="120" alt="Option"
           style="display:block; margin:0 0 11px 0; width:120px; max-width:100%; height:auto;" />
      
      <div style="font-size:14px; font-weight:700;">{staff_name}</div>
      
      <div style="font-size:14px; margin-top:3px;">{staff_about}</div>
      
      <div style="font-weight:700; font-size:14px; margin-top:12px;">Email</div>
      
      <div style="font-size:14px; margin-top:3px;">{staff_email}</div>
      
      <div style="font-weight:700; font-size:14px; margin-top:12px;">Telephone</div>
      
      <div style="font-size:14px; margin-top:3px;">{staff_phone}</div>
    </div>
  </td>
</tr>

<tr>
            <td style="padding:0 8px 24px 8px;">
              <div style="background:#fff;border-radius:12px;border:1px solid #eaeaef;padding:30px 20px;">
                <div style="font-size:18px;font-weight:800;color:#23263b;margin:0 0 12px 0;">Location</div>
                <img decoding="async" src="{location_image_url}" width="120" alt="Location"
                     style="display:block;margin:0 0 11px 0;width:120px;max-width:100%;height:auto;" />
                
                <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">{location_name}</div>
                <div style="color:#23263b;font-size:14px;margin-top:3px;">{location_notes}</div>
                
                <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">Address</div>
                <div style="color:#23263b;font-size:14px;margin-top:3px;">{location_address}</div>
                
                <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">Telephone</div>
                <div style="color:#23263b;font-size:14px;margin-top:3px;">{location_phone_number}</div>
              </div>
            </td>
          </tr>

<tr>
  <td style="padding:0 8px 24px 8px;">
    <div style="background:#fff;border-radius:12px;border:1px solid #eaeaef;padding:30px 20px;">
      <div style="font-size:18px;font-weight:800;color:#23263b;margin:0 0 12px 0;">Point</div>
      
      <span style="display:inline-block; width:120px; height:120px; text-align:left; line-height:120px; font-size:100px; margin-bottom:10px;">🗓️</span>
      
      <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">Start</div>
      <div style="color:#23263b;font-size:14px;margin-top:3px;">{recurring_appointments_date_time}</div>
      
      <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">End</div>
      <div style="color:#23263b;font-size:14px;margin-top:3px;">{appointment_end_date_time}</div>
      
      <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">Duration</div>
      <div style="color:#23263b;font-size:14px;margin-top:3px;">{appointment_duration}</div>
      
      <div style="font-weight:700;color:#7a8199;font-size:12px;margin-top:12px;">Booking received</div>
      <div style="color:#7a8199;font-size:12px;margin-top:3px;">{appointment_created_date} at {appointment_created_time}</div>
    </div>
  </td>
</tr>

<tr>
            <td style="padding:0 8px 24px 8px;">
              <div style="background:#f6f8fb;border-radius:10px;padding:30px 20px;">
                <div style="font-size:18px;font-weight:800;color:#23263b;margin:0 0 12px 0;">Discounts and gift cards</div>
                <div style="font-size:14px;color:#23263b;margin-bottom:5px;">Gift card: <b>{giftcard_code}</b></div>
                <div style="font-size:14px;color:#23263b;margin-bottom:5px;">Discount code: <b>{coupon_code}</b></div>
                <div style="font-size:14px;color:#23263b;margin-bottom:5px;">Discount: <b>{appointment_discount_price}</b></div>
                <div style="font-size:14px;color:#23263b;margin-bottom:5px;">Additional discounts: <b>{appointment_conditional_prices_discounts}</b></div>
                <div style="font-size:14px;color:#23263b;">Price surcharge: <b>{appointment_conditional_prices_additions}</b></div>
              </div>
            </td>
          </tr>

<tr>
  <td style="padding:0 8px 24px 8px;">
    <div style="background:#f6f8fb;border-radius:10px;padding:30px 20px;">
      <div style="font-size:18px;font-weight:800;color:#23263b;margin:0 0 12px 0;">Total per booking</div>
      <div style="font-size:14px;color:#23263b;margin-bottom:5px;">Service: <b style="color:#23263b;">{appointment_service_price}</b></div>
      <div style="font-size:14px;color:#23263b;margin-bottom:5px;">Additional services: <b style="color:#23263b;">{appointment_extras_price}</b></div>
      <div style="font-size:14px;color:#23263b;margin-bottom:5px;">Products: <b style="color:#23263b;">{appointment_products_price}</b></div>
      <div style="font-size:14px;color:#23263b;margin-bottom:5px;">VAT: <b style="color:#23263b;">{appointment_tax_amount}</b></div>
      <div style="font-size:14px;color:#23263b;font-weight:800;">Total: {appointment_sum_price}</div>
    </div>
  </td>
</tr>

<tr>
  <td style="padding:0 8px 24px 8px;">
    <div style="background:#f6f8fb;border-radius:10px;padding:30px 20px;">
      <div style="font-size:18px;font-weight:800;color:#23263b;margin:0 0 12px 0;">Payment</div>
      <div style="font-size:14px;color:#23263b;margin-bottom:5px;">Paid so far: <b>{appointment_paid_price}</b></div>
      <div style="font-size:14px;color:#23263b;margin-bottom:5px;">Payment method: <b>{appointment_payment_method}</b></div>
      <div style="font-size:14px;color:#23263b;margin-bottom:5px;">VAT: <b>{recurring_appointments_tax_amount}</b></div>
      <div style="font-size:14px;color:#23263b;font-weight:800;">Total: {appointments_total_price}</div>
    </div>
  </td>
</tr>

<tr>
  <td align="center" style="padding:0 8px 24px 8px;">
    <table cellspacing="0" cellpadding="0" border="0" style="max-width:350px; width:100%;">
      <tr>
        <td align="center" bgcolor="#635bff" style="border-radius:10px;">
          <a href="https://bookingtjeneste.no/en/customer-panel/" 
             target="_blank"
             style="display:inline-block; padding:18px 0; font-weight:800; font-size:17px; font-family: 'Inter', Arial, sans-serif; color:#ffffff; text-decoration:none; width:100%; border-radius:10px; letter-spacing:0.5px;">
            Go to customer panel
          </a>
        </td>
      </tr>
    </table>
  </td>
</tr>

<tr>
  <td style="padding:0 8px 22px 8px;">
    <div style="background:#fff;border-radius:9px;border:1px solid #eaeaef;padding:20px;color:#23263b;font-size:14px;line-height:1.7;">
      <div style="font-weight:700;color:#23263b;margin-bottom:6px;font-size:18px;">Do you have any questions?</div>
      <div>
        Send us an email.<br />
        Contact us: <a href="mailto:{staff_email}" style="color:#23263b;text-decoration:underline;font-weight:600;">{staff_email}</a>
      </div>
    </div>
  </td>
</tr>

<tr>
            <td style="padding:5px 20px;font-size:13px;color:#555555;text-align:center;line-height:1.7;">
              <div>
                <span style="font-size:15px;"></span> {company_name} •
                <a href="/en/{company_website}/" style="color:#555555;text-decoration:underline;">{company_website}</a><br />
                <span style="color:#555555;">{company_address}</span> •
                <a href="mailto:{staff_email}" style="color:#555555;text-decoration:underline;">Customer service</a><br />
                <a href="https://bookingtjeneste.no/en/terms-and-conditions-customer/" style="color:#555555;text-decoration:underline;">Terms</a> ·
                <a href="https://bookingtjeneste.no/en/cookie-statement-eu/" style="color:#555555;text-decoration:underline;">Cookies</a> ·
                <a href="https://bookingtjeneste.no/en/privacy-policy/" style="color:#555555;text-decoration:underline;">Privacy</a>
              </div>
            </td>
          </tr>

</table>
      </td>
    </tr>
  </table>
</body>

Confirmation and payment link

Confirm and payment link in the email. You can remove the payment methods you don't need.

Copy HTML Code 5

<tr>
  <td style="padding:0 8px 22px 8px;">
    <div style="background:#fff; border-radius:9px; border:1px solid #eaeaef; padding:20px; color:#23263b; font-size:14px; line-height:1.7; text-align:center;">
      <div style="font-weight:700; color:#23263b; margin-bottom:12px; font-size:18px;">Choose payment method</div>

</div>
  </td>
</tr>

</div>
            </td>
          </tr>

</table>
      </td>
    </tr>
  </table>
</body>

Receipt (PDF document)

Send attached PDF receipt.

Copy HTML Code 3

Kvittering

<table width="100%" cellpadding="0" cellspacing="0" border="0" align="center">
  <tbody><tr><td height="30"></td></tr>
  <tr>
    <td width="50%" valign="middle" style="text-align:left;">
      <img decoding="async" src="{company_image_url}" width="90" alt="Logo" style="display:block;">
    </td>
    <td width="50%" valign="middle" style="text-align:left; font-weight:bold; font-size:14px; color:#2800ee; padding-left:20px;"><br></td>
  </tr>
  <tr><td height="30" colspan="2"></td></tr>
</tbody></table>

<table width="100%" cellpadding="5" cellspacing="0" border="0" style="font-size:11px;">
  <tbody><tr>
    <td width="50%" style="text-align:left;">
      <strong>Order number:</strong> {appointment_id}<br>
      <strong>Order received:</strong> {appointment_created_date}, at {appointment_created_time}
    </td>
    <td width="50%" style="text-align:left; font-weight:bold; color:#2800ee;">
      Status: {appointment_status}
    </td>
  </tr>
</tbody></table>

<table width="100%" cellpadding="0" cellspacing="0" border="0">
  <tbody><tr><td style="border-top:1px solid #e9e9e9;"> </td></tr>
</tbody></table>

<table width="100%" cellpadding="5" cellspacing="0" border="0" style="font-size:11px;">
  <tbody><tr>
    <td width="50%" style="vertical-align:top; text-align:left;">
      <u><strong>Seller</strong></u><br>
      <strong>Company</strong>: {company_name}<br>
      <strong>Address</strong>: {company_address}<br>
      <strong>Telephone</strong>: {company_phone}
    </td>
    <td width="50%" style="vertical-align:top; text-align:left; padding-left:20px;">
      <u><strong>Buyer</strong></u><br>
      <strong>First name</strong>: {customer_first_name}<br>
      <strong>Surname</strong>: {customer_last_name}<br>
      <strong>Telephone</strong>: {customer_phone}<br>
      <strong>Email</strong>: {customer_email}<br>
      <strong>Date of birth</strong>: {customer_birthday}
    </td>
  </tr>
</tbody></table>

<table width="100%" cellpadding="0" cellspacing="0" border="0">
  <tbody><tr><td style="border-top:1px solid #e9e9e9;"> </td></tr>
</tbody></table>

<table width="100%" cellpadding="5" cellspacing="0" border="0" style="font-size:11px;">
  <tbody><tr>
    <td width="50%" style="vertical-align:top; text-align:left;">
      <u><strong>Service</strong></u><br>
      <strong>Category</strong>: {service_category_name}<br>
      <strong>Service</strong>: {service_name}<br>
      <strong>Description</strong>: {service_notes}<br>
      <strong>Additional services</strong>: {appointment_extras_list}<br>
      <strong>Number of people:</strong> {appointment_total_attendees}<br>
      <strong>Products ({appointment_products_quantity})</strong>: {appointment_products_list}<br>

</td>
    <td width="50%" style="vertical-align:top; text-align:left; padding-left:20px;">
      <u><strong>Option</strong></u><br>
      <strong>Name</strong>: {staff_name}<br>
      <strong>Note</strong>: {staff_about}<br>
      <strong>Email</strong>: {staff_email}<br>
      <strong>Telephone</strong>: {staff_phone}
    </td>
  </tr>
</tbody></table>

<table width="100%" cellpadding="0" cellspacing="0" border="0">
  <tbody><tr><td style="border-top:1px solid #e9e9e9;"> </td></tr>
</tbody></table>

<table width="100%" cellpadding="5" cellspacing="0" border="0" style="font-size:11px;">
  <tbody><tr>
    <td width="50%" style="vertical-align:top; text-align:left;">
      <u><strong>Time</strong></u><br>
      <strong>Starting:</strong> {recurring_appointments_date_time}<br>
      <strong>Ends:</strong> {appointment_end_date_time}<br>
      <strong>Duration:</strong> {appointment_duration}<br>
      <small>NB: Multiple bookings with different start times also mean different end times.</small>
    </td>
    <td width="50%" style="vertical-align:top; text-align:left; padding-left:20px;">
      <u><strong>Location</strong></u><br>
      <strong>Place:</strong> {location_name}<br>
      <strong>Address:</strong> {location_address}<br>
      <strong>Telephone:</strong> {location_phone_number}<br>
      <strong>Note:</strong> {location_notes}
    </td>
  </tr>
</tbody></table>

<table width="100%" cellpadding="0" cellspacing="0" border="0">
  <tbody><tr><td style="border-top:1px solid #e9e9e9;"> </td></tr>
</tbody></table>

<table width="100%" cellpadding="5" cellspacing="0" border="0" style="font-size:11px;">
  <tbody><tr>
    <td width="50%" style="vertical-align:top; text-align:left;">
      <u><strong>Discount and gift cards</strong></u><br>
      <strong>Gift card:</strong> {giftcard_code}<br>
      <strong>Discount code:</strong> {coupon_code} / {appointment_discount_price}<br>
      <strong>Additional discounts:</strong> {appointment_conditional_prices_discounts}<br>
      <strong>Price surcharge:</strong> {appointment_conditional_prices_additions}
    </td>
    <td width="50%" style="vertical-align:top; text-align:left; padding-left:20px;">
      <u><strong>Payment</strong></u><br>
      <strong>Paid:</strong> {appointment_paid_price}<br>
      <strong>Payment:</strong> {appointment_payment_method}<br>
      <u><strong>Total per booking</strong></u><br>
      <strong>Service:</strong> {appointment_service_price}<br>
      <strong>Additional services:</strong> {appointment_extras_price}<br>
      <strong>Products:</strong> {appointment_products_price}<br>
      <strong>VAT:</strong> {appointment_tax_amount}<br>
      <strong>Total:</strong> {appointment_sum_price}<br>
      <strong>VAT:</strong> {recurring_appointments_tax_amount}<br>
      <strong>Total:</strong> {appointments_total_price}
    </td>
  </tr>
</tbody></table>

<table width="100%" cellpadding="0" cellspacing="0" border="0" style="font-size:11px; color:#666; text-align:left;">
  <tbody><tr>
    <td>
      Do you have any questions?<br>
      Contact us: <a href="mailto:{staff_email}" style="color:#0066cc; text-decoration:none;">{staff_email}</a>
    </td>
  </tr>
</tbody></table>

Customer panel

Send customer panel link to new customer.

Copy HTML Code 2

<tr>
            <td style="padding:0 8px 22px 8px;">
              <div style="background:#fff; border-radius:9px; border:1px solid #eaeaef; padding:20px; color:#23263b; font-size:14px; line-height:1.7; text-align:left; font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;">

<div style="font-weight:700; color:#23263b; margin-bottom:12px; font-size:18px;">
                  Customer panel at {company_name}
                </div>

<p style="margin:0 0 15px 0;">
                  Hello <strong>{customer_first_name}</strong>You have registered a booking with <strong>{company_name}</strong>We have now created a user for you so that you can get an overview of your bookings via your customer panel.
                </p>

<div style="font-weight:700; color:#23263b; font-size:14px; margin-top:12px;">
                  Your user
                </div>
                <div style="font-size:14px; color:#23263b;">
                  Email: {customer_email}
                </div>
                <div style="font-size:14px; color:#23263b; margin-bottom:12px;">
                  Password: {customer_password}
                </div>
                <p style="margin:0 0 20px 0;">
                  You can change your password in the customer panel if desired.
                </p>

</table>
      </td>
    </tr>
  </table>
</body>

Rating

"Rate us" email.

Copy HTML Code 2

</td>
          </tr>

<div style="font-weight:700; color:#23263b; margin-bottom:12px; font-size:18px;">
        Rating of {company_name}
      </div>

<p style="margin:0 0 15px 0;">
        Hello <strong>{customer_first_name}</strong>.
      </p>
      <p style="margin:0 0 20px 0;">
        We hope you are well. We would really appreciate it if you could take a moment to share your thoughts on your recent booking. <strong>{service_category_name}</strong>, <strong>{service_name}</strong> at <strong>{company_name}</strong> it <strong>{appointment_date_time}</strong>Your feedback is invaluable to us and helps us improve our services to ensure we always deliver the best experience for our customers.
      </p>
      <p style="margin:0 0 20px 0;">
        Thank you very much for choosing us. We look forward to hearing your thoughts.
      </p>

<tr>
  <td align="center" style="padding:0 8px 24px 8px;">
    <table cellspacing="0" cellpadding="0" border="0" style="max-width:350px; width:100%;">
      <tr>
        <td align="center" bgcolor="#635bff" style="border-radius:10px;">
          <a href="/en/{rating_form_url}/" 
             target="_blank"
             style="display:inline-block; padding:18px 0; font-weight:800; font-size:17px; font-family: 'Inter', Arial, sans-serif; color:#ffffff; text-decoration:none; width:100%; border-radius:10px; letter-spacing:0.5px;">
            Give rating
          </a>
        </td>
      </tr>
    </table>
  </td>
</tr>

</table>
      </td>
    </tr>
  </table>
</body>

Rating received

Rating received email.

Copy HTML Code 6

<body style="margin:0;padding:0;background:#ffffff;font-family:'Inter',Arial,sans-serif;">
  <table width="100%" bgcolor="#ffffff" cellpadding="0" cellspacing="0">
    <tr>
      <td align="center" style="padding:15px 4px 26px 4px;">
        <table width="100%" style="max-width:520px;background:#fff;border-radius:18px;overflow:hidden;">
          
          <tr>
            <td style="padding:22px 8px 24px 8px;text-align:center;">
              <img decoding="async" src="{company_image_url}" width="120" alt="Logo"
                   style="background:#ffffff;display:block;margin:0 auto;width:120px;max-width:100%;height:auto;" />
              <div style="font-size:23px;font-weight:800;color:#26263c;letter-spacing:-.5px;line-height:1.25;margin-top:20px;">
                {company_name}
              </div>
              <div style="font-size:14px;color:#7a8199;margin:8px 0 8px 0;">
                <span style="font-size:16px;">📅</span> Order ID <b>#{appointment_id}</b>
              </div>
  <span style="background:#ecf4fe; color:#007bff; font-weight:700; border-radius:8px; padding:4px 16px 3px 16px; font-size:15px; display:inline-block; margin-top:3px; letter-spacing:0.6px;">
  {appointment_status}
</span>

</td>
          </tr>

<div style="font-weight:700; color:#23263b; margin-bottom:6px; font-size:18px;">
        Rating received
      </div>

<div style="margin-bottom:12px;">
        A customer review has been received regarding this booking.
      </div>

<div style="font-weight:700; color:#23263b; margin-top:12px;">
        Star
      </div>
      <div>
        {rating_star}
      </div>

<div style="font-weight:700; color:#23263b; margin-top:12px;">
        Comment
      </div>
      <div>
        {rating_comment}
      </div>

<div style="font-weight:700; color:#23263b; margin-top:12px;">
        Info
      </div>
      <div>
        You can also find this rating associated with the booking in the control panel.
      </div>

</div>
  </td>
</tr>

<tr>
  <td style="padding:0 8px 24px 8px;">
    <div style="background:#fff;border-radius:12px;border:1px solid #eaeaef;padding:30px 20px;">
      <div style="font-size:18px;font-weight:800;color:#23263b;margin:0 0 12px 0;">Option</div>
      <img decoding="async" src="{staff_profile_image_url}" width="120" alt="Option"
           style="display:block;margin:0 0 11px 0;width:120px;max-width:100%;height:auto;" />
      <div style="font-size:14px;font-weight:700;color:#23263b;">{staff_name}</div>
      <div style="color:#23263b;font-size:14px;margin-top:3px;">{staff_about}</div>
      
      <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">Email</div>
      <div style="font-size:14px;margin-top:3px;">
        <a href="mailto:{staff_email}" style="color:#23263b; text-decoration:none;">{staff_email}</a>
      </div>
      
      <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">Telephone</div>
      <div style="color:#23263b;font-size:14px;margin-top:3px;">{staff_phone}</div>
    </div>
  </td>
</tr>

<tr>
            <td style="padding:0 8px 24px 8px;">
              <div style="background:#fff;border-radius:12px;border:1px solid #eaeaef;padding:30px 20px;">
                <div style="font-size:18px;font-weight:800;color:#23263b;margin:0 0 12px 0;">Point</div>
                <span style="display:inline-block; width:120px; height:120px; text-align:left; line-height:120px; font-size:100px; color:{service_color}; margin-bottom:10px;">🗓️</span>
                
                <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">Start</div>
                <div style="color:#23263b;font-size:14px;margin-top:3px;">{recurring_appointments_date_time}</div>
                
                <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">End</div>
                <div style="color:#23263b;font-size:14px;margin-top:3px;">{appointment_end_date_time}</div>
                
                <div style="font-weight:700;color:#23263b;font-size:14px;margin-top:12px;">Duration</div>
                <div style="color:#23263b;font-size:14px;margin-top:3px;">{appointment_duration}</div>
                
                <div style="font-weight:700;color:#7a8199;font-size:12px;margin-top:12px;">Booking received</div>
                <div style="color:#7a8199;font-size:12px;margin-top:3px;">{appointment_created_date} at {appointment_created_time}</div>
              </div>
            </td>
          </tr>

<tr>
  <td style="padding:0 8px 24px 8px;">
    <div style="background:#f6f8fb;border-radius:10px;padding:30px 20px;">
      <div style="font-size:18px;font-weight:800;color:#23263b;margin:0 0 12px 0;">Total per booking</div>
      <div style="font-size:14px;color:#23263b;margin-bottom:5px;">Service: <b style="color:#23263b;">{appointment_service_price}</b></div>
      <div style="font-size:14px;color:#23263b;margin-bottom:5px;">Additional services: <b style="color:#23263b;">{appointment_extras_price}</b></div>
      <div style="font-size:14px;color:#23263b;margin-bottom:5px;">VAT: <b style="color:#23263b;">{appointment_tax_amount}</b></div>
      <div style="font-size:14px;color:#23263b;font-weight:800;">Total: {appointment_sum_price}</div>
    </div>
  </td>
</tr>

</table>
      </td>
    </tr>
  </table>
</body>

Custom

General template for your own content.

Copy HTML Code 5

</td>
          </tr>

<div style="font-weight:700; color:#23263b; margin-bottom:12px; font-size:18px;">
        Example headline
      </div>

<p style="margin:0 0 15px 0;">
        Hello <strong>{customer_first_name}</strong>.
      </p>
      <p style="margin:0 0 20px 0;">
        Example text in the email... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris eleifend, dui a varius eleifend, neque arcu elementum tellus, non convallis urna dui sit amet mi. Mauris tempus augue eget ex semper, sed fermentum justo dapibus. Nullam id lacus erat. Phasellus nec justo imperdiet, eleifend augue vitae, vestibulum quam. Etiam facilisis aliquet semper. Sed sodales viverra nisl sed euismod. Aliquam porta nunc odio, malesuada pellentesque justo iaculis a. Donec volutpat risus convallis, a molestie ligula pulvinar eu. Nam sollicitudin quam sit amet velit fermentum feugiat. Morbi semper purus ut faucibus tempor. Donec a rutrum lacus.
      </p>

<tr>
  <td align="center" style="padding:0 8px 24px 8px;">
    <table cellspacing="0" cellpadding="0" border="0" style="max-width:350px; width:100%;">
      <tr>
        <td align="center" bgcolor="#635bff" style="border-radius:10px;">
          <a href="/en/DIN-LENKE-HER/" 
             target="_blank"
             style="display:inline-block; padding:18px 0; font-weight:800; font-size:17px; font-family: 'Inter', Arial, sans-serif; color:#ffffff; text-decoration:none; width:100%; border-radius:10px; letter-spacing:0.5px;">
            Example button
          </a>
        </td>
      </tr>
    </table>
  </td>
</tr>

</table>
      </td>
    </tr>
  </table>
</body>