使用jQuery load通过WordPress菜单按类别加载最新帖子

jQuery的

如果您访问过一些较大的博客,例如 Mashable的,您可能会注意到他们有一个非常好的菜单系统,可以下拉菜单系统,让您可以查看每个类别的最新博客文章。 为确保页面不会永远加载,他们使用 Ajax 加载该内容……并且仅在页面完全加载后才预加载。

WordPress Ajax子菜单

我们想在这里做同样的事情 Martech Zone. 为了深入了解我们拥有的类别,我想在每个类别中展示一些帖子。 我们精通 WordPress,WordPress API 和 jQuery 但直到我找到了一篇关于 使用jQuery按类别获取帖子 我们有一个很好的解决方案。

注意:我认为他们方法的一个方面不是一个好的解决方案是通过 JavaScript 传递整个 query_post 字符串……在我看来,您正在为黑客敞开心扉! 我已经修改了这个站点的脚本,以便我只在 query_posts 命令中传递必要的参数。

本教程将引导用户创建一个模板来动态拉入帖子,然后介绍如何构建可以发起请求的链接。 如果我们只想制作一些链接会很容易,但我们实际上想利用 WordPress 的内置导航菜单。 对我们来说不幸的是,当您添加和删除菜单项时,WordPress 的菜单链接会生成数字……但它们实际上没有任何关于您希望拉取并在 Ajax 调用中传递的类别的信息。

为了正确标记菜单列表项,我们结合了WPreso的代码, 将页面/后段类别添加到菜单项类别.

只有一个问题……它适用于页面或帖子,但实际上不适用于类别! 所以我们更新了对 slug 的请求:

$ slug = get_cat_slug($ id);

并添加了WPRecipes的功能, WordPress技巧:使用类别ID获取类别标签,将类别标签拖回导航菜单中的data属性。

因此,…感谢3个WordPress网站的共同努力以及我们的jQuery专家在以下方面的一些微调: DK New Media, 斯蒂芬·科利 (为了使菜单平滑),我们有一个非常好的子菜单系统!

所有的工作都是在我们的主题文件中完成的。 我们在functions.php中加载了导航菜单过滤器,将子菜单div添加到我们主题的header.php文件中,向它们添加了一个子菜单模板,并在我们的标题中加载了一个子菜单JavaScript文件——确保jQuery已经加载到我们的主题中以及。 希望您欣赏这项工作,这是对网站的一次有趣更新!

8条评论

  1. 1
  2. 6
  3. 8

你觉得呢?

本网站使用Akismet来减少垃圾邮件。 了解您的数据如何处理.