Styling E-mails and Feeds

Which versions of Series25 components are you using?

These articles have been prepared for schools using 25Live Pro and 25Live Publisher.

In 25Live Publisher, not only do you have control over the settings and styles used by calendar views, control spuds, and promotion spuds, but you also have control over how e-mails are formatted and how much information and data your calendar feeds provide.


Setting Up and Styling E-mails

There are two broad types of e-mail that may be configured for use in 25Live Publisher:  Calendar Email and Event Email.  The Calendar Email contains only one e-mail possibility with two options to either use the List e-mail or the Classic e-mail.  While the Event Email group contains three separate e-mail types:  Email Me, Forward To Friend, and Event Email.  Each of these types of e-mail may be styled and branded to be in keeping with the rest of your calendar implementation.  The Registration e-mail type may be styled but it will never be used in 25Live Publisher since the Registration module is not turned on.


Setting Up and Styling Calendar Email - List Option

CLICK TO EXPAND

There is the possibility of having a calendar e-mail that frequent campus event attendees may subscribe to receive.  Some campuses actually send out a monthly e-mail of featured events or upcoming events.  The Calendar Email group gives us two different options:  Classic and List.  The Classic view provides a list of events that are one-time or upcoming with no ability to manipulate for featured events.  The List view also provides a list of events but in this view, we may determine if we only want featured events to go into the e-mail.  Most campuses opt for the List view because of the featured event functionality.

