海外社媒SNS代运营Tiktok代运营公司
Revive Old Posts

营销型WordPress外贸多语言独立站建设+谷歌SEO优化+谷歌关键字广告投放,就找WP花园!深圳公司,技术实力雄厚,用效果说话!详情咨询info@wordpresshy.com

如果没有菜单和子菜单,WordPress 网站就不会太多。 在 WordPress 中根据自己的喜好自定义这些菜单也很简单。 因此,您的 WordPress 菜单是一个“前线”工具,可用于获得较高的搜索排名并让访问者留在网站上。

WordPress 中的专用屏幕掩盖了您的菜单的复杂程度。 您还可以在站点的多个位置显示菜单。 如果您具备编码技能,则可以使用几乎无限的可能性自定义您的 WordPress 菜单。

在这篇文章中,我们将为您提供创建 WordPress 菜单的深入指南。 我们还将向您展示如何使用该功能并以几种不同的方式增强它。

WordPress 菜单剖析

对于初学者来说,WordPress 菜单通常是一组链接(包括下拉菜单)。 这是一个简单的功能,只是您网站主干中的一个“脊椎”。

WordPress 菜单的示例。

WordPress 菜单的示例。

海外社媒SNS代运营Tiktok代运营公司

我们将在下一节中更详细地介绍您将在网站上看到菜单的位置。 现在,要知道它们可以放在您想要展示的任何地方。 您可能只有几个预先选择的选项(基于小部件区域)。 不过,从技术意义上讲,菜单可以放在任何地方。

当然,WordPress 菜单对于浏览网站至关重要。 如果您有一个清晰明确的导航菜单,这将有助于用户浏览您的网站,并降低跳出率。

它们还有另一个目的:您的菜单有助于您的搜索引擎优化 (SEO)。 为 SEO 优化 WordPress 菜单更多的是关于省略什么而不是你放入什么。首先,你可以去掉元素——比如标签云——并保持你包含的链接数量很少。

虽然 Google 允许您在一个页面上添加多达 250 个链接,但保持较高的“链接价值”至关重要。 因此,从长远来看,减少外部链接的数量将对您有好处。

如果没有菜单和子菜单,WordPress 网站就不会太多 ✨ 在这里了解如何创建自己的 👇点击推文

不同类型的 WordPress 菜单结构

您可能已经了解,根据应用程序的需求,您可以选择不同的 WordPress 菜单结构。

例如,标题菜单是最常见的,因为它们处理主站点导航。 您也经常会在主导航上方看到较小的菜单,因为这是放置社交媒体图标、搜索栏等的绝佳位置。

Kinsta 合作伙伴 SAU/CAL 的网站有一个“fly-in”菜单,其中包括导航和社交链接:

显示两个菜单的飞入式显示器。

显示两个菜单的飞入式显示器。

此菜单显示 WordPress 菜单的用例比导航站点更多。 使用 WordPress 的内置功能(稍后会详细介绍),您几乎可以为您需要的任何内容创建菜单。

与页眉导航一样流行的是页脚。 您将经常使用此区域为向下滚动的用户重复您的主要导航。 此外,它还是为您的产品和服务提供更多基于上下文的链接的绝佳场所:

Kinsta 页脚菜单。

Kinsta 页脚菜单。

如果站点使用它,您还会在侧边栏中看到菜单:

侧边栏导航示例。

侧边栏导航示例。

虽然在许多情况下您不会在这里看到主要导航,但它是社交链接、博客文章档案等的传统位置。

如何创建自定义 WordPress 菜单(3 种方法)

无论您的专业水平如何,创建 WordPress 菜单都是一个严肃的过程。 完成工作的主要方法有以下三种:使用 WordPress 的内置功能; 安装一个合适的插件或让你的手弄脏代码。

接下来,我们将向您展示如何使用所有三种方法创建 WordPress 菜单。

1. 使用 WordPress 的内置功能来创建您的菜单

WordPress 有内置工具来帮助您创建菜单。 WordPress 管理员中的专用屏幕对除最新用户外的所有人来说都很熟悉。

WordPress 菜单屏幕

WordPress 菜单屏幕。

