Skip to content
This repository has been archived by the owner on Dec 28, 2020. It is now read-only.

Publishing JS Syndication

Jump to bottom
Chris Carlevato edited this page Mar 27, 2017 · 1 revision

Commonly referred to as Stickers, Magnets or Widgets Helios Calendar provides simple JavaScript code to syndicate events on any site, linking to your calendar to increase event exposure and traffic to your site.

JavaScript Syndication as Integration Tool

Because the JavaScript Syndication will work on any page that outputs HTML (HTML, PHP, ASP, JSP, .NET, etc) it can also be used as an integration tool for non-PHP sites. This may be easier and more versatile for some users, especially those who wish to integrate Helios event services with a non PHP website, or for users not comfortable editing PHP source code.

Event List Syndication

Usage

Adding event list syndication to a new page is as easy as copy & paste. After pasting the script tag to the new page users have the option to customize the feed using the variables below. The setting of these variables will affect how the list is syndicated to that individual page and different pages (or different lists within a single page) can be configured to provide different lists.

Styling & CSS

The event list syndication outputs event data in HTML5 standards compliant unordered list format. This list can be styled using CSS to match any site design or layout. Because the list elements are not named users have the option to allow their generic classes style the list or syndicate the list within a div element to custom style the list however their needs require.

Markup

The following elements are used by the event syndication list and can be styled as desired by adding the appropriate classes to the local style sheet.

  • ul
  • li
  • li.date
  • a
  • time

Variables

The following variables can be edited to customize the syndicated list of events. These variables, and their optional values, are included in a comment within the tools page code.

  • (s) Event List Type These are the same list types as the default RSS event feeds. Must be a numeric value or default of All Events is used.
  • 0 = All Events
  • 1 = Newest Events
  • 2 = Most Popular Events
  • 3 = Featured Events
  • (z) Maximum Number of Events to Display Must be a numeric value or default list size is used.
  • (t) Show Event Time Must be equal to 1 or 0, otherwise default of Hide Time is used.
  • 1 = Show Event Start Time
  • 0 = Hide Event Start Time

Performance

To improve performance the syndicated list of events is cached locally as a JSON object. This cache is generated daily for the first syndicated pageview and used for all subsequent requests (eliminating MySQL connections & reducing server workload). The cache file is rebuilt with updated event data when one of the following occurs:

  • An event is created, approved, edited or deleted by an admin user within the admin console.
  • A cache file for the current date is not available.

When the syndication cache file is rebuild any older versions of the file present are deleted. Each syndication list type (All Events, Newest Events, Popular Events & Featured Events) has a unique JSON cache.

Location Map Syndication

When enabled within API settings Helios Calendar will allow site users to embed the event locations map within pages outside of Helios Calendar to browse locations and refer traffic back to the calendar.

Usage

There are three steps, with some optional configuration, to use the map syndication. These steps are outlined in the tools page as part of your public calendar.

  1. Place Header Code within the <head> tag of the page.
  2. Add the onload attribute to the page's body tag.
  3. Place Map Code in your page where the map is to be displayed.

Styling & CSS

A style sheet containing the default styles is included as part of the Header Code provided within the syndication instructions. This style sheet can, optionally, be omitted and the map styled using custom classes.

Default Style Sheet Contents

#map_canvas {font-family:Verdana,sans-serif;font-size:11px;width:500px;height:500px;margin:10px;}
#map_canvas img {border:0;}
#map_canvas a {text-decoration:none;color:#666666;}
#map_canvas a:hover {text-decoration:underline;color:#FF6600;}
#map_canvas .menu ul {list-style-type:none;padding:0;margin:0;}
#map_canvas .menu ul li {float:left;margin:5px;}
div.iw {width:260px;height:200px;margin:0px;padding:0;}
div.iw_menu {height:20px;margin:0px 0px 7px 0px;padding:3px 0px 3px 5px;border-bottom:solid 1px #ACACAC;}
div.iw_menu img {float:left;margin:2px 3px 0px 3px;}
#iw_msg {float:left;width:40%;text-align:left;color:#666666;padding:3px 0px 0px 5px;color:#666666;}
#map_controls {margin:3px 0px 10px 0px}
#map_controls a {text-decoration:none;}
#map_controls a:hover {color:#FF6600;}
#pb_button {font-family:Arial,sans-serif;font-size:12px;font-weight:bold;cursor:pointer;border:solid 1px #A9BBDF;
height:16px;padding:2px 5px 1px 5px;text-align:center;border-radius:5px; -khtml-border-radius:5px;
-moz-border-radius:2px; -webkit-border-radius:2px;background: #FFFFFF;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FDFDFD', endColorstr='#F3F3F3');
background: -webkit-gradient(linear, left top, left bottom, from(#FDFDFD), to(#F3F3F3));
background: -moz-linear-gradient(top, #FDFDFD, #F3F3F3);
-moz-box-shadow:100px 100px 1px #000000;-webkit-box-shadow:1px 1px 5px rgba(0,0,0,.5);
-goog-ms-box-shadow:1px 1px 5px rgba(0,0,0,.5);box-shadow:2px 2px 3px #A9A7A3;}

Performance

To improve performance the syndicated list of locations (map pushpins) is cached locally as a JSON object. This cache is generated daily for the first syndicated pageview and used for all subsequent requests (eliminating MySQL connections & reducing server workload). The cache file is rebuilt with updated location data when one of the following occurs:

  • A location is created, edited or deleted by an admin user within the admin console.
  • A event is created, approved, edited or deleted by an admin user within the admin console.
  • A cache file for the current date is not available.

When the syndication cache file is rebuild any older versions of the file present are deleted.

Events

Locations

Administration

Newsletters

Publishing

Customization

Themes

API

Technical

About

Clone this wiki locally