4在HTML中添加可点击的电话链接的步骤

在你的网站上显示一个电话号码可以帮助增加对你的业务的信任，吸引潜在的客户，并取悦现有的客户。

为了让用户尽可能容易地与您或您团队中的其他人取得联系，您可以设置可点击的电话号码超文本标记语言．考虑到手机用户，这是一个很棒的UX策略大约占全球网络流量的一半．这意味着，超过一半的网站访问者将使用相同的设备在线查找您的业务和拨打电话。

在这篇文章中，我们将介绍创建HTML电话链接或“点击呼叫”链接的过程。

1.创建一个锚元素。

首先，创建一个带有空href属性的锚元素。它看起来像这样:

< a href = " " > < / >

2.在href属性中输入您的电话号码。

将电话号码放在起始标记的href属性内。这超文本引用属性确保超链接是有效的。它看起来像这样:

< a href = " 6031112298 " > < / >

3.在引号内的数字前面加上tel:。

现在在href属性中，在电话号码之前添加tel:。电话号码和电话号码都应该在引号内，没有空格或破折号。它看起来像这样:

< a href = "电话号码:6031112298 " > < / >

4.在锚元素中包含文本。

可以在锚元素中包含文本。尽管这不是必需的，但它可以让用户更清楚地看到行动号召。这里是代码并排显示在用户面前的网站前端。

看到这支笔如何用HTML链接一个电话号码[与链接文本]HubSpot的(@hubspot)CodePen．

如果您想包含电话号码，并使其成为唯一链接的文本，那么将电话号码包装在锚元素中，并将其放在段落标记中。它看起来像这样:

看到这支笔如何在HTML中链接一个电话号码[与文本]HubSpot的(@hubspot)CodePen．

如何链接一个电话号码在HTML扩展

如果你想让点击的电话号码有一个扩展，那么你需要采取额外的步骤。

• 创建一个锚元素。
• 在href属性中输入tel:和电话号码。
• 现在，在电话号码后面加上字母“p”和分机号码。它看起来像这样:

< a href = "电话号码:6031112298 p000 " > < / >

当点击这个“点击呼叫”链接时，用户将听到拨号的号码，然后是一秒钟的暂停，然后是分机拨号。

如何在HTML中连接电话号码与国家代码

如果您希望使其可点击的电话号码具有国家代码，那么您将需要采取不同的附加步骤。

• 创建一个锚元素。
• 在href属性中输入tel:和电话号码。
• 现在，在电话号码之前添加加号图标(+)和国家代码。它看起来像这样:

< a href = "电话:+ 16031112298 p000 " > < / >

如何添加一个HTML电话链接到您的网站

一个HTML电话链接，或“点击呼叫”链接，可以包括在您的网站的各个部分。你的联系页面和页眉或页脚是最常见的。让我们看一个例子，包括这些可点击的链接WordPress的网站．

联系页面

将HTML电话链接添加到联系人页面的具体步骤取决于您使用的平台和模板。以下是一般流程。

• 首先，选择预先设计的联系人页面模板。
• 然后单击带有示例电话号码的块。
• 点击三个点图标。
• 点击编辑作为HTML．

• 用锚元素替换现有的电话号码:(603)111-2298

• 点击保存草稿和预览．

页眉和页脚

将HTML电话链接添加到页眉或页脚的具体步骤取决于您使用的平台和模板。以下是一般流程。

• 在仪表板中，单击外观>小部件．

• 在标签为“Footer”的部分中，添加您想要的任何块。为了演示，我将只添加一个段落块。

• 当你准备好了，点击更新．
• 现在转到你的页面。
• 向下滚动到页脚区域并单击段落块。

• 添加你的电话号码，然后点击三个点图标。
• 点击编辑作为HTML．

• 将电话号码包装在一个锚元素中，并将href="tel:6031112298"添加到开始标记。

• 点击保存草稿和预览．

如何样式一个HTML电话链接

要设计HTML电话链接的样式，您必须这样做添加一些自定义CSS．

例如，假设您希望电话号码显示为粗体、橙色和无下划线。以下是CSS和如何“点击调用”链接将出现在前端:

看到这支笔如何样式一个HTML电话链接HubSpot的(@hubspot)CodePen．

如何将CSS添加到你的网站取决于你使用的平台。例如，如果在WordPress中构建站点，你可以将这个CSS添加到WordPress定制器的附加CSS选项卡中。

添加“点击呼叫”链接到您的网站

在你的网站上显示一个电话号码可以帮助吸引和取悦潜在的和现有的客户——让他们可以点击对用户体验更好。好消息是，建立电话bob官网官方网站联系很容易。你只需要了解一些HTML和CSS来创建和设置这些链接的样式，并将它们嵌入到网站的不同区域。