🎥 Embedding Light Blue’s forms & scheduling calendars in your website

Introduction

You can install some of Light Blue’s most helpful tools in your website so that clients can submit an enquiry or make a booking without leaving your website:

• Embedding one of Light Blue’s forms in your website allows you to start gathering the information that you need to convert an enquiry and deliver great service to your clients as soon as your prospective client gets in touch. When someone fills out your form, you’ll get a notification in Light Blue, and you’ll be able to create new a new enquiry without having to re-type or copy & paste anything.
• Installing Light Blue’s scheduling calendars in your website allows clients to book a shoot or appointment simply by selecting an available time, filling out their details in a booking form.

You can find out more about contact forms and scheduling calendars in other knowledgebase articles. This tutorial focusses on embedding them in your website for new clients to fill out.

Types of contact form and scheduling calendar

Your contact forms and scheduling calendars can appear to your site visitor in one of three ways.

Popup

Firstly as a ‘popup’ dialog. This means that your client doesn’t even leave the page that they’re viewing, and stays on your website. It’s a really good way of adding a call to action to any page on your site.

Embedded

By embedding the form or scheduling calendar into a page on your site, it will sit within your website’s design and your client won’t leave your website. This is really useful for your ‘contact me’ page, or a landing page for a particular marketing campaign.

Simple Link

Finally, by adding a link to the form or scheduling calendar to a page on your site, your client will be taken to your customisable Light Blue client portal. This is the most basic option, which enables you to use Light Blue’s forms and scheduling calendars even if your website doesn’t allow you to install them by the other methods.

Copy code

To install one of your Light Blue forms or scheduling calendars into your website:

1. Go to the “Form Templates” or “Scheduling Calendars” section in the Preferences window and select the one you want to install.
2. Click the “Install In Your Website” button.
3. Choose how you want to install it (i.e. as a popup, embedded, or a simple link).
4. When I click the button for the installation option that I want to use, some special HTML code is copied onto my computers clipboard, ready for me to paste into the right part of my website. Whenever I make changes to the form template or scheduling calendar in Light Blue, for example adding or removing fields, the form will be automatically updated wherever it’s already installed.

Pasting the embed code into your website

Depending on what sort of website you have, the approach to pasting the code into your site varies slightly. I’m going to run through three of the most common options now.

WordPress

For a WordPress site, installing your Light Blue forms is really easy. I’ve got a page on my site, which I’d like to install my form in, and I’m viewing it in the Text View – that’s important.

I find the place in the page where I’d like my form to appear, and then I’ll paste the code that I copied from Light Blue earlier. That’s it! 

Widget area

You can also paste Light Blue’s form code into a text field of a widget area. That’s particularly useful for a popup form, so I’ll paste that code in here. You can see that the form button now appears in the widget area, and the form pops up when I click on that.

Squarespace

Installing Light Blue’s forms in a Squarespace site is also simple. Here I have a page where I’d like my form to appear, and I’ve chosen to edit the page, and add an Embed Block. There’s a small code icon that I can click on, which reveals a larger area where I can paste my code from Light Blue. Once I’ve saved those changes, the form appears on my site.

Zenfolio

I can add also Light Blue’s forms to a page on a Zenfolio site in a few simple steps. When I edit a page, I can click on the embed button, which allows me to paste the code that I copied from Light Blue earlier. When I save those changes, my Light Blue form appears within my Zenfolio website.