New features Apply a Theme In Line Events From To Button Panel Week Numbers Date and Time Misc

Place one or more calendars on the page

For the calendar to be visible and to function, we need to load all the files associated with Datepicker. To start,  put a small transparent panel on the page, open the Forms Tab on the Quick Build menu and drag the Datepicker onto the panel.

Right Click>Hide Panel and move it out of the way to some obscure part of your page. Remember, we will not be using it, just the files for it.

Copy the following, and from the the Top Menu bar Insert>HTML Fragment, click on the page and Paste to Body.

Change the number of months to between 1 and 4.

See below the calendars for install notes


<script type="text/javascript">

$(function() {

$("#single").datepicker({

numberOfMonths: 1

});

});

</script>

<div id="single"></div>

Copy the CSS below, Right Click off your page>Attach HTML scrool down and paste it in place of /*Page Stylesheet*/.

Changing the font size will change the size of the calendar, or if this is the only calendar on your site just keep the ui-datepicker-div statement and change the font in Edit>Site Properties>Datepicker.

Styling can also be carried out as noted in the Apply  a Theme page


.ui-widget {

   font-size: 20px!important;

}

.ui-datepicker table {

   font-size: 20px!important;

}