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 HTML button of the block
- Copy and paste this code into the editor and it should look like the image below
<!-- Button code --> <div title="Add to Calendar" class="addeventatc"> Add to Calendar <span class="start">06/01/2019 08:00 AM</span> <span class="end">06/01/2019 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
- 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