如何创建用于向日历添加条目的链接？

Question

我正在为这家夜总会工作,目前正在为他们建立一个网站,他们有很多活动,他们的网站围绕各种活动建立了很多,今天他们为每个活动制作了一个facebook活动,但是拥有一个"添加到我的日历"按钮,将其添加到您的iCal或Google日历(甚至可能是Outlook).

我已经设法弄清楚如何制作日历源,但随后它将被添加为新的日历,唯一的好处是人们可以"订阅事件"但是每个事件都有一个日历是非常混乱的.所以我想知道如何实现一个功能,让他们轻松地将它添加到他们的主日历.想想像mailto:链接,但是如果可能的话,可以用于日历.

此外,如果有人知道是否可以自动将Facebook中的事件导入WordPress或将事件从WordPress导出到Facebook,那将是很好的,但这并不是那么重要.

Answer 1

戴夫的帖子中的链接很棒.只是将关于谷歌链接的一些技术细节放到SO上的答案:

Google日历链接

<a href="http://www.google.com/calendar/event?action=TEMPLATE&text=Example%20Event&dates=20131124T010000Z/20131124T020000Z&details=Event%20Details%20Here&location=123%20Main%20St%2C%20Example%2C%20NY">Add to gCal</a>

参数是:

• action = TEMPLATE(必填)
• text(url编码的事件名称)
• 日期(ISO日期格式,开始日期/结束日期 - 必须同时具有开始和结束时间 - 按钮生成器将允许您将结束时间留空,但您必须有一个或它不起作用.)
  • 使用用户的时区:20131208T160000/20131208T180000
  • 使用全球时间,转换为UTC,然后使用20131208T160000Z/20131208T180000Z
  • 全天活动,您可以使用20131208/20131209 - 请注意按钮生成器出错了.您必须使用以下日期作为一天全天活动的结束日期,或者您希望结束日期的+1天.
• 详细信息(网址编码事件描述/详细信息)
• location(url编码事件的位置 - 确保它是一个地址谷歌地图可以轻松阅读)

2018年2月更新:

这是一个新的链接结构,似乎支持谷歌日历的新谷歌版本,无需API交互:

https://calendar.google.com/calendar/r/eventedit?text=My+Custom+Event&dates=20180512T230000Z/20180513T030000Z&details=For+details,+link+here:+https://example.com/tickets-43251101208&location=Garage+Boston+-+20+Linden+Street+-+Allston,+MA+02134

新的基本网址: https://calendar.google.com/calendar/r/eventedit

新参数:

• 文字(活动名称)
• 日期(ISO日期格式,startdate/enddate - 必须同时包含开始和结束时间)
  • 具有开始/结束时间的事件:20131208T160000/20131208T180000
  • 全天活动,您可以使用20131208/20131209 - 结束日期必须是+1天,无论您希望结束日期是什么.
• ctz(美国/ New_York等时区 - 留空以使用用户的默认时区.强烈建议在几乎所有情况下都包括此内容.例如,提醒视频会议:如果不同时区的三个人点击此链接并设置了星期二上午10点提醒他们"自己",这不会很好.)
• 详细信息(网址编码事件描述/详细信息)
• location(url编码事件的位置 - 确保它是一个地址谷歌地图可以轻松阅读)

笔记:

• 上面的旧网址结构现在重定向到这里
• 支持https
• 更好地处理时区
• 接受+空间除了%20(urlencodevs rawurlencode在php - 两个工作)

Answer 2

更新(免费供个人使用):
HTTPS现在支持

虽然我在下面详细说明每项服务的操作方法,但IMO现在可以更轻松地使用像AddThisEvent这样的第三方[https://addthisevent.com].它允许您自定义许多选项以及添加到Facebook等. 不幸的是,他们现在已经将它作为个人使用以外的任何其他服务而付费服务,并强制执行此操作.

我假设还有其他类似的第三方解决方案,但我只能说这个,到目前为止它对我们来说很有用.

对于" 添加到我的Google日历 ",他们曾经使用过您可以使用的代码生成器表单,但此后又将其删除了.有关Google日历链接的更多详细信息,请参阅下面的squarecandy的答案.

对于Outlook,这是一个更复杂的BIT,但基本上你需要创建一个.vcs包含事件数据的文件,并只需要链接到该文件. 这里有逐步说明.

对于iCal链接,您可以使用类似这样的PHP类,或者按照此页面的说明创建ics文件(iCal文件).

Answer 3

要添加到squarecandy的谷歌日历贡献,这里是全新的

OUTLOOK CALENDAR格式(无需创建.ics)!!

<a href="https://bay02.calendar.live.com/calendar/calendar.aspx?rru=addevent&dtstart=20151119T140000Z&dtend=20151119T160000Z&summary=Summary+of+the+event&location=Location+of+the+event&description=example+text.&allday=false&uid=">add to Outlook calendar</a>

测试一下

最好的方法是对摘要,位置和描述变量的值进行url_encode.

为了知识,

YAHOO CALENDAR格式

<a href="https://calendar.yahoo.com/?v=60&view=d&type=20&title=Summary+of+the+event&st=20151119T090000&et=20151119T110000&desc=example+text.%0A%0AThis+is+the+text+entered+in+the+event+description+field.&in_loc=Location+of+the+event&uid=">add to Yahoo calendar</a>

测试一下

在没有第三方的情况下进行此操作具有很多优势,例如在电子邮件中使用它.

Answer 4

这是一个添加到日历服务,用于添加事件

1. Apple日历
2. Google日历
3. 外表
4. Outlook在线
5. 雅虎 日历

网站和日历上的事件的" 添加到日历 "按钮易于安装,与语言无关,时区和DST兼容.它适用于所有现代浏览器,平板电脑和移动设备,以及Apple Calendar,Google Calendar,Outlook,Outlook.com和Yahoo Calendar.

<div title="Add to Calendar" class="addeventatc">
    Add to Calendar
    <span class="start">03/01/2018 08:00 AM</span>
    <span class="end">03/01/2018 10:00 AM</span>
    <span class="timezone">America/Los_Angeles</span>
    <span class="title">Summary of the event</span>
    <span class="description">Description of the event</span>
    <span class="location">Location of the event</span>
</div>