To edit the Settings and Styles of the Calendar Email:

  1. Locate the Calendar Email region on the Email tab and find the List view.  If you see that Classic is the listed Calendar Email and you want to change it, click the Switch Calendar Email View.  Once you see the List option displaying under Calendar Email, locate and click the Edit Settings & Styles link. 
  2. The Edit Settings for List window will open revealing a number of tabs including General Settings, Calendar Color Key Legend, Email Footer, New/Updated Events, and Events: Default (plus all of your featured levels listed out).  This should be your first clue that this last tab may be separated out by featured level so that non-featured events get one set of settings while each featured level gets its own special formatting.
    1. The General Settings tab contains the basic settings applying across both featured and non-featured events and allows you to control which featured events you want to format differently from the non-featured and other types of featured events.  The General Settings are arranged in twelve groups governing both settings and styles including:  Events, Email Settings, Grouping, Featured Event Settings, Group Header Format, Event Layout, Event Actions, Other Settings, Email Body, Heading, Groups, and Update Indicator Styles.
      1. The Events group contains only one setting, Maximum number of events, that controls the number of events that may appear in the e-mail.  The default value is set to a maximum value of up to 500 events per e-mail.  If you want to include fewer events on each e-mail, reduce the maximum number of events value.  However, note that if your calendar does not contain 500 events, the e-mail will only review the number of events available in the e-mail.
      2. The Email Settings group contains only one setting, Email header.  This setting controls the header of each List e-mail generated by 25Live Publisher.  You will note that it is blank meaning that there will be no header.  However, you may insert images, text, and other elements into this textbox.  This textbox is HTML-compliant meaning that you may use HTML tags like <p> and <blockquote> to group and format text.  You may event include the campus's logo by inserting an <img> tab containing alt text for screen readers provided you supply a full URL to the image's location and not a relative URL, and even web links and e-mail links using the <a> tag.  Be sure that any HTML tag you open is properly closed meaning that each <p> tag needs to have a corresponding </p> tag.  For <img> tags which are self-closing, remember to add the following after you set alt text and the link to the image, "/>.  This can be a very useful place to speak to the audience who have subscribed to these e-mails so be creative.
      3. The Grouping group contains two settings governing how grouping of events will be applied as well as what to do with Multi-day events.
        1. The Group by setting contains options allowing you different approaches to grouping the events in the e-mail.  You may opt for No grouping which effectively just lists out the events without any type of grouping.  Additionally, you may group the events in the e-mail by Year, Quarter, Month, Week, and Day.  The most commonly chosen approach is to group events by Month or Week depending on how many events you are supplying to the e-mail.  A smaller maximum number of events may make it more appropriate to select Week or even Day grouping.
        2. The Multi-day events setting determines whether to include events that started in the past.  As you will likely have events with repeating occurrences that did indeed start in the past, a best practice is to place a checkmark in this box.  When grouping, if an event has multiple occurrences that occur within differing months, for instance, those events will display once in each month where an occurrence is scheduled.
      4. The Featured Event Settings group contains only one setting, Only show levels with an accompanying drop-down menu that allows you to essentially filter the e-mail to only display events that have the selected featured levels.  Using this approach, you could schedule an e-mail that only provides "Premier" featured events and does not include any other event.  Most institutions do not opt to filter to only featured events but it is an option in cases where you need to have the list e-mail function as a notice of upcoming featured events. 
      5. The Group Header Format group contains two settings governing the date format and the week format when grouping.
        1. The Group date format setting allows you to select how you want the Group Header to format the date.  The drop-down menu contains all of the date formats that are used across the entire calendar implementation.  Select the format you would like to use from the drop-down menu.
        2. The Day of the week format setting allows you to control which format the grouping will use on the List e-mail.  There are four options:  None, Wed, Wed, and Wednesday.  If you choose to spell out the group date in long form, you will likely want the spelled out day of the week as well.
      6. The Event Layout group contains two settings, one to govern the default layout for the majority of events on the e-mail and a second to govern the layout for each featured level for which you define a different Event Layout.  The Default Layout applies to all non-featured events and any featured events where the Event Layout is set to Same as "Default layout".  The Default Layout should use the Standard Layout (1) set as the default selection.  The other option, New Featured Layout, is not appropriate for the default layout.  This layout will only be used if you did not make selections in the Featured Event Settings → Only show levels earlier.  If you are only showing featured events, only featured event layouts will be utilized.
        The Featured events layouts provides the opportunity to select from the Event Layout drop-down menu including applying a new standard layout to some featured layouts and applying differing featured layouts for others.  Each New "Featured Layout" choice you make will separate that featured level out onto its own tab in the List email settings for special formatting.  For instance, if one selected New "Featured Layout" were selected for each of the four Featured Levels in the image above,
        For instance, if one selected New "Featured Layout" were selected for each of the four Featured Levels in the image above,  Each featured layout would generate a separate tab for formatting that featured level layout.  There are now four tabs corresponding to each of those featured layouts for events tagged with the appropriate featured level.  This allows your e-mail to differentiate those featured events just like your calendars have already been set up to accomplish.
        Another change that occurs once you select a new featured layout, is that you may apply that featured layout to other featured levels.  Computer Training could use the same featured layout as Leadership Training.  If your purpose is to truly differentiate each featured level, you will likely not do this but it points out the possibility of combining featured levels into a single or a smaller number of featured layouts. With four featured layouts defined and a standard layout for all non-featured events, the tabs for formatting those looks like the following image: 
      7. The Event Actions group contains two settings governing the event actions associated with the list e-mail.
        1. The Event action icon setting governs whether the icon will display next to an event or not.  The event action in this instance is to add the event to the viewer's calendar.  It is a best practice to include the Event action icon.  The appropriate response is Yes instead of the default No.
        2. The Show sign-up buttons setting governs whether the sign-up buttons that are part of event registration will show up or not.  Since the event registration module is not functional, the default setting of Yes should be altered to No.
      8. The Other Settings group contains settings governing the update indicators and the calendar link.
        1. The Show update indicators setting determines whether an update indicator will display when an event is new or has been updated.  It is a best practice approach to display the update indicators which are formatted later in the General Settings.
        2. The Show calendar link setting determines whether the link to the full calendar on the campus website is provided with the e-mail.  As the e-mail may not necessarily include every event based on choices about featured events, it is a best practice to show the calendar link.
      9. The Email Body group contains settings that control the width of the body of the e-mail text as well as how links will behave in the e-mail.
        1. The Max body width setting controls the width of the body of the e-mail.  The default value of 636px forces the e-mail window that opens for the list e-mail to always be 636px wide.  This limit may be annoying to e-mail recipients who may have to resize the window to see the contents adequately.  A better approach is to alter the maximum body with value to 100% so that whatever normal window opens when the recipient opens their e-mails will be filled with the e-mail body. 
        2. The Link color style controls the color of links to more event details.  This style is inherited from the Base link color set in the Global Settings.  There is one caveat that is important.  If you have enabled calendar colors in the global settings, those calendar colors for links will be used in lieu of this single Link color setting.
        3. The Link transform style controls the case of link text.  It is a best practice to just accept the link text as output by the calendar which means the default setting of none is appropriate.  However, you may also choose between capitalize, lowercase, or uppercase. 
        4. The Link decoration style controls whether links are underlined by default or not.  This value is inherited from the Base link text decoration setting in the Global Settings.  You may either accept the default value or alter this selection by clicking in the textbox and selecting from the drop-down menu's options.
      10. The Heading group contains a group of stylistic settings governing the header of the e-mail including font styles, background color, and padding and spacing.
        1. The Font style controls the font stack being used by your e-mails.  The Base email font is set in the Global Settings. 
        2. The Size style controls the font size.  If you are using relative length units like rem or em, you will need to divide 12 points by the original 10 points base text size to arrive at a value of 1.2 rem or 1.2em.
        3. The Weight style controls the relative weight of the font.  There are three options:  normal, medium, and bold.  The default setting is bold for headings.
        4. The Color style controls the color of the font used for the Heading text.  It defaults to the Global group color set in the Global settings.  However, if you want to select a different color in your institution's color palette, you simply have to click in the textbox to activate it and alter the hexadecimal color code.
        5. The Background color style controls the background behind the Heading.  It defaults to transparent which means whatever color is behind the calendar on your website will show up in the Heading.  That can lead to issues with text not being visible or not clearly visible.  It is a best practice to set a value for the background which will, very often, be white (#ffffff).
        6. The Text transform style controls how the text in the Heading will appear.  The default value of uppercase will transform the heading text into all capitals.  Other options include:  none, capitalize, and lowercase.  This value is inherited from the Global group text transform setting in the Global settings.  For consistency in the design of your calendars, you should most often accept this inheritance.
        7. The Padding style controls the padding around the Heading.  The default settings are top and bottom padding of 2px and right and left padding of 0px.  If you preview and determine that your font selection requires more spacing above or below the heading you may modify the values in these textboxes.
        8. The Bottom spacing style controls the spacing at the bottom of the Heading region and adds 8px of space between the padding and the next box region of the e-mail.
      11. The Groups group contains a group of stylistic settings governing the grouping headers of the e-mail including font styles, background color, padding, and separators.  As most of these settings mimic exactly what is outlined in the Heading region, just follow those directions to style this group of settings.  However, there are two style settings that are different:  Separator width and Separator color.
        1. The Separator width style controls the width of the separator between the groups and associated items.  If you want to display a separator, you will need to alter the default value, 0px, to a value of 1px or greater.  
        2. The Separator color style controls the color of the separators.  This value is inherited from the Base border color set in the Global settings.  You may alter this value by clicking in the textbox to activate it and then providing a new hexadecimal color code.
      12. The Update Indicator Styles group contains stylistic settings for an indicator to appear with an event on the e-mail if that event has been updated since a past e-mail was sent.
        1. The Indicator font size style controls the size of the font used by the indicator.  The default value is 8pt (points).  If you are using relative length units like rem or em, you will need to divide 8 points by the original 10 points base text size to arrive at a value of 0.8rem or 0.8em.
        2. The Indicator font weight style controls the weight of the font used by the update indicator.  The default value is for normal text.  However, you may also select either medium or bold font weights.
        3. The Indicator color style controls the color of the indicator that denotes an updated event.  Most campuses would rather not have a combination of yellow and red for the indicator color and its background color.  Choose a value from your institution's approved color palette and set a hexadecimal value for the Indicator Color.  A good rule of thumb to follow is that if the background is dark, you want a light indicator color.
        4. The Indicator background color style controls the background color underneath the Indicator.  Very often, the background will be a darker color meaning that the Indicator color would be a lighter color.  Choose a value from your institution's approved color palette and set a hexadecimal value for the Indicator background color.
    2. The Calendar Color Key Legend tab controls whether or not a Calendar Color Key Legend appears with the List e-mail.  In order for this functionality to work, you will need to have calendar colors turned on in the Global Settings and then set a different background color for each calendar's events.  
      1. The Legend Settings group contains only one setting, Show legend.  The default value is No turning off the Calendar Color Key Legend.  If you want to use this option, click the Yes radio button.  Remember, you must also enable calendar colors in the Global Settings and include events from differently colored, mixed-in calendars.
      2. The Legend Styles group contains stylistic settings governing the font, font size, heading color, heading background color, and border color for the Legend.
        1. The Font style controls the font used for all text on the Legend.  This font value is inherited from the Base email font set earlier.
        2. The Font size style controls the size of the font for all text on the Legend.  The default value is 8pt (points).  If you are using relative length units like rem or em, you will need to divide 8 points by the original 10 points base text size to arrive at a value of 0.8rem or 0.8em.
        3. The Heading color style controls the font color for the heading for the Legend.  The default value is inherited from the Global group color contained in the Global Settings.  If you want to use a different color for this heading, simply click to activate the text box and replace the value with a hexadecimal color value from your institution's approved color palette.
        4. The Heading background color style controls the background color behind the Heading text.  It defaults to transparent which means whatever color is behind the calendar on your website will show up in the Heading.  That can lead to issues with text not being visible or not clearly visible.  It is a best practice to set a value for the background which will, very often, be white (#ffffff).
        5. The Border color style controls the color of the border surrounding the legend.  It is normally a good practice to set this value to the same value used as your Base border color set in the Global Settings.
    3. The Email Footer tab contains two groups: an Email Settings group and a Footer Styles group
      1. The Email Settings contains only one option, the Email footer.  The Email footer provides a large textbox where you may enter a custom privacy message, images, text, and other elements.  As a completely HTML-enabled region, you can use HTML entities to produce live links, connect to those images, and more.  However, be aware that if you enter anything in the textbox, it removes the standard footer messages for unsubscribing from the e-mail as well as the reporting abuse link.  You will likely want to capture these URLs so that you can recreate them in your customized e-mail footer.
        Tip: Using Pre-Defined Text Field Variables

        A few pre-defined text variables are available for you to use in the Email footer section, including the highly recommended opt-out/unsubscribe link ({EmailOptOutUrl}), required by many email recipient systems to help your emails not be classified as "spam."

        The opt-out variable must be used (not hard coded), so the system can dynamically replace it with a URL you define, or the opt-out link will not work.

        Example:

        <p>To unsubscribe, <a href="{EmailOptOutUrl}" target="_blank">click here</a>.</p>

        Other variables include an email abuse reporting URL ({EmailAbuseUrl}).

        Define variable values on the Edit Settings page, on the Settings tab.

      2. The Footer Styles group contains stylistic elements governing the font, font size, font weight, line height, text color, link color, background color, padding, and separator width and color.   
        1. The Font style controls the font used for all text in the Footer.  This font value is inherited from the Base email font set earlier.
        2. The Size style controls the size of the font for all text in the Footer.  The default value is 8pt (points).  If you are using relative length units like rem or em, you will need to divide 8 points by the original 10 points base text size to arrive at a value of 0.8rem or 0.8em.
        3. The Weight style controls the relative weight of the font.  There are three options:  normal, medium, and bold.  The default setting is normal for footer text.
        4. The Text line height style controls the line height of each line of text in the Footer.  The default value is set to 1.2em.  If you are using the rem setting to scale text around the base font size set in the Global Settings simply change this setting from 1.2em to 1.2rem.
        5. The Color style controls the color of the font used for all Footer text.  It defaults to a dark gray (#7F7F7F).  However, if you want to make this setting match the base text color, collect that hexadecimal code from the Global Settings and insert it here.
        6. The Link color style controls the color of links in the e-mail's footer region.  Note that there is only one setting for the link color and no option to have a differing hover color.  This value is inherited from the Base link color in the Global Settings.
        7. The Background color style controls the background behind the Footer region.  It defaults to transparent which means whatever color is behind the calendar on your website will show up in the Heading.  That can lead to issues with text not being visible or not clearly visible.  It is a best practice to set a value for the background which will, very often, be white (#ffffff).
        8. The Padding style controls the padding around the Footer region.  The default settings have the top padding set to 0px so that the footer begins immediately after the last event listing in the e-mail.  The right, bottom, and left padding defaults to 3px.
        9. The Separator width style controls the width of the separator between the groups and associated items.  It defaults to a 1px width for the separator which is pretty normal.  If you want a heavier separator, increase the number of pixels allotted to the separator.  
        10. The Separator color style controls the color of the separators.  This value often will match the Base border color set in the Global settings.  You may alter this value by clicking in the textbox to activate it and then providing a new hexadecimal color code.
    4. The New/Updated Events tab contains settings and styles controlling whether or not to show updated events, date/time options, font styles, padding and spacing, and heading styles.
      1. The Updated Events group contains only one setting, Show updated events.  This setting governs whether or not new and updated events are listed at the top of the digest e-mail.  The default value is No.  If, however, you want to show updated events at the top of the digest e-mail, simply click on the radio button for Yes
      2. The Date/Time Options group contains settings governing the formatting of dates, how the year behaves, the formatting of Time, and whether or not to display Short or Long Time Zone formats.
        1. The Date format allows you to select from a large list of different formats for the date in the drop-down list.  If you have been using one form of the date in all your calendar, control, and promo spuds, use that same format here for consistency of design.
        2. The Hide year setting defaults to a value of Yes.  Since there will be grouping that indicates the year, it is possible to hide the year within dates.  However, you may choose to show the year within dates by selecting No.
        3. The Time format setting controls how time outputs on the events in the calendar.  If you have been using one form of the time in all your calendar, control, and promo spuds, use that same format here for consistency of design.
        4. The Time zone display setting controls the display of the time zone along with the time.  For the vast majority of campuses, the default setting of None is the appropriate selection.  However, if you are a multi-campus institution with multiple campuses in multiple time zones, choose between either Short or Long format.
      3. The Styles group contains stylistic settings for new and updated events including font, font size, padding, and bottom spacing.
        1. The Font style controls the font used for all text in the New/Updated section of the e-mail.  This font value is inherited from the Base email font set earlier.
        2. The Size style controls the size of the font for all text in the New/Updated section of the e-mail.  The default value is 8pt (points).  If you are using relative length units like rem or em, you will need to divide 8 points by the original 10 points base text size to arrive at a value of 0.8rem or 0.8em.
        3. The Padding style controls the padding around the New/Updated section of the e-mail.  The default settings are top and bottom padding of 2px and right and left padding of 0px.  If you preview and determine that your font selection requires more spacing above or below the heading you may modify the values in these textboxes.
        4. The Bottom spacing style adds 16px of space between the last entry in the New/Updated section and the rest of the list of events in the e-mail.
      4. The Heading group contains stylistic settings for the Heading above the New/Updated section of the e-mail.
        1. The Size style controls the size of the font for the Heading above the New/Updated section of the e-mail.  The default value is 10pt (points).  If you are using relative length units like rem or em, you will need to divide 10 points by the original 10 points base text size to arrive at a value of 1rem or 1em.
        2. The Weight style controls the relative weight of the font.  There are three options:  normal, medium, and bold.  The default setting is bold for heading text.
        3. The Style setting controls whether the Heading text is output in normal text or in italic text.  Most heading text on websites is in normal text.
        4. The Color style controls the color of the Heading text.  This value is inherited from the Base text color set in the Global Settings.  However, if you want to use an alternated color from your institution's color palette, simply click in the textbox to activate it and replace the default with a new hexadecimal color code.
      5. The Events: Default tab contains a group of settings and styles governing how all of the events listed in the e-mail will be displayed with the exception of any featured levels that you may have separated out for separate styling.  The settings and styles are arranged in eight groups:  Display Settings, Date/Time Options, Image Settings, Inline Images, General Styles, Event Title Styles, Event Details Styles, and Image Styles.
        1. The Display Settings group contains the Field list of data that will be displayed for each calendar entry on the e-mail.  It uses default values of Title, Time Span, Location or Venue, and DescriptionNote that the Title and Time Span fields always appear at the top of each calendar entry in the list.  But, you may reorder any additional fields like the Location or Venue and the Description fields by either using the up or down arrow head or simply renumbering the Order.  Also, note that you may provide a different Label for both the Location or Venue field and the Description field.  In addition, you may limit the Max Length of those fields as well.  While these default, or non-featured, events may only display 300 characters of the event description, you could alter that on featured events to provide for more text.  You may also Remove all of the default fields with the exception of the Title of the event.  If you select a field for removal or alter the Order, Label or Max Length fields, click the Update button to update the field list. The versatility of the Display Settings also provides for the ability to add new fields to the displayed list of fields.  Click on the drop-down list labeled add new field will reveal a list of all the additional fields of data coming from 25Live into the Publisher events for you to display.
        2. The Date/Time Options contain settings governing how dates and times will be displayed on the events in the e-mail.
          1. The Label ongoing events setting defaults to Yes and includes a label for multi-day events that start in the past and extend into the future.  For this functionality to work, you must select Include events that started in the past in the Grouping section of the calendar view settings.  You may modify the Ongoing events label by replacing the provided text with your own.
          2. The Date format should be set to follow the date format you have been using throughout your entire calendar implementation.
          3. If you are grouping events by time, the Hide year when grouping setting of Yes will remove the year from the dates as it is not necessary to repeat it because of the grouping.  These grouping options would also cover grouping by month.
          4. If you are grouping events by day, the Hide event dates when grouping by day setting of Yes will remove the dates from the event as you already have them in the grouping.
          5. The Day of the week setting controls first whether or not the day of the week is displayed with the date and second if it is displayed whether it will be spelled out or abbreviated.  Make the selection that matches how you have been formatting the Day of the week throughout the rest of your calendar implementation.
          6. The Show end date setting of Yes displays the end date in addition to the start date for an event.  However, for single-day events, only the end time will appear.  This setting should be Yes to cover your events with repeating occurrences.
          7. The Show time setting of Yes displays the event time along with the event date.  As the event time is critical information, this is exactly how you want the events to be formatted on the e-mail.
          8. The Time format setting controls how time outputs on the non-featured events in the calendar.  If you have been using one form of the time in all your calendar, control, and promo spuds, use that same format here for consistency of design.
          9. The Time zone display setting controls the display of the time zone along with the time.  For the vast majority of campuses, the default setting of None is the appropriate selection.  However, if you are a multi-campus institution with multiple campuses in multiple time zones, choose between either Short or Long format.
        3. The Image Settings group contains settings that control the positioning and the size of the Event Image when displayed with the non-featured events on the list e-mail.
          1. The Image position setting controls the positioning of the event image.  It also provides an option for No Image should you choose to not display the event image on non-featured events.  You may also position the event image to either the Left or Right of the event information in the list e-mail.  For instance, you might position the image to the Left of the event information for all of the non-featured events in the list e-mail while positioning the image to the Right to the right of the event information for all featured events.
          2. The Max image width (pixels) setting controls the maximum width of the event image.  You should match the event image's width to the same width you have been using throughout the rest of your calendar implementation.
          3. The Max image height (pixels) setting controls the maximum height of the event image.  It is customary to leave the height value blank to allow for variable heights and to avoid distortion when images do not fit within the bounding container when both max image width and max image height are entered.
        4. The Inline Images group contains only one setting, Show inline images.  Choosing Yes for this setting will display images included in the event description using the HTML <img> tag.  The default value is set to No, however, if you are using the <img> tag in your event descriptions in 25Live Pro's Event Form, you should set this value to Yes.
        5. The General Styles group contains five stylistic elements including: Margin, Padding, Separator size, Separator color, and Vertical alignment
          1. The Margin style controls the top, right, bottom, and left margins around the event information section for each event.  These all default to 0px but may be increased by supplying a value greater than 0.
          2. The Padding style controls the top, right, bottom, and left padding around the content region for each event.  The top and bottom padding are set by default to 2px while the right and left padding default to a value of 0px.
          3. The Separator size style controls the thickness of the separator line between each event in the list e-mail.  The default size of each separator is 1px.  This is a customary setting for separators and provides a slim line in between each event.  If you want a heavier line, increase the pixel size of the separator.
          4. The Separator color style controls the color of the separator line.  This style defaults to the Base border color style set in the Global Settings.  However, if you want to add more color differentiation between each image, select another hexadecimal color value from your institution's approved color palette and enter that value in place of the default value.
          5. The Vertical alignment style controls the vertical alignment of the event information for each event.  This value defaults to top.  However, you may also select middle or bottom vertical alignment
        6. The Event Title Styles group contains five stylistic settings including:  Font, Size, Weight, Style, and Signup button padding.
          1. The Font style controls the font used for event titles in the e-mail.  This value defaults to the Base email font set earlier.  However, if you are using a serif font for your headers, you might want to specify that font stack from your global settings here.  Otherwise, just use the default setting.
          2. The Size style controls the size of the font for Title text for each event listed on the e-mail.  The default value is 10pt (points).  If you are using relative length units like rem or em, you will need to divide 10 points by the original 10 points base text size to arrive at a value of 1.0rem or 1.0em.
          3. The Weight style controls the relative weight of the font.  There are three options:  normal, medium, and bold.  The default setting is bold for Title text.
          4. The Style setting controls whether the Title text is output in normal text or in italic text.  Most heading text on websites is in normal text.
          5. The Signup button padding style controls the padding around the signup button.  Since the registration module is not functional in 25Live Publisher, you may simply accept the default values here since you turned off the signup button in an earlier setting.
        7. The Event Details Styles group contains four stylistic settings including:  Font, Font size, Field label wrapping, and Field label font weight.  
          1. The Font style controls the font used for the details of each event in the e-mail.  This value defaults to the Base email font set earlier.  It is a best practice to use the inherited default value for this font setting.
          2. The Font Size style controls the size of the font for Details text for each event listed on the e-mail.  The default value is 9pt (points).  If you are using relative length units like rem or em, you will need to divide 10 points by the original 10 points base text size to arrive at a value of 0.9rem or 0.9em.
          3. The Field label wrapping style controls whether or not the labels will wrap or not if they will not fit on one line.  The default value is normal which allows the label to wrap.  However, if you do not want labels to wrap to an additional line, select the no wrap setting.
          4. The Field label font weight style controls the relative weight of the font.  There are three options:  normal, medium, and bold.  The default settings is normal for field labels.  However, if you want labels to behave like they do in your calendar entries, set this value to bold.
        8. The Image Styles group contains three stylistic settings for images on each event in the e-mail including:  Image padding, Image border size, and Image border color.
          1. The Image padding styles controls padding around the image.  The left padding defaults to 0px so that image will be flush with the margin of the event information region.  The top and bottom padding is set to 5px giving spacing both above and below the image.  The right padding is set to 10px to separate the image from the event information text.  Should you want additional padding, simply replace the values in each textbox with your own values.
          2. The Image border size style controls the size of any border surrounding the image.  The default value is set to 0px which means that there will be no border around images.  If you want to add a border, a best practice is to add a 1px border.
          3. The Image border color style controls the color of the border if it is greater than 0px.  The customary color for borders around images is black (#000000).  However, you may use any other color in your institution's color palette for the border around the image by simply replacing the default hexadecimal value with your own chosen value.
      6. The Featured Event tab contains the exact same set of options just outlined for the Default events.  As such, you may follow the outline of instructions for default events with featured events.  There are a couple of changes that you might make for featured events to differentiate them on the list e-mail.
        1. In the Display Settings, you might choose to display additional fields as well as provide a longer Description by increasing its Max Length value.
        2. If you abbreviated the date and day of the week in the Date/Time Options for the Default events styling, you might use long form for the date and day of the week for featured events.
        3. In the Image Settings, you could put the featured event's image to the right of the event information if you set it to the left for the default events.  Additionally, you might increase the Max image width (pixels) value to provide for a more prominent image on featured events.
        4. In the Featured Event Settings group, you could specify your own language for the Featured label instead of the default value of Featured Event
        5. You will also need to style the featured label using the Featured Label Styles group of settings which includes:  Alignment, Font, Size, Color, Weight, Style, Text transform, Background color, and Padding.
          1. The Alignment style determines whether the featured label will appear to the left, center, or right above the featured event's information.
          2. The Font style controls the font used for the featured label text and defaults from the Base email font set earlier.  You should accept this default styling.
          3. The Font Size style controls the size of the font for Featured Label text for each featured event of that level on the e-mail.  The default value is 7pt (points).  If you are using relative length units like rem or em, you will need to divide 10 points by the original 10 points base text size to arrive at a value of 0.7rem or 0.7em.
          4. The Color style controls the color of the featured label text.  Your choice here depends on whether or not the Background color of the featured label box is dark or light.  The default value is set to white (#ffffff).
          5. The Weight style controls the relative weight of the font.  There are three options:  normal, medium, and bold.  The default settings is normal for the featured label.
          6. The Style setting controls whether the Featured Label text is output in normal text or in italic text.  Most heading-type text on websites is in normal text.
          7. The Text transform style controls how the Featured Label text will be output.  The default setting is to convert the label text to uppercase.  Even if you entered the Featured label above in initial capitalizations only, this setting will transform all characters into uppercase.  Other options include none (no transformation), capitalize (initial capitalizations), and lowercase (all lowercase characters).
          8. The Background color style defaults to the Global header color set earlier.  If you have created a color coding system for multiple featured levels, you should select the appropriate background color for the feature level for each separate feature event that you intend to style differently in the list e-mail.
          9. The Padding style controls padding around the Featured Event region.  It defaults to top padding of 0px, right padding of 3px, bottom padding, and left padding of 5px.  If you want to alter the amount of padding simply replace your chosen pixel values with the default values.
          10. The General Styles, Event Title Styles, Event Details Styles, and Image Styles should all correspond to the same setting you used for the default, or non-featured events.  As most of these concern fonts, font sizes, link colors, borders, those elements should be consistent in both featured and non-featured events.
  3. Once you are satisfied with your selections, you may click the OK button to save your settings and styles for the list e-mail.  Remember that you may always preview your work by clicking the Preview button.

Styling the Event Email

CLICK TO EXPAND

There are three different event e-mails that may be generated from a calendar entry:  Email Me, Forward to Friend, and Event Email.  Each of these must be individually styled but contain the same style choices throughout.  For instance, each e-mail option contains a Settings tab that includes a large textbox in which you may format your own customized Email header and Email footer.  These textboxes are HTML-capable meaning that you may enter properly formatted HTML for inclusion in the e-mails.  Be sure that you check your HTML and that you close all elements that you open.  The Email footer, if left blank, will display the default footer.  The default footer contains default links to unsubscribe from e-mails as well as to report e-mail abuse.  If you do not have your own privacy options to insert in any edited text, be sure, to copy the links to these two options so that you can format them into your customized Email footer.  The Settings tab also contains options for controlling the Event Template (or as we know it in 25Live Pro, the Event Type).  The Show event template setting controls whether or not the event type will display detailed information about the event.  The Event template label is set to default to Event type.  If you want to use a different label or even capitalize the work, type, make that alteration here by replacing the default text.  The Show inline images setting controls whether images displayed using HTML's <img> tag will appear or not, the answer should be Yes.

Additionally, each e-mail option contains a Styles tab which contains the exact same set of five groups:  Body, Message, Rules, Header (Event Description), and Event Info.  The Body group in each case sets the Max width of the e-mail to 636px.  A better approach is to set this value to 100% to allow the viewers' e-mail to populate based on their normal e-mail sizing.  The stylistic elements throughout the rest of these groups work exactly as in the List e-mail so the same instructions apply here.  There is one important element to note.  In the Event Info group, there is both a Label size style and a Event data size style.  The label size is set to 8pt while the event data size is set to 10pt.  This means the labels are significantly smaller than the event information they are denoting and describing.  This type of setting is poor design and should be altered to set the Label size and the Event data size to the same setting.  Again, if you are using relative length units scaling around the default original 10pt base text size, you would end up with values between 0.8rem and 1.0 rem depending on whether you scaled using 8pt, 9pt, or 10pt text size.  You should also change the Label color from a gray value to a value that corresponds with the color palette you have been using throughout the calendar build.

Setting Up and Styling Feeds

Each 25Live Publisher calendar comes with a set of five different calendar feeds:  an iCal Feed, an RSS Feed, an Atom Feed, a CSV Feed, and a JSON Feed.  The following table describes the differences between the different types of feeds available with each calendar.

Feed Name

Feed Description

RSS FeedShort for Really Simple Syndication, RSS is "a web feed that allows users and applications to access updates to websites in standardized, computer-readable format" (Wikipedia - RSS Feed).  In the case of 25Live Publisher, subscribing to an RSS feed means that the subscriber is notified of any updates to events on the feed without viewing the calendar.  An RSS feed uses a standard XML file format to ensure compatibility across different machines and programs.
Atom FeedAtom refers to "a pair of related Web standards.  The Atom Syndication Format is an XML language used for web feeds, while the Atom Publishing Protocol (AtomPub or APP) is a simple HTTP-based protocol for creating and updating web resources" (Wikipedia - Atom).  Atom was designed to replace RSS to "clarify RSS ambiguities, consolidate its multiple versions, expand its capabilities, and fall under the auspices of a traditional standards organization.
iCal FeediCal, short for Internet Calendaring and Scheduling Core Object Specification (Calendar), "is a media type which allows users to store and exchange calendaring and scheduling information such as events, to-dos, journal entries, and free/busy information.  Files formatted according to the specification usually have an extension of .ics" (Wikipedia - iCalendar).  iCalendar is supported by many products including Google Calendar, Apple Calendar (formerly iCal), IBM Notes, Yahoo! Calendar, Evolution (software), eM Client, Lightning extension for Mozilla Thunderbird, and SeaMonkey.  It is also partially supported by Microsoft Outlook and Novell Groupwise.
CSV FeedCSV stands for "Comma-separated values).  These feeds most often get used within affiliate marking because they allow for the import of large amounts of information into a database quickly.  It is important to understand that "CSV is not like XML and is not as semantic, but it does have a good basic structure.  This file format can easily be created and loaded with any spreadsheet program like Microsoft Excel" (Wikipedia - CSV data feed and affiliate marketing).
JSON FeedA JSON Feed "is a Web feed file format for Web syndication in JSON instead of XML as used by RSS and Atom" (Wikipedia - JSON Feed).  JSON stands for JavaScript Object Notation.  The difference between the XML-based feeds and a JSON feed is that XML must be parsed with an XML parser while JSON may be parsed by a standard JavaScript function.  Its simpler structure provides for quicker parsing of the data being fed to other applications.  JSON CORS setting in the Publisher feed allows you to share data from the Publisher calendar with other applications denoted by their web page address (for a more in-depth discussion read web.dev - Cross-Origin Resource Sharing (CORS)).

Setting Up the iCal Feed

CLICK TO EXPAND

The iCal Feed provides only limited control of its settings as illustrated in the following screen capture.


  1. The Start Date setting defaults to the Current day.  However, you may select a variety of different options from the drop-down menu as to when you want the feed to start.
  2. The End date setting defaults to a value of Current day + 180 days providing for the feed to contain basically 181 days of events within the limitations of the number of events.  However, you may select a variety of different options from the drop-down menu as to when the feed ends collecting events for display.
  3. The Maximum number of events setting controls how many events will be served by the feed.  The default value is to feed 200 events within the given Start date and End date.  You may increase this value up to a maximum of 1,000 events.
  4. The Ongoing events setting controls whether or not events that started in the past will display on the feed.  The default setting is for this to be checked to include these events.  In the case of repeating occurrences on events, you should make sure that this box remains checked.
  5. The Include HTML setting controls whether or not HTML formatting in event data is included on the feed or not.  It is a better practice to include the HTML formatting on the feed so that events on the feed behave and look like events on the calendars.  The default value of Yes is the appropriate setting.
  6. The Include Fields in Notes setting controls whether or not to include custom field values in the iCal notes field.  The default value of Yes is the appropriate setting to capture the majority of the information on each calendar entry.
  7. Once you are happy with your settings, click the OK button to save your settings.

Setting Up the RSS and Atom XML Feed

CLICK TO EXPAND

Both the RSS and Atom XML feeds use the exact same setup information.  The settings are contained in five groups:  Feed, RSS Publish Date (or Atom Publish Date), Date/Time Options, Image Settings, and Inline Images.  

  1. The Feed group of settings controls a number of critical elements to the overall function of the feed of data.
    1. The Start date setting defaults to the Current day.  However, you may select a variety of different options from the drop-down menu as to when you want the feed to start.
    2. The End date setting defaults to a value of Current day + 180 days providing for the feed to contain basically 181 days of events within the limitations of the number of events.  However, you may select a variety of different options from the drop-down menu as to when the feed ends collecting events for display.
    3. The Maximum number of events setting controls how many events will be served by the feed.  The default value is to feed 200 events within the given Start date and End date.  You may increase this value up to a maximum of 1,000 events.
    4. The Ongoing events setting controls whether or not events that started in the past will display on the feed.  The default setting is for this to be checked to include these events.  In the case of repeating occurrences on events, you should make sure that this box remains checked.
    5. The Include event template field setting controls whether or not the event type will be included on the RSS or Atom XML feed.  The default setting is No.  If you want to use that information for another application that is consuming the data from 25Live Publisher via the XML you will want to alter your answer to Yes.
    6. The Include custom event fields setting controls whether custom fields contained on the event will display as part of the feed data.  The default value is set to Yes and should remain set to that value.
    7. The Include web link setting controls whether or not the web link field will be contained on the event as part of the feed data.  The default value is set to Yes and should remain set to that value.  A blank web link value will cause this field to not be output on an event.
    8. The Include Html setting controls whether or not to include HTML formatting in event data.  As the Event Description from the 25Live Pro Event Form may contain significant amounts of HTML formatting, you should accept the default value of Yes.
    9. The Include xCal data setting controls whether or not to include extended XML elements using xCalendar and custom field data.  This data is useful with extensible to 
  2. The RSS Publish Date or the Atom Publish Date group allow you to include a publish date, which can be either the date the event started or the date it was added or changed.
  3. The Date/Time Options group contains settings for labeling ongoing events, formatting the date and day of the week, showing end date and time, setting the time format, and whether or not to display the time zone.
    1. The Label ongoing events and the Ongoing events label settings control whether or not events with repeating occurrences will get a special label to denote that they are part of a series.  The best practice is to accept the default value of Yes.  The Ongoing events label defaults to "Ongoing through" for the label.  If you have another phrase you want to use, enter it here replacing the default text.
    2. The Date format setting controls how the date is formatted.  The accompanying drop-down list provides a multitude of date options.  However, for consistency of design, you will want to use the same date format you have been using throughout the rest of your calendar.  However, if you are serving these events to another device using the feed, you might need to use one of the alternate formats to put the date in a consumable setting.
    3. The Day of the week setting controls whether or not you display the day of the week and how it is displayed if you choose to display it.  It provides for two different formats of the abbreviated day of the week and the fully spelled day of the week.  For consistency, use the day of the week format you have been using through the rest of your calendar implementation.
    4. The Show end date setting when the default value (Yes) is accepted will display the end date along with the start date of the event for repeating events.  A single date event would only display the start date.  The best practice is to set this value to Yes.
    5. The Show time setting controls whether or not the event time displays with the event date.  It is a best practice to accept the default value of Yes.
    6. The Time format setting controls how the AM/PM will be formatted on the event time.  The accompanying drop-down menu contains a full listing of the various formats from which you may select.
    7. The Time zone setting controls whether or not the time zone is included after the event times and specifies whether to use short or long form.  For most calendar implementations, the default value of None is most appropriate selection.
  4. The Image Settings group controls whether or not to display the image on the RSS or Atom feed.
    1. The Show image setting determines whether or not to display the image as part of the RSS or Atom feed.  It is a better practice to accept the Yes default setting especially if you are feeding this data to another application via the feed.
    2. The Image type setting allows you to select whether you will use the Event Image or the Detail Image.  Select which image you prefer from the drop-down menu.
    3. The Max image width (pixels) setting controls the absolute maximum width of whichever of the two images you select.  It is a good practice to use the same value you have been using for either the Event Image or the Detail Image throughout your calendar implementation.
    4. The Max image height (pixels) setting control the absolute maximum height of whichever of the two images you select.  A best practice is to leave this field blank allowing the height to be variable avoiding distortion issues when image are scaled from a large width to the maximum width set above.
  5. The Inline Images group contains only one setting, Show inline images.  If you want to display images that are contained in the event information (25Live Pro's Event Description) using the <img> tag, you should set this value to Yes.  If however, you want to suppress those images, you should say No.
  6. When you are satisfied with your settings, you should click the OK button to save your settings.

Setting Up the CSV Feed

CLICK TO EXPAND

The CSV Feed provides a format that you can actually use to import the data into other systems.  There are a limited number of elements to set for this feed.

  1. The Start date setting defaults to the Current day.  However, you may select a variety of different options from the drop-down menu as to when you want the feed to start.
  2. The End date setting defaults to a value of Current day + 180 days providing for the feed to contain basically 181 days of events within the limitations of the number of events.  However, you may select a variety of different options from the drop-down menu as to when the feed ends collecting events for display.
  3. The Maximum number of events setting controls how many events will be served by the feed.  The default value is to feed 200 events within the given Start date and End date.  You may increase this value up to a maximum of 1,000 events.
  4. The Ongoing events setting controls whether or not events that started in the past will display on the feed.  The default setting is for this to be checked to include these events.  In the case of repeating occurrences on events, you should make sure that this box remains checked.
  5. The Include Event ID field will produce a Unique ID for each event in the CSV file.
  6. When you are satisfied with your settings, you should click the OK button to save your settings.

The CSV file that is generated provides fields for all data on the events in the set indicated by your Start and End Dates as well as the maximum number of those events.  If your events have images, it will also include the URLs to those images.
 

Setting Up the JSON Feed

CLICK TO EXPAND

The JSON Feed contains three groups of settings that you need to configure:  Feed, Date/Time Options, and Security.

  1. The Feed group of settings controls the range of dates covered by the feed, the maximum number of events on the feed, what to do with events with repeating occurrences, and whether or not to include HTML included in the event data.
    1. The Start date setting defaults to the Current day.  However, you may select a variety of different options from the drop-down menu as to when you want the feed to start.
    2. The End date setting defaults to a value of Current day + 180 days providing for the feed to contain basically 181 days of events within the limitations of the number of events.  However, you may select a variety of different options from the drop-down menu as to when the feed ends collecting events for display.
    3. The Maximum number of events setting controls how many events will be served by the feed.  The default value is to feed 200 events within the given Start date and End date.  You may increase this value up to a maximum of 1,000 events.
    4. The Ongoing events setting controls whether or not events that started in the past will display on the feed.  The default setting is for this to be checked to include these events.  In the case of repeating occurrences on events, you should make sure that this box remains checked.
    5. The Include Html setting controls whether or not to include HTML formatting in event data.  As the Event Description from the 25Live Pro Event Form may contain significant amounts of HTML formatting, you should accept the default value of Yes.
  2. The Date/Time Options settings control how ongoing, or repeating, events are labeled, the date and day of week format, whether or not to show end date, whether or not to show the time along with the event date, the format for time, and whether or not to display the time zone and if displayed what format.
    1. The Label ongoing events and the Ongoing events label settings control whether or not events with repeating occurrences will get a special label to denote that they are part of a series.  The best practice is to accept the default value of Yes.  The Ongoing events label defaults to "Ongoing through" for the label.  If you have another phrase you want to use, enter it here replacing the default text.
    2. The Date format setting controls how the date is formatted.  The accompanying drop-down list provide a multitude of date options.  However, for consistency of design you will want to use the same date format you have been using throughout the rest of your calendar.  However, if you are serving these events to another device using the feed, you might need to use one of the alternate formats to put the date in a consumable setting.
    3. The Day of the week setting controls whether or not you display the day of the week and how it is displayed if you choose to display it.  It provides for two different formats of the abbreviated day of the week and the fully spelled day of the week.  For consistency, use the day of the week format you have been using through the rest of your calendar implementation.
    4. The Show end date setting when the default value (Yes) is accepted will display the end date along with the start date of the event for repeating events.  A single date event would only display the start date.  The best practice is to set this value to Yes.
    5. The Show time setting controls whether or not the event time displays with the event date.  It is a best practice to accept the default value of Yes.
    6. The Time format setting controls how the AM/PM will be formatted on the event time.  The accompanying drop-down menu contains a full listing of the various formats from which you may select.
    7. The Time zone setting controls whether or not the time zone is included after the event times and specifies whether to use short or long form.  For most calendar implementations, the default value of None is most appropriate selection.
  3. The Security group contains only one setting, Allowed websites.  This large textbox is used for Cross Origin Resource Sharing (CORS).  The list is a comma-separated list of web site URLs that may access this feed.

    Cross Origin Resource Sharing (CORS)

    For further understanding of what Cross Origin Resource Sharing (CORS) is and how it may be used with other websites and this feed, visit the following resources:

  4. When you are satisfied with your settings, you should click the OK button to save your settings.


PREVIOUSLY:  Selecting and Styling Promotion Spuds
UP NEXT :  Setting Up and Styling Event Actions