To complete this example we need to add one additional template to generate the month headers.  It is very similar to the main template in the first part of this example:

1. <div id="{gCalMarkup _id}.monthTemplate.container">
2.     <table>
3.         <tbody id="{gCalMarkup _id}.monthTemplate">
4.             <tr>
   
5.                 <td style="text-align:center; font-size:larger; color:white; background-color:#135CAE; border-bottom:1px solid black;" colspan="2">{gCalMarkup _eventMonthText} {gCalMarkup _eventYear}</td>
6.             </tr>
7.         </tbody>
8.     </table>
9. </div>

The only differences between this template and the previous one (other than the actual markup content) are the ids on the <div> and <tbody> tags where "template is replaced with "monthTemplate".  The required ids are "{gCalMarkup _id}.monthTemplate" and "{gCalMarkup _id}.monthTemplate.container".

gCalMarkup adds a copy of this template, with the markup selectors replaced with information from the event, before the first event and before any event where the month changes.