Calendar Element in Funnel and Website Builder

You can place an FG Funnels calendar on any FG Funnels funnel or website page by using the Calendar elements. This makes it easy to create branded links and pages for your users to book through.


In This Article:


Adding the Calendar Element

  • To add the Calendar element, click on the plus sign in the upper left hand corner and select elements from the left side of the panel that opens. Find the Custom section, select the Calendar element and drag it to the desired location on the page.
  • Once the Calendar has been placed, a Calendar selector popup will appear. From here you can select from your existing calendar or click to create a new calendar in the calendar builder.

    Calendar Selector Popup


Customizing the Calendar Element

Calendar General Options

  • From the Options panel on the right hand side you can rename the Calendar element for ease of organization and recognition.
  • You can manage the margin and padding for spacing adjustments. Margin will add spacing outside of the survey element, so outside of the orange outline, whereas padding adds space inside the element or inside the orange outline.
  • If you need to change the selected calendar, there is a dropdown menu that will allow you to select a different calendar.

Setting Button Action

The final option in the General Tab of the calendar element is Button actions. This sets what happens when someone clicks the button to book the appointment. From the funnel builder, there are three options:

Calendar Button Actions

  • Use action from survey builder: Use action from calendar builder will use whatever was set in the Forms and Payments - Confirmation Page setting in the calendar builder, either giving a thank you message or sending to a redirect URL. If you choose this option, go to the calendar settings and ensure that that is set correctly.
  • Go to website URL: You can paste in any URL for the user to be directed to after submitting, whether that is a thank you page, a sales page, a page on your website etc.
  • Go to Next Step: This will take them to the step directly underneath the current step in the funnel overview tab. You can quickly check that step by clicking on the name of the page in the middle of the middle row in the top toolbar, this will bring up the pages menu. The page listed right under the current page is the "Next Step".

    Finding Next Step


Advanced Options

Calendar Advanced Options


The advanced options panel allowing you to turn on or off visibility on mobile or desktop. Blue icons means that it is visible on that device, whereas gray icons means that it is hidden on that device.

Custom class and CSS selector allow you to make CSS adjustments that target this element.