wordpress最佳架构_WordPress初学者的8种最佳jQuery教程

wordpress最佳架构

jQuery helps you create interactive, user-friendly, and beautiful websites. For those with little CSS and HTML knowledge jQuery sounds complicated, but with easy to follow tutorials anyone can add fancy effects to their site. In this article, we will list some of the best jQuery tutorials for WordPress beginners.

jQuery帮助您创建交互式，用户友好和美观的网站。 对于那些几乎没有CSS和HTML知识的人来说，jQuery听起来很复杂，但是通过易于遵循的教程，任何人都可以在他们的网站上添加奇特的效果。 在本文中，我们将列出WordPress初学者的一些最佳jQuery教程。

With these tutorials not only will you learn how to add these nifty jQuery scripts to your WordPress site, but you will also get a chance to learn jQuery a little bit, and how to use it in WordPress. For absolute beginners we would recommend that you first take a look at our guide on how to add code snippets in WordPress and how to properly add JavaScript and Styles in WordPress.

通过这些教程，您不仅将学习如何将这些漂亮的jQuery脚本添加到WordPress网站，而且还将有机会学习一点jQuery，以及如何在WordPress中使用它。 对于绝对的初学者，我们建议您首先阅读我们的指南，了解如何在WordPress中添加代码段以及如何在WordPress中正确添加JavaScript和样式 。

1. 如何在WordPress中添加jQuery Tabber Widget (1. How to Add jQuery Tabber Widget in WordPress)

Tabber widget allows you to save sidebar space by combining multiple widgets into a single widget with tabs. In this jQuery tutorial you will get to learn how to create a jQuery Tabber widget as a plugin which is easy to modify and you can customize it to add any content you want in tabs.

Tabber小部件允许您通过将多个小部件组合到带有标签的单个小部件中来节省侧边栏空间。 在此jQuery教程中，您将学习如何创建jQuery Tabber小部件作为易于修改的插件，并且可以对其进行自定义以在标签中添加所需的任何内容。

2. 如何在WordPress中添加jQuery FAQ手风琴 (2. How to Add a jQuery FAQ Accordion in WordPress)

Frequently asked question pages can become lengthier and difficult to read. In this jQuery tutorial we show you how to create a FAQs section on your website using jQuery accordion. This creates a much better user experience as users will be able to quickly see the questions without scrolling too much.

常见问题页面可能会变得冗长且难以阅读。 在本jQuery教程中，我们向您展示如何使用jQuery手风琴在您的网站上创建FAQ部分。 由于用户将能够快速查看问题而无需滚动太多，因此这将带来更好的用户体验。

3. 如何使用jQuery在WordPress中向顶部效果添加平滑滚动 (3. How to Add a Smooth Scroll to Top Effect in WordPress using jQuery)

For websites which publish long form articles where a user needs to scroll a lot to see the full content, a button or link to send users back to the top of the page provides a better user experience. In this tutorial we showed you how to add a back to top button with smooth scroll effect using jQuery.

对于发布长篇文章的网站，其中用户需要大量滚动才能看到全部内容，使用按钮或链接将用户带回到页面顶部可提供更好的用户体验。 在本教程中，我们向您展示了如何使用jQuery添加具有平滑滚动效果的返回页首按钮。

4. 如何在WordPress评论表中添加jQuery工具提示 (4. How to Add jQuery Tooltips in WordPress Comment Form)

Tool tips can be used to provide users instructions or useful information as they take mouse over to some element. In this jQuery tutorial we show you how to add tool tips to your WordPress comment form. It not only looks pretty, it also encourages your users to take part in discussions on your site.

当用户将鼠标移到某个元素上时，工具提示可用于向用户提供说明或有用的信息。 在此jQuery教程中，我们向您展示如何向WordPress注释表单添加工具提示。 它不仅看起来漂亮，而且还鼓励您的用户参加您网站上的讨论。

5. 如何使用FitVids在WordPress中使视频具有响应性 (5. How to Make Your Videos Responsive in WordPress with FitVids)

When you add YouTube videos to your WordPress site, they are not responsive by default. Even if your WordPress theme is responsive, the video container will skew disproportionately creating bad user experience for users on smaller devices and screen sizes. In this tutorial we show you how to use Fitvids jQuery plugin to make your videos responsive in WordPress.

当您将YouTube视频添加到WordPress网站时，默认情况下它们不会响应。 即使您的WordPress主题是响应式的，视频容器也将不成比例地倾斜，从而给较小设备和屏幕尺寸的用户带来不良的用户体验。 在本教程中，我们向您展示如何使用Fitvids jQuery插件使您的视频在WordPress中具有响应能力。

6. 如何在WordPress中添加旋转推荐 (6. How to Add Rotating Testimonials in WordPress)

As the title suggests, in this tutorial we show you how to add rotating testimonials to your WordPress site. Very useful when you have testimonials section on your website and you want to show testimonials with neat jQuery effect.

如标题所示，在本教程中，我们向您展示如何向您的WordPress网站添加旋转推荐。 当您的网站上有“推荐词”部分并且想要显示带有简洁jQuery效果的推荐词时，此功能非常有用。

7. 如何在WordPress主题中添加幻灯片面板菜单 (7. How to Add a Slide Panel Menu in WordPress Themes)

A slide panel menu appears when a user clicks on the menu button on your website. In this tutorial you will get to learn how to create Mobile friendly slide panel menus using jQuery.

当用户单击您网站上的菜单按钮时，将显示一个滑动面板菜单。 在本教程中，您将学习如何使用jQuery创建适合移动设备的幻灯片面板菜单。

8. 如何在WordPress主题中添加工具提示推荐 (8. How to Add Tooltip Testimonials in WordPress Themes)

In this tutorial we show you how to display user testimonials in jQuery Tooltip. It is based on the code we have used on WPBeginner Videos page. Instead of showing testimonials in blockquotes it displays the testimonial text when a user takes the mouseover to the user photo.

在本教程中，我们向您展示如何在jQuery Tooltip中显示用户推荐。 它基于我们在WPBeginner视频页面上使用的代码。 当用户将鼠标悬停在用户照片上时，它不会在方框引号中显示推荐，而是显示推荐文本。

We hope that you will try some of these jQuery tutorials on your WordPress site. Hopefully this will get you started working with jQuery and WordPress themes. Let us know if there is any specific jQuery tip that you would like to see implemented in WordPress? For feedback and questions please leave a comment.

我们希望您可以在WordPress网站上尝试一些jQuery教程。 希望这将使您开始使用jQuery和WordPress主题。 让我们知道您是否希望在WordPress中实现任何特定的jQuery技巧？ 对于反馈和问题，请发表评论。

翻译自: https://www.wpbeginner.com/showcase/8-best-jquery-tutorials-for-wordpress-beginners/

wordpress最佳架构