当然,使用本机功能创建 WordPress 菜单有很多好处。 首先,您与您的网站完全兼容。 此外,您可以使用熟悉的界面和本机工具构建菜单。

要到达那里,请前往 外观 > 菜单 WordPress 中的页面:

WordPress 菜单链接。

WordPress 菜单链接。

此屏幕分为几个不同的部分。 在顶部,您会找到选择当前菜单或创建新菜单的选项:

菜单选择下拉菜单。

菜单选择下拉菜单。

如果您决定构建一个新菜单,请为其命名并查看 菜单设置 部分:

菜单设置部分。

“菜单设置”部分。

这里有很多复选框,但您需要做出两个主要决定:

  • 自动将顶级页面添加到菜单中。 这里的“顶级”是指您在 WordPress 中创建的不是其他页面的子页面的页面。 例如,博客文章不是顶级页面,因为在许多情况下它会有一个父存档页面(例如 /博客)。 另一方面,联系页面通常是顶级的,因为它通常没有父页面。
  • 菜单位置。 每个主题都有其菜单位置。 除非您更改主题的核心文件,否则主题开发人员已对这些菜单位置进行了硬编码。 某些主题可能允许您通过其设置自定义它们。

准备好后,单击 创建菜单 按钮。 屏幕将刷新并显示您在新菜单中。 接下来,看看屏幕的左侧:

菜单项手风琴菜单。

菜单项手风琴菜单。

此屏幕列出了您网站上的所有帖子、页面、分类法和其他可链接资产。 您可以通过选中左侧的框来构建菜单,然后单击 添加到菜单 按钮。

这会将它们移动到 菜单 屏幕:

拖放菜单结构部分中的项目。

拖放菜单结构部分中的项目。

在这里,您可以将菜单项拖放到位。 如果单击每个项目旁边的扩展箭头,还可以为菜单项设置标签或将其删除:

展开菜单项。

展开菜单项。

一旦你点击 保存菜单,你可以走了。 但是,如果您展开屏幕顶部的“屏幕选项”菜单,您可以使用 WordPress 菜单执行更多操作:

屏幕选项面板。

屏幕选项面板。

屏幕元素 group 允许您在左侧边栏中显示菜单元框。 相比之下, 显示高级菜单属性 group 显示列表项的链接目标、描述和 CSS 类。

还有一个方面 菜单 画面值得注意。 这 自定义链接 框允许您设置您选择的链接,而不是您网站上的预定义页面:

自定义链接元框。

自定义链接元框。

此选项是您将社交媒体链接添加到 WordPress 菜单的方法。 该平台将根据您选择的站点为您拉出正确的图标,让您有机会为您选择的站点显示良好的徽标。

2. 使用插件创建您的自定义 WordPress 菜单

向 WordPress 添加功能的直接解决方案是通过插件。 上一节介绍了为什么 WordPress 的本机选项几乎是您所需要的,但插件可以扩展该功能。

有一个问题是您是否需要一个专门的(和额外的)插件来创建 WordPress 菜单,尽管这样做有很多很好的理由。 首先,您通常会根据默认设置下无法访问的样式制作菜单。 您可以通过插件获得特定的响应式设计、“大型菜单”等。

此外,您可以使用专用编辑器构建菜单,并在许多情况下从预设模板中进行选择。 再加上广泛的自定义选项,您将拥有一个“无代码”解决方案,它将提供适用于您网站的 WordPress 菜单。

例如,Max Mega Menu 插件对您可以实现的目标并不感到惊讶:

Max Mega 菜单插件。

Max Mega 菜单插件。

安装并激活后,您会发现一个新的 超级菜单 WordPress 中的面板:

WordPress 中的菜单位置链接。

WordPress 中的菜单位置链接。

如果你看 菜单位置 屏幕,您会注意到有更多自定义选项可供您使用:

Max Mega 菜单的菜单位置屏幕。

Max Mega 菜单的菜单位置屏幕。

您还可以应用菜单主题并使用与市场上一些最好的页面构建器类似的范围来编辑它们:

Max Mega 菜单中的菜单主题屏幕。

Max Mega 菜单中的菜单主题屏幕。

