This is a how-to article that will explain a step-by-step guide to creating and customizing the "Add to Calendar" button for the announcements website.
- Login to the Announcements Dashboard
- Create a new post or if you already have a preexisting post, navigate to the post and edit it.
- Click on the tab on the right side of the WYSIWYG editor click the "Text" tab
- Place your cursor where you would like the button to go
- copy and paste this code into the editor
<!-- Button code --> <div title="Add to Calendar" class="addeventatc"> Add to Calendar <span class="start">12/13/2018 08:00 AM</span> <span class="end">12/13/2018 10:00 AM</span> <span class="timezone">America/New_York</span> <span class="title">Change to Event Title</span> <span class="description">Change to Event Description</span> <span class="location">Change to Location of Event</span> </div>
- format the start and end date as seen above with the correct data
- change "Change to Event Title" to the title of your event
- change "Change to Event Description" to your description of the event
- change "Change to Location of Event" to the location of your event
- change the view back to the "Visual" WYSIWYG editor and publish/update your post
- After saving, view your post and test out your new Add to Calendar button
- It is important that you do not change any of the <div> or <span> areas as these are necessary for the button to work