Page tree
Skip to end of metadata
Go to start of metadata

The Publish Wizard makes it easy to make your calendar a dynamic part of your own web site. You can either include your calendar as part of an existing page, or link to a full-page interactive calendar (or put it in a frame). You can also preview what your published calendar will look like. Get started by clicking the Publish button on the left-hand menu.

Step 1: Choose the type of published calendar

There are several different ways to publish your calendar, and each has its advantages and limitations.

A link to a full-page calendar view

This is the simplest way to publish your calendar; the Publish Wizard will create the HTML for a link to a full-page view.

Responsive Iframe

This is the preferred method for embedding an interactive calendar onto an existing page on your website

Interactive mini-calendar

This calendar style is very useful for web sites that have restricted space. A small calendar appears on your site, and any dates that have events are highlighted in a different color. When the user clicks a highlighted date, a pop-up window displays more information. Look at the HTML generated for this view style to learn about more customization

This style is one of the more advanced but technically demanding ways to publish a calendar. If your web page contains poorly written CSS or javascript, this view may not work correctly.

Older Methods:

Fully-interactive Javascript calendar

Although this method is still supported, we recommend the Responsive Iframe method above

Static (non-interactive) View

This style is different than the full-page view in two ways

  1. The calendar will not display the forward/back arrows. It always shows the current period (Month/week/day) you select in Step 2
  2. The calendar is not a "full page view". The HTML generated can be pasted into an existing page. This style works well when you want your calendar to be part of another page
Basic Iframe

The "basic iframe calendar style" which uses a non-responsive <iframe> with fixed height/width settings. If you don't adjust the height/width settings to fit your calendar, you might find that portions become "cut-off" when the calendar has a lot of events. On the positive side, this calendar style does display the month forward/background arrows. This style is still supported, however we recommend the Responsive Iframe style as a modern alternative.

For our more technical members

  • The "Static (non-interactive)" calendar style generates its output using Javascript. If you place it in a table cell or <div>, the page will expand or shrink to fit the calendar's content. This flexibility comes at a cost; this type of calendar will not have the forward/backward arrows.
  • Each style has its advantages under certain circumstances. You should experiment with both to see what works best with your site.
Including Published Events

If you want to publish a calendar that contains a list of all events within a given range of a US zip code, check this setting. This is useful if you have a site where you want include local content, but you don't want to enter events yourself. It relies on all of the public events entered by other nearby localendar users.

Step 2: Choose the style for your published calendar

You've already chosen how to include localendar on your site.. but what will your visitors see? A month-block view? A list of events "Happening Soon?". Use the drop-down to make your selection from a variety of calendar styles.

The Preview Area

This area shows a preview of what your published calendar will look like, based on the option you selected in Step 2.


The Preview only reflects the calendar style you selected in Step 2; it does not reflect the selection you made in Step 1. The exception is if you selected the "Mini-calendar" view style.

Step 3: Generated HTML

The text box in Step 3 represents the HTML generated by localendar based on your choices in steps 1 and 2. You should copy this HTML onto your website's page where you want your localendar (or link to it) to appear.

Please refer to Common Publishing Questions for further information.

  • No labels