我们可以在这里挖掘更多内容,尽管我们会重复自己。 我们鼓励您查看我们之前关于 WordPress 菜单插件的帖子。 我们详细介绍了如何为您选择合适的插件以及如何使用它。

3. 编写代码来创建您的自定义 WordPress 菜单

编写自己的 WordPress 菜单是实现勇敢目标的可靠方法(或者,如果您是创建新 WordPress 主题的开发人员)。 当然,您不会每天打开代码编辑器来添加菜单。 为此,您将使用本机 WordPress 工具(或者可能是插件)。

也就是说,如果您想开发主题,学习如何编写 WordPress 菜单是一项至关重要的要求。 成功有四个部分:

  • 注册您的菜单。
  • 在前端显示 WordPress 菜单。
  • 在菜单或其项目中显示其他内容。
  • 定义回调。

我们假设您熟练使用代码编辑器,您有一个可以工作的开发环境,并且您的技能很敏锐。 如果您还没有要使用的主题,您可以使用 WordPress 的默认选项或从我们最快的 WordPress 主题列表中选择一个。

准备好后,您需要打开主题的 函数.php 文件。 请注意,这与一般的同名 WordPress 文件不同。 在这里,您需要注册您的菜单。 换句话说,您必须告诉 WordPress 在 外观 > 菜单 页。 为此,您可以使用 register_nav_menus() 函数:

function register_my_menus() {
  register_nav_menus(
    array(
      'header' => __( 'Header Menu' ),
      'other' => __( 'Other Menu' )
     )
   );
 }
 add_action( 'init', 'register_my_menus' );

这段代码告诉 管理位置 WordPress 中的选项卡以显示两个菜单: 标题菜单其他菜单

在 WordPress 中注册菜单。

在 WordPress 中注册菜单。

接下来,您必须使用 wp_nav_menu() 函数显示您的菜单。 您将把它添加到与您要显示菜单的位置相对应的模板文件中。 在我们的例子中,我们将使用标题,因此我们将以下代码添加到我们主题的 头文件 文件:

wp_nav_menu( array( 'theme_location' => 'header' ) );

可能是这段代码被包裹在一个 if 声明以及其他一些菜单,因此您需要遵循您找到的约定。

此时,您可以像使用其他菜单一样使用 WordPress 中的菜单。 不过,您可能还需要考虑向菜单项添加其他内容。 例如,您可以扩展定义的数组以包含将在输出上呈现的 HTML 标记:

wp_nav_menu(
  array(
    'menu' => 'primary',
    'link_before' => '',
    'link_after' => '',
  )
);

你在这里的最后一个任务是定义一个回调。 默认情况下,当找不到指定的菜单时,WordPress 会显示一个填充的菜单。 作为替代方案,当没有选择自定义菜单时,WordPress 将显示一个页面菜单。 如果这不是您想要的操作,您可以为 theme-location 参数并添加一个 fallback_cb 争论:

wp_nav_menu(
  array(
    'menu' => 'primary',
    // do not fall back to first non-empty menu
    'theme_location' => '__no_such_location',
    // do not fall back to wp_page_menu()
    'fallback_cb' => false
  )
);

一旦您了解了如何创建 WordPress 菜单,您就可以开始增强功能。 我们将在最后一节中查看此内容,为 WordPress 创建自定义菜单元框。

您的 WordPress 菜单是一个“前线”工具,可用于获得较高的搜索排名并让访问者留在网站上。 👀通过本指南了解如何增强您的功能👇点击推文

如何增强您的 WordPress 菜单

因为本节是高级的,我们在继续之前先做一些假设:

  • 您知道如何使用 PHP 创建 WordPress 菜单。
  • 您的 PHP 技能足以学习一些高级主题。
  • 您知道如何注册和初始化 WordPress 插件。

这超出了本文的范围,但您可以使用…

营销型WordPress外贸多语言独立站建设+谷歌SEO优化+谷歌关键字广告投放,就找WP花园!深圳公司,技术实力雄厚,用效果说话!详情咨询info@wordpresshy.com

海外社媒SNS代运营Tiktok代运营公司
Revive Old Posts