What's New in Version 8.2 - Save as Web Page

Save as Web Page

Version 8.2 can now generate calendars to web pages. This feature can be used to easily add a read-only calendar to your website. The look-and-feel of the generated web page will be similar to the main VueMinder window, including color-coding and a "Details" area which shows detailed information about a clicked item. The Pro version also includes the ability to customize the colors of the generated web page, add custom content to the web page header and footer, and automatically upload to an FTP server.

This feature will make it incredibly easy to share your calendars with other people, regardless of the calendar software they are using. All they'll need to see your calendar is a web browser. Also, since the generated output is simple HTML, integration into a website will be a snap. There are no scripts or other dependencies to install.

Example Output

Click here to see a live demo of the web pages generated by VueMinder. Buttons to the left of the Month label can be used for navigating between the generated months. In this example, April through July 2011 were generated. To view details about an item, click on it. A legend is displayed along the right-side, showing how items are color-coded.

Here's how it looks when viewed in Google Chrome. As you can see, text will word-wrap and day heights will automatically increase depending on the number of defined events (unlike Google Calendar!).

How to Generate a Web Page

A new "Save as Web Page (HTML)" command has been added to the File menu. When commanded, the following window will appear. This window will remember any previous settings and initialize those as the defaults.

To generate a web page, select the desired beginning and ending date range. You could generate a single month or several years - there's no limit. You can optionally include 'Details' and 'Legend' areas of n the generated output. The Details area will show information about clicked items. The Legend area will show color-coding. The content of the Legend and the color-coding of items will depend on whether the main VueMinder window is configured to color items based on calendar, category, priority, or location. Also, items that are filtered from being displayed in the main window will also be filtered from the generated output. For example, if you have a personal calendar that you don't want other people to see, you could uncheck that calendar's box in the calendar list prior to saving to a web page.

You can also specify the output folder and whether the generated web page should automatically open in a web browser. Click the "Save" button to generate the web page. Pro version users can also use the other tabs (Colors, HTML, FTP) to modify the appearance of the generated pages, add headers/footers or other content, and automatically upload the generated pages to an FTP server.

Customizing the Colors (Pro Only)

The Colors tab allows customization of the generated calendar color scheme. The default color scheme is gray and white. You can specify your own CSS file to more closely match the look-and-feel of your website. Click here to see example output that uses a custom CSS file, showing how the output can be modified to visually integrate with any website.

You can also specify colors for each area of the generated output. A preview will show the selected colors. Click an item to select it and modify its colors.


Including Headers, Footers, Menus, and More (Pro Only)

The HTML tab allows additional content to be added to the generated output. This content could include metadata tags, scripts, menus, headers, footers, and many other things.


Uploading to an FTP Server (Pro Only)

The web pages will be generated to a folder on your local computer. The FTP tab can be used to automate uploading the generated pages to your FTP server, for display on your website. Note, this feature will not work if you're behind a proxy server.


Conclusion

This feature is something many of our users have been requesting. Up until now, we've suggested syncing VueMinder with Google Calendar and using Google's iframe widget to embed the calendar on a website. However, that approach has a number of limitations - there's no word wrapping, colors don't match what you see in VueMinder, only one calendar can be embedded, and you get Google's look-and-feel whether you want it or not. With this new feature, you can totally bypass Google Calendar and generate web pages directly from VueMinder to your website, complete with word-wrapping and customized colors. This is a huge improvement!

blog comments powered by Disqus