如何创建一个向日历添加条目的链接?

时间：2021-01-03 01:28:05

I'm working for this nightclub and are currently making a website for them, they've got lots events and their site is built a lot around events, today they make an facebook event of every event but it would be killer to have a "Add to my Calendar" button which added it to your iCal or Google Calendar (or maybe even Outlook).

我为这个夜总会工作,目前正在做一个网站对他们来说,他们得到了很多事件和他们的网站是建立在事件,今天他们做一个facebook将杀手事件的每一个事件,但有一个“添加到我的日历”按钮添加到您的iCal或者谷歌日历(或者甚至前景)。

I've managed to figure out how to make an calendar feed but then it will be added as a new calendar, only good thing is that people can "subscribe to events" but it's quite messy to have an calendar for every event. So I would like to know how to implement a function which lets them add it to their main calendar easily. Think like a mailto: link but for calendars if that's possible.

我已经设法弄明白了如何制作一个日历提要，但是它将被添加为一个新的日历，唯一的好处是人们可以“订阅事件”，但是为每个事件设置一个日历是很麻烦的。因此，我想知道如何实现一个函数，让他们可以轻松地将其添加到主日历中。像mailto: link一样思考，但如果可能的话，可以用日历。

Also while I'm at the subject if anyone know if it's possible to automatically import an event from Facebook to WordPress or export an event from WordPress to Facebook that would be great, but that's not so important.

另外，当我谈到这个话题时，如果有人知道是否有可能自动地从Facebook导入事件到WordPress或者从WordPress导出事件到Facebook，那将是很好的，但这并不重要。

7 个解决方案

#1

37  

UPDATE (free for personal use):

更新(免费供个人使用):

While my answer below detailing how-to for each service WILL work, IMO it's much easier now to go with a third-party like AddThisEvent [http://addthisevent.com]. It lets you customize lots of options as well as add to Facebook and more. Unfortunately, they've now made it a paid service for anything other than personal use and do enforce this.

