Digital Link
免费开始

如何使用 HTML 自定义落地页

使用 HTML 为您的数字链接添加分隔线、行动号召按钮等内容

您可以使用 HTML 编辑器对落地页进行全面自定义。

在您的落地页中添加一个 HTML 编辑器。

HTML 1

点击其三点菜单,然后点击 </> 图标切换到 HTML 视图。

HTML 2

以下是一些可添加内容的示例:

分隔线

您可以在内容之间添加线条或分隔线。

添加以下代码:

<style>.line {border-top: 3px solid #000000;width: 100%;margin: 0;}</style><div class="line"><br></div>

通过 "border-top:" 可以设置线条的高度(以像素为单位)。

通过 "solid #" 可以使用十六进制颜色代码设置其颜色。

HTML 3

拨打电话链接

您可以创建一个链接,让用户直接在设备上发起电话呼叫。

在用于打开电话应用的提示文字(致电我们)上添加带有目标电话号码的 "href" 属性。例如:

<a href="tel:+1234567890">致电我们</a>

将 "+1234567890" 替换为相应的电话号码。"+" 号表示国际拨号代码。

发送电子邮件链接

您可以创建一个链接,让用户直接在设备上向指定地址发送电子邮件。

在用于打开邮件应用的提示文字(发送邮件)上添加带有目标地址的 "href" 属性。例如:

<a href="mailto:abc@example.com">发送邮件</a>

将 "abc@example.com" 替换为相应的电子邮件地址。

发送 WhatsApp 消息链接

您可以创建一个链接,让用户直接在设备上向指定的 WhatsApp 号码发送消息。

在用于打开 WhatsApp 应用的提示文字(通过 WhatsApp 联系我们)上添加带有目标 WhatsApp 号码的 "href" 属性。您还可以选择在 "?text=" 之后添加要发送的消息(这是一条消息)。例如:

<a href="https://wa.me/+1234567890?text=这是一条消息">通过 WhatsApp 联系我们</a>

将 "+1234567890" 替换为相应的 WhatsApp 号码。

跳转到指定位置的链接

您可以创建一个链接,让用户直接跳转到落地页中的指定部分。

  1. 为目标元素(第 1 部分)添加 "id" 属性。建议元素名称与 id(section1)保持一致。例如:
<a id="section1">第 1 部分</a>
  1. 在用于跳转到目标元素的提示文字(前往第 1 部分)上,使用第 1 步中创建的 id(#section1)添加 "href" 属性。例如:
<a href="#section1">前往第 1 部分</a>

嵌入视频

只要 YouTube、Vimeo 等在线视频平台提供嵌入选项("iframe" 标签),您就可以在落地页中展示其视频。复制该标签后,进入您的落地页并粘贴 "iframe" 标签。例如:

<iframe width="560" height="315" src="https://www.youtube.com/embed/VIDEO-URL" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>

嵌入 Google 地图

您可以展示多个 Google 地图:在 Google 地图中搜索地址,点击“分享 > 嵌入地图”,然后复制 "iframe" 标签。之后,进入您的落地页并粘贴 "iframe" 标签。例如:

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1589980.4936041927!2d-79.46503024375001!3d38.89126619999998!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89b7b798ecb5b2c7%3A0xc7edf0c4a86f75af!2sSmithsonian%20National%20Museum%20of%20Natural%20History!5e0!3m2!1sen!2sar!4v1719328865609!5m2!1sen!2sar" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>