在Weebly标题中添加电话文本社交图标和搜索框

Weebly 不提供在网站标题区域显示电话号码、社交图标和搜索框的功能。 大多数 Weebly 主题也不支持此选项。

显示社交图标绝对是获得更好用户体验的好主意。 问题是，只有当您付费订阅时，它才可以添加到 Weebly 界面中。 在这里，我们将解释如何添加它，即使是免费用户。

虽然搜索框仅适用于专业用户。 当您选择任何新主题并导航到 Weebly 站点编辑器顶部的“主题”部分时，您将不会在标题中看到启用或禁用这些元素的选项。

尽管还有其他一些替代方案，例如添加 Google 自定义搜索框等自定义元素，但通过修改源 HTML/CSS 来显示默认 Weebly 标头元素实际上非常容易且快速。

推荐：如何修复Windows 10/11中OneDrive云操作不成功错误

在 Weebly 标题中添加电话文本、社交图标和搜索框

启用主题选项卡下的选项

1 – 在“主题”部分下，点击“编辑 HTML/CSS”选项，然后选择要添加标题元素的首选页面布局。 例如，我们正在修改“no-header.html”页面。

2 – 识别显示徽标的代码，它看起来像这样：

3 – 在徽标代码上方添加以下代码：

<table id=”header”>
<tr>
<td id=”header-right”>
<table>
<tr>
<td class=”phone-number”>{phone:text}</td>
<td class=”social”>{social}</td>
</tr>
<tr>
<td colspan=”2″ class=”search”>{search}</td>
</tr>
</table>
</td>
</tr>
</table>

4-保存更改并检查“主题”部分，您可以在其中看到搜索框、社交图标和电话号码字段已启用。 如果您不是 Weebly 专业用户，请确保禁用搜索框选项。

修改CSS

通过在源 HTML 中添加上述代码，就足以在 Weebly 中启用默认标头元素。 要自定义您刚刚启用的功能，您应该在“电话号码”字段和搜索框中添加以下代码主样式.css”。