尽管我在下面给出的答案中详细介绍了每种服务的操作方法，但在我看来，现在更容易选择第三方，比如AddThisEvent [http://addthisevent.com]。它可以让你定制很多选项，也可以添加到Facebook等等。不幸的是，他们现在已经把它变成了一种付费服务，除了个人用途以外的其他用途。

In order to use them via SSL:

为了通过SSL使用:

HTTPS is not supported. However I recommand that you download this package for local usage and upload it to your own server.

不支持HTTPS。但是我建议您下载这个包以供本地使用，并将其上载到您自己的服务器上。

I assume there are other third-party solutions like this one, but I can only speak to this one, and it has worked great for us so far.

我认为还有其他第三方解决方案，比如这个，但我只能说这个，到目前为止，它对我们来说非常有用。

For an "Add to my Google Calendar", they used to have a code generator form you could use, but have since taken it down. For more details on Google Calendar links, see squarecandy's answer below.

对于“添加到我的谷歌日历”，他们曾经有一个可以使用的代码生成器表单，但是之后就把它删除了。有关谷歌日历链接的详细信息，请参见squarecandy下面的答案。

For Outlook, it's a BIT more complicated, but basically you need to create a .vcs file with the event's data, and just make a link to that file. Step-by-step instructions here.

对于Outlook来说，这有点复杂，但基本上你需要用事件的数据创建一个.vcs文件，并创建到该文件的链接。一步一步的指示。

For an iCal link, you could use a PHP class like this one, or follow this page's instructions on how to create an ics file (iCal file).

对于一个iCal链接，您可以使用像这样的PHP类，或者按照这个页面的说明来创建一个ics文件(iCal文件)。

#2

40  

The links in Dave's post are great. Just to put a few technical details about the google links into an answer here on SO:

Dave的帖子里的链接非常棒。在这里，我简单介绍一下谷歌链接的一些技术细节:

Google Calendar Link

谷歌日历的链接

<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>

< a href = " http://www.google.com/calendar/event?action =模板文本= % 20例子事件日期= 20131124 t010000z / 20131124 t020000z&details =事件% 20细节% 20 here&location = 123% 20主要% 20 % 2 c % 20例% 2 c % 20纽约" >添加到谷歌日历< / >

the parameters being:

的参数:

  • action=TEMPLATE (required)
  • action =模板(必需)
  • text (url encoded name of the event)
  • 文本(url编码的事件名称)
  • dates (ISO date format, startdate/enddate - must have both start and end time - the button generator will let you leave the endtime blank, but you must have one or it won't work.)
    • to use the user's timezone: 20131208T160000/20131208T180000
    • 使用用户时区:20131208t16000020131208t180000
    • to use global time, convert to UTC, then use 20131208T160000Z/20131208T180000Z
    • 要使用全局时间，转换为UTC，然后使用20131208T160000Z/20131208T180000Z
    • all day events, you can use 20131208/20131209 - note that the button generator gets it wrong. You must use the following date as the end date for a one day all day event, or +1 day to whatever you want the end date to be.
    • 所有的日常事件，您都可以使用20131208/20131209—注意按钮生成器出错了。您必须使用以下日期作为一天的活动的结束日期，或+1天到任何您想要的结束日期。
  • 日期(ISO日期格式,startdate可以/ enddate -必须有开始和结束时间按钮生成器会让你离开endtime空白,但是你必须有一个或行不通的。)使用用户的时区:20131208 t160000/20131208t180000使用全球时间,转换为UTC,然后使用20131208 t160000z / 20131208 t180000z整天事件,您可以使用20131208/20131209——注意按钮发电机都错了。您必须使用以下日期作为一天的活动的结束日期，或+1天到任何您想要的结束日期。
  • details (url encoded event description/details)
  • 详细信息(url编码事件描述/详细信息)
  • location (url encoded location of the event - make sure it's an address google maps can read easily)
  • 位置(url编码事件的位置——确保它是一个地址谷歌映射可以轻松读取)

Update Feb 2018:

Here's a new link structure that seems to support the new google version of google calendar w/o requiring API interaction:

这里有一个新的链接结构，似乎支持新的谷歌版本的谷歌日历w/o，需要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?text=My +定制+事件日期= 20180512 t230000z / 20180512 t030000z&details = +细节+链接+:+ https://example.com/tickets - 43251101208 -波士顿&location=garage + + - + 20 +林登街+ + +包括沃斯顿,马+ + 02134

New base url: https://calendar.google.com/calendar/r/eventedit

新基地的url:https://calendar.google.com/calendar/r/eventedit

New parameters:

新的参数:

  • text (name of the event)
  • 文本(事件名称)
  • dates (ISO date format, startdate/enddate - must have both start and end time)
    • an event w/ start/end times: 20131208T160000/20131208T180000
    • 活动时间:20131208t16000020131208t180000
    • all day events, you can use 20131208/20131209 - end date must be +1 day to whatever you want the end date to be.
    • 所有的日常活动，你可以使用20131208 . 20131209 -结束日期必须是+1天，不管你希望结束日期是什么。
  • 日期(ISO日期格式，startdate/enddate -必须同时具有开始和结束时间)事件w/开始/结束时间:20131208t16000020131208t180000全天事件，您可以使用201312082013120312031203120312031203120312031209 -结束日期必须是+1天，不管您希望结束日期是什么。
  • ctz (timezone such as America/New_York - leave blank to use the user's default timezone. Highly recommended to include this in almost all situations. For example, a reminder for a video conference: if three people in different timezones clicked this link and set a reminder for their "own" Tuesday at 10:00am, this would not work out well.)
  • ctz(时区，例如America/New_York)——为使用用户的默认时区留下空白。强烈建议在几乎所有的情况下都包括这一点。例如，一个视频会议的提醒:如果三个来自不同时区的人点击了这个链接，并在上午10点为他们自己的“自己的”周二设置了一个提醒，这将不会有很好的效果。
  • details (url encoded event description/details)
  • 详细信息(url编码事件描述/详细信息)
  • location (url encoded location of the event - make sure it's an address google maps can read easily)
  • 位置(url编码事件的位置——确保它是一个地址谷歌映射可以轻松读取)

Notes:

注:

  • the old url structure above now redirects here
  • 上面的旧url结构现在在这里重定向
  • supports https
  • 支持https
  • deals w/ timezones better
  • 交易w /时区更好
  • accepts + for space in addition to %20 (urlencode vs rawurlencode in php - both work)
  • 除了%20外，还接受+ for空间(urlencode vs rawurlencode in php -都可以)

#3

8  

Here's an Add to Calendar service to serve the purpose for adding an event on

这里有一个添加到日历的服务，用于添加事件

  1. Apple Calendar
  2. 苹果的日历
  3. Google Calendar
  4. 谷歌日历
  5. Outlook
  6. 前景
  7. Outlook Online
  8. 前景的在线
  9. Yahoo! Calendar
  10. 雅虎日历

The "Add to Calendar" button for events on websites and calendars is easy to install, language independent, time zone and DST compatible. It works perfectly in all modern browsers, tablets and mobile devices, and with Apple Calendar, Google Calendar, Outlook, Outlook.com and Yahoo Calendar.

在网站和日历上的事件“添加到日历”按钮很容易安装，语言独立，时区和DST兼容。它在所有的现代浏览器、平板电脑和移动设备上都能完美运行，它还能与苹果日历、谷歌日历、Outlook、Outlook.com和雅虎日历兼容。

<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>

如何创建一个向日历添加条目的链接?

#4

5  

To add to squarecandy's google calendar contribution, here the brand new

为了增加squarecandy对谷歌日历的贡献，这里有一个全新的版本

OUTLOOK CALENDAR format (Without a need to create .ics) !!

OUTLOOK日历格式(不需要创建。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>

test it

测试它

Best would be to url_encode the summary, location and description variable's values.

最好是url_encode摘要、位置和描述变量的值。

For the sake of knowledge,

为了知识，

YAHOO CALENDAR format

雅虎日历格式

<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>

test it

测试它

Doing it without a third party holds a lot of advantages for example using it in emails.

在没有第三方的情况下这样做有很多好处，例如在电子邮件中使用它。

#5

1  

You can have the program create an .ics (iCal) version of the calendar and then you can import this .ics into whichever calendar program you'd like: Google, Outlook, etc.

您可以让程序创建一个.ics (iCal)版本的日历，然后您可以将这个.ics导入到您想要的任何日历程序:谷歌、Outlook等。

I know this post is quite old, so I won't bother inputting any code. But please comment on this if you'd like me to provide an outline of how to do this.

我知道这篇文章很老，所以我不会写任何代码。但是如果你希望我提供一个如何做这个的提纲，请评论一下。

#6

1  

If you are looking for something really simple you can user this widget http://addthisevent.com/. It works really well and simple to implement. I know this is old but just if someone is looking.

如果您正在寻找一些非常简单的东西，您可以使用这个小部件http://addthisevent.com/。它工作得很好，实现起来也很简单。我知道这是旧的，但如果有人在看的话。

#7

0  

The advantage of a subscription to your events calendar, as you say, is that you can change the dates/times/info and they should be reflected across your subscribers. Why are you creating a separate calendar for each event instead of one?

正如您所说，订阅事件日历的好处是，您可以更改日期/时间/信息，它们应该在您的订阅者中反映出来。为什么要为每个事件创建一个单独的日历而不是一个?

Are you familiar with the APIs for Google Calendar and Facebook?

你熟悉谷歌日历和Facebook的api吗?

As for the last question, are you intending on maintaining two separate events feeds on Wordpress and Facebook? You could have Wordpress grabbing the feed from Facebook. Maybe some sort of Events CMS that publishes to Facebook then updates the Wordpress feed?

至于最后一个问题，你打算在Wordpress和Facebook上维护两个独立的事件源吗?你可以让Wordpress从Facebook上获取提要。也许CMS发布到Facebook上的事件会更新Wordpress的feed?

#1

37  

UPDATE (free for personal use):

更新(免费供个人使用):

While my answer below detailing how-to for each service WILL work, IMO it's much easier now to go with a third-party like AddThisEvent [http://addthisevent.com]. It lets you customize lots of options as well as add to Facebook and more. Unfortunately, they've now made it a paid service for anything other than personal use and do enforce this.

尽管我在下面给出的答案中详细介绍了每种服务的操作方法，但在我看来，现在更容易选择第三方，比如AddThisEvent [http://addthisevent.com]。它可以让你定制很多选项，也可以添加到Facebook等等。不幸的是，他们现在已经把它变成了一种付费服务，除了个人用途以外的其他用途。

In order to use them via SSL:

为了通过SSL使用:

HTTPS is not supported. However I recommand that you download this package for local usage and upload it to your own server.

不支持HTTPS。但是我建议您下载这个包以供本地使用，并将其上载到您自己的服务器上。

I assume there are other third-party solutions like this one, but I can only speak to this one, and it has worked great for us so far.

我认为还有其他第三方解决方案，比如这个，但我只能说这个，到目前为止，它对我们来说非常有用。

For an "Add to my Google Calendar", they used to have a code generator form you could use, but have since taken it down. For more details on Google Calendar links, see squarecandy's answer below.

对于“添加到我的谷歌日历”，他们曾经有一个可以使用的代码生成器表单，但是之后就把它删除了。有关谷歌日历链接的详细信息，请参见squarecandy下面的答案。

For Outlook, it's a BIT more complicated, but basically you need to create a .vcs file with the event's data, and just make a link to that file. Step-by-step instructions here.

对于Outlook来说，这有点复杂，但基本上你需要用事件的数据创建一个.vcs文件，并创建到该文件的链接。一步一步的指示。

For an iCal link, you could use a PHP class like this one, or follow this page's instructions on how to create an ics file (iCal file).

对于一个iCal链接，您可以使用像这样的PHP类，或者按照这个页面的说明来创建一个ics文件(iCal文件)。

#2

40  

The links in Dave's post are great. Just to put a few technical details about the google links into an answer here on SO:

Dave的帖子里的链接非常棒。在这里，我简单介绍一下谷歌链接的一些技术细节:

Google Calendar Link

谷歌日历的链接

<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>

< a href = " http://www.google.com/calendar/event?action =模板文本= % 20例子事件日期= 20131124 t010000z / 20131124 t020000z&details =事件% 20细节% 20 here&location = 123% 20主要% 20 % 2 c % 20例% 2 c % 20纽约" >添加到谷歌日历< / >

the parameters being:

的参数:

  • action=TEMPLATE (required)
  • action =模板(必需)
  • text (url encoded name of the event)
  • 文本(url编码的事件名称)
  • dates (ISO date format, startdate/enddate - must have both start and end time - the button generator will let you leave the endtime blank, but you must have one or it won't work.)
    • to use the user's timezone: 20131208T160000/20131208T180000
    • 使用用户时区:20131208t16000020131208t180000
    • to use global time, convert to UTC, then use 20131208T160000Z/20131208T180000Z
    • 要使用全局时间，转换为UTC，然后使用20131208T160000Z/20131208T180000Z
    • all day events, you can use 20131208/20131209 - note that the button generator gets it wrong. You must use the following date as the end date for a one day all day event, or +1 day to whatever you want the end date to be.
    • 所有的日常事件，您都可以使用20131208/20131209—注意按钮生成器出错了。您必须使用以下日期作为一天的活动的结束日期，或+1天到任何您想要的结束日期。
  • 日期(ISO日期格式,startdate可以/ enddate -必须有开始和结束时间按钮生成器会让你离开endtime空白,但是你必须有一个或行不通的。)使用用户的时区:20131208 t160000/20131208t180000使用全球时间,转换为UTC,然后使用20131208 t160000z / 20131208 t180000z整天事件,您可以使用20131208/20131209——注意按钮发电机都错了。您必须使用以下日期作为一天的活动的结束日期，或+1天到任何您想要的结束日期。
  • details (url encoded event description/details)
  • 详细信息(url编码事件描述/详细信息)
  • location (url encoded location of the event - make sure it's an address google maps can read easily)
  • 位置(url编码事件的位置——确保它是一个地址谷歌映射可以轻松读取)

Update Feb 2018:

Here's a new link structure that seems to support the new google version of google calendar w/o requiring API interaction:

这里有一个新的链接结构，似乎支持新的谷歌版本的谷歌日历w/o，需要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?text=My +定制+事件日期= 20180512 t230000z / 20180512 t030000z&details = +细节+链接+:+ https://example.com/tickets - 43251101208 -波士顿&location=garage + + - + 20 +林登街+ + +包括沃斯顿,马+ + 02134

New base url: https://calendar.google.com/calendar/r/eventedit

新基地的url:https://calendar.google.com/calendar/r/eventedit

New parameters:

新的参数:

  • text (name of the event)
  • 文本(事件名称)
  • dates (ISO date format, startdate/enddate - must have both start and end time)
    • an event w/ start/end times: 20131208T160000/20131208T180000
    • 活动时间:20131208t16000020131208t180000
    • all day events, you can use 20131208/20131209 - end date must be +1 day to whatever you want the end date to be.
    • 所有的日常活动，你可以使用20131208 . 20131209 -结束日期必须是+1天，不管你希望结束日期是什么。
  • 日期(ISO日期格式，startdate/enddate -必须同时具有开始和结束时间)事件w/开始/结束时间:20131208t16000020131208t180000全天事件，您可以使用201312082013120312031203120312031203120312031209 -结束日期必须是+1天，不管您希望结束日期是什么。
  • ctz (timezone such as America/New_York - leave blank to use the user's default timezone. Highly recommended to include this in almost all situations. For example, a reminder for a video conference: if three people in different timezones clicked this link and set a reminder for their "own" Tuesday at 10:00am, this would not work out well.)
  • ctz(时区，例如America/New_York)——为使用用户的默认时区留下空白。强烈建议在几乎所有的情况下都包括这一点。例如，一个视频会议的提醒:如果三个来自不同时区的人点击了这个链接，并在上午10点为他们自己的“自己的”周二设置了一个提醒，这将不会有很好的效果。
  • details (url encoded event description/details)
  • 详细信息(url编码事件描述/详细信息)
  • location (url encoded location of the event - make sure it's an address google maps can read easily)
  • 位置(url编码事件的位置——确保它是一个地址谷歌映射可以轻松读取)

Notes:

注:

  • the old url structure above now redirects here
  • 上面的旧url结构现在在这里重定向
  • supports https
  • 支持https
  • deals w/ timezones better
  • 交易w /时区更好
  • accepts + for space in addition to %20 (urlencode vs rawurlencode in php - both work)
  • 除了%20外，还接受+ for空间(urlencode vs rawurlencode in php -都可以)

#3

8  

Here's an Add to Calendar service to serve the purpose for adding an event on

这里有一个添加到日历的服务，用于添加事件

  1. Apple Calendar
  2. 苹果的日历
  3. Google Calendar
  4. 谷歌日历
  5. Outlook
  6. 前景
  7. Outlook Online
  8. 前景的在线
  9. Yahoo! Calendar
  10. 雅虎日历

The "Add to Calendar" button for events on websites and calendars is easy to install, language independent, time zone and DST compatible. It works perfectly in all modern browsers, tablets and mobile devices, and with Apple Calendar, Google Calendar, Outlook, Outlook.com and Yahoo Calendar.

在网站和日历上的事件“添加到日历”按钮很容易安装，语言独立，时区和DST兼容。它在所有的现代浏览器、平板电脑和移动设备上都能完美运行，它还能与苹果日历、谷歌日历、Outlook、Outlook.com和雅虎日历兼容。

<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>

如何创建一个向日历添加条目的链接?

#4

5  

To add to squarecandy's google calendar contribution, here the brand new

为了增加squarecandy对谷歌日历的贡献，这里有一个全新的版本

OUTLOOK CALENDAR format (Without a need to create .ics) !!

OUTLOOK日历格式(不需要创建。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>

test it

测试它

Best would be to url_encode the summary, location and description variable's values.

最好是url_encode摘要、位置和描述变量的值。

For the sake of knowledge,

为了知识，

YAHOO CALENDAR format

雅虎日历格式

<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>

test it

测试它

Doing it without a third party holds a lot of advantages for example using it in emails.

在没有第三方的情况下这样做有很多好处，例如在电子邮件中使用它。

#5

1  

You can have the program create an .ics (iCal) version of the calendar and then you can import this .ics into whichever calendar program you'd like: Google, Outlook, etc.

您可以让程序创建一个.ics (iCal)版本的日历，然后您可以将这个.ics导入到您想要的任何日历程序:谷歌、Outlook等。

I know this post is quite old, so I won't bother inputting any code. But please comment on this if you'd like me to provide an outline of how to do this.

我知道这篇文章很老，所以我不会写任何代码。但是如果你希望我提供一个如何做这个的提纲，请评论一下。

#6

1  

If you are looking for something really simple you can user this widget http://addthisevent.com/. It works really well and simple to implement. I know this is old but just if someone is looking.

如果您正在寻找一些非常简单的东西，您可以使用这个小部件http://addthisevent.com/。它工作得很好，实现起来也很简单。我知道这是旧的，但如果有人在看的话。

#7

0  

The advantage of a subscription to your events calendar, as you say, is that you can change the dates/times/info and they should be reflected across your subscribers. Why are you creating a separate calendar for each event instead of one?

正如您所说，订阅事件日历的好处是，您可以更改日期/时间/信息，它们应该在您的订阅者中反映出来。为什么要为每个事件创建一个单独的日历而不是一个?

Are you familiar with the APIs for Google Calendar and Facebook?

你熟悉谷歌日历和Facebook的api吗?

As for the last question, are you intending on maintaining two separate events feeds on Wordpress and Facebook? You could have Wordpress grabbing the feed from Facebook. Maybe some sort of Events CMS that publishes to Facebook then updates the Wordpress feed?

至于最后一个问题，你打算在Wordpress和Facebook上维护两个独立的事件源吗?你可以让Wordpress从Facebook上获取提要。也许CMS发布到Facebook上的事件会更新Wordpress的feed?

标签：

相关文章