wordpress响应慢_如何使用FitVids在WordPress中使视频具有响应性

wordpress响应缓慢

When you 在 WordPress 中嵌入视频, by default these videos are not responsive. With the rise of 响应式 WordPress 主题, users visiting your site on smaller screens will see video containers that are stretched and disproportionate. In this article, we will show you how to make your videos responsive in WordPress with FitVids.

当您在 WordPress 中嵌入视频时 ，默认情况下，这些视频没有响应。 随着响应式 WordPress 主题的兴起，在较小屏幕上访问您的网站的用户将看到拉伸且比例过高的视频容器。 在本文中，我们将向您展示如何使用FitVids在WordPress中响应视频。

FitVids is a jQuery plugin which allows you to make your video embeds responsive. If you want to use it on your WordPress site, then all you need to do is install and activate 适用于 WordPress 的 FitVids plugin. After activation, you need to go to 外观 » FitVids and enter a CSS selector class. WordPress automatically adds .post class to the articles, so you can just use that.

FitVids是一个jQuery插件，可让您使视频嵌入响应。 如果您想在WordPress网站上使用它，则只需安装并激活适用于 WordPress 的 FitVids插件即可。 激活后，您需要转到外观 »FitVids并输入CSS选择器类。 WordPress会自动在文章中添加.post类，因此您可以使用它。

就这样，保存您的更改并预览您的网站。您需要重新调整浏览器屏幕的大小才能看到视频进行相应的调整。

就这样，保存更改并预览您的网站。您需要调整浏览器屏幕的大小才能看到视频进行相应调整。

影片教学 （Video Tutorial）

演示地址

如果您不喜欢该视频或需要更多说明，请继续阅读。

如果您不喜欢该视频或需要更多说明，请继续阅读。

手动添加FitVids以使您的视频在WordPress中具有响应性 （Manually Add FitVids to Make Your Videos Responsive in WordPress）

If you don’t want to install the FitVids for WordPress plugin, then you can add FitVids jQuery plugin manually. First thing you need to do is download and extract FitVids jQuery 插件 to your computer. Now you need to upload the extracted FitVids.js-master folder to your theme’s js directory.

如果您不想安装适用于WordPress的FitVids插件，则可以手动添加FitVids jQuery插件。 您需要做的第一件事是将FitVids jQuery 插件下载并解压缩到您的计算机中。 现在，您需要将提取的FitVids.js-master文件夹上载到主题的js目录。

You need to connect to your website 使用 FTP 客户端 like Filezilla and open your theme directory. It is possible that your WordPress theme may not have a js folder. If it is not there, then you need to create one and then upload FitVids.js-master folder from your computer.

您需要使用 FTP 客户端（例如Filezilla)连接到您的网站，然后打开主题目录。 您的WordPress主题可能没有js文件夹。 如果不存在，则需要创建一个文件夹，然后从计算机上载FitVids.js-master文件夹。

Inside the js folder, you need to create a new file and name it FitVids.js. Edit this file and paste this code inside it.

在js文件夹中，您需要创建一个新文件并将其命名为FitVids.js 。 编辑此文件并将此代码粘贴到其中。

(function($) {
  $(document).ready(function(){
    // Target your .container, .wrapper, .post, etc.
    $(".post").fitVids();
  });
  
  })(jQuery);

The above code tells FitVids to look for .post CSS selector class. Now that you got FitVids ready, it is time to 正确添加 JavaScript in your WordPress theme.

上面的代码告诉FitVids寻找.post CSS选择器类。 现在您已经准备好FitVids，是时候在WordPress主题中正确添加javascript了。

Simply, copy and paste the following code in your theme’s functions.php file:

只需将以下代码复制并粘贴到主题的functions.php文件中：

wp_enqueue_script('fitvids', get_template_directory_uri() . '/js/FitVids.js-master/jquery.fitvids.js', array('jquery'), '', TRUE); 

wp_enqueue_script('fitvids-xtra', get_template_directory_uri() . '/js/FitVids.js', array(), '', TRUE);

一旦你这样做了，你就完成了。您已成功使您的 WordPress 视频具有响应能力。

一旦完成，就完成了。您已成功使您的 WordPress 视频具有响应能力。

We hope that you found this article useful. For feedback and questions please feel free to leave a comment below or join us on 推特 and 谷歌+.

我们希望您觉得本文有用。 有关反馈和问题，请随时在下面发表评论，或在推特和谷歌+上加入我们。

翻译自: https://www.wpbeginner.com/plugins/how-to-make-your-videos-responsive-in-wordpress-with-fitvids/

wordpress响应缓慢