如何在您的网站上嵌入Google日历


您是否需要网站上具有专业外观的实时日历,以使访问者了解即将发生的事件或安排约会?与其从头开始构建某些内容,或使用某些可能无法获得未来更新的自定义日历应用程序,何不使用每天数百万其他用户正在使用的内容?

按照该路线,您可以在您的网站上嵌入Google日历 。它也是免费且易于使用的。您只需要一个Google帐户即可开始使用。

通过登录您的Google帐户开始,单击个人资料图片旁边的应用程序网格,然后单击日历

获取嵌入代码

通过单击要嵌入的日历旁边的三个点来打开选项。

从弹出窗口中单击设置和共享

向下滚动“日历”设置页面,直到找到集成日历部分。

要将日历显示给所有人(不仅是共享日历的人),还需要 公开

为此,请在访问权限下的公开使用旁边的框。

嵌入代码插入网页或帖子的HTML部分。例如,如果您使用的是WordPress,则创建一个新页面。

单击文本以切换到HTML编辑器。从您的Google日历复制嵌入代码,然后将其粘贴到页面中。

单击Visual标签以查看日历在页面上的外观。您还可以选择预览以在网站的前端看到它。

将Calendar HTML代码粘贴到允许嵌入对象的任何网页中。

如果您喜欢Google日历的默认格式设置,那就很好了。要更改日历的颜色,大小和其他选项,您可以自定义其设置。

自定义Google日历设置

点击位于嵌入代码正下方的自定义按钮。这将打开一个新窗口。

通过在日历标题下输入标题来编辑或添加标题。如果要显示标题,请启用标题旁边的框。

通过检查显示

  • 标题
  • 导航按钮
  • 数据
  • 打印图标
  • 标签
  • 日历列表
  • 时区
  • Google日历的默认大小为800 x 600。通过将WidthHeight旁边的向上和向下箭头移动来调整大小。

    例如,如果要在侧边栏中嵌入日历,请缩小宽度,以较小的尺寸表示,例如300。

    其他您可以自定义的内容包括:

    • 背景色以匹配您的品牌颜色
    • 时区和语言
    • 边框(打开或关闭)
    • 默认月份
    • 一周的第一天
    • 自定义选项后,请在网页上查看最终的实时日历。当您更改日历上的事件时,事件将自动更新。

      下面是每月视图的屏幕截图。

      您还可以按周查看日历。

      如果要进行任何更改,可以随时返回到Google日历设置并进行调整。.

      请务必复制并粘贴新的HTML进行任何格式更新以反映新更改后的代码。

      如何让访问者保存日历事件

      使访问者可以将事件保存到他们的拥有自己的Google日历,请向您的网站添加一个按钮。确保您的日历是公开的。

      打开您的Google日历。请注意,只能通过计算机而非移动应用程序进行更改。

      要添加事件,请选择要添加事件的日期,然后在菜单栏中单击创建

      在弹出窗口中填写事件的详细信息,然后单击保存

      到在您的日历中打开一个事件,双击它。然后点击右上角的三个点以打开选项,然后选择发布事件

      从您网站的弹出窗口中嵌入HTML代码,以使访问者可以将事件添加到他们自己的Google日历中。

      返回您的网站并粘贴您希望事件按钮显示在源代码或HTML视图中的代码。

      当访问者单击Google日历按钮时,它将打开其日历并将事件添加到其中。您还可以使用在同一弹出窗口中显示的链接邀请人们参加活动。

      使用插件将Google日历嵌入WordPress

      与大多数功能一样在WordPress中,有一个插件。将Google日历嵌入WordPress网站也不例外。以下是供您考虑使用的几个WordPress插件。

      简单日历插件

      简单日历按周,月或列表显示事件。易于设置,响应移动并可以根据您的需求进行自定义。

      其他功能包括:

      • 在Google中管理事件并在其中自动更新WordPress
      • 颜色代码事件
      • 直观且直接配置
      • 具有 附加组件
      • 该插件是Google Calendar高级用户的绝佳选择。一项独特的功能是能够传输颜色编码的事件。

        Dan’s Embedder for Google日历

        使用Dan's Embedder for Google Calendar以列表或完整视图显示Google日历。 。

        无需在WordPress中管理或导入事件。您只需要一个或多个公共Google日历。其他功能包括:

        • 使用短代码配置选项
        • 指定要显示的项目数量
        • 嵌入多个日历
        • 此插件需要API密钥。请按照以下步骤操作:

          • 访问Google Developers Console
          • 从侧面菜单中,检查API和身份验证>凭据
          • 点击“公共API访问”部分的创建新密钥按钮
          • 选择浏览器密钥,并保留“引荐来源网址限制”为空
          • 将此键放在插件设置页面上
          • 活动日历WD

            创建一个事件推广,并使用事件日历WD管理事件或将事件添加到WordPress博客。

            使用WordPress编辑器提供事件的详细说明,附加标签,并为每个类别分配类别。其他一些功能包括:

            • 友好的用户界面,可完全控制您在网站上显示日历和事件的方式
            • 轻松自定义和管理日历
            • 无限数量的日历和事件
            • 优化每个事件以提高SEO和搜索引擎的可见性
            • 启用社交共享按钮来传播有关事件的信息
            • WP简单预订日历

              快速轻松地在您的网站上安装和嵌入Google日历。

              免费版WP Simple Booking Calendar可让您访问基本功能需要诸如跟踪您的事件。免费版本的亮点包括:

              • 响应式布局
              • 备份和还原数据和日历
              • 显示您的可用性
              • 要获得更高级的发布和编辑功能,您可以升级到高级版。

                希望在其网站上管理和显示其服务可用性或宣布即将发生的事件的用户将从嵌入中受益匪浅

                直接在您的网站上集成日历将使访问者留在您的网站上,并增加他们进行约会或注册活动的机会。

                您只需要一个互联网连接,一个网络浏览器和一个Google帐户,即可在您的网站上创建并显示具有专业外观的日历。

                相关文章:


                2.05.2020