Когда вы вставляете видео в WordPress, по умолчанию эти видео не являются отзывчивыми. С появлением отзывчивых тем WordPress пользователи, посещающие ваш сайт на небольших экранах, увидят растянутые и непропорциональные видеоконтейнеры. В этой статье мы покажем вам, как сделать ваши видео отзывчивыми в WordPress с помощью FitVids.
FitVids — это jQuery плагин, который позволяет сделать ваши видео вставки отзывчивыми. Если вы хотите использовать его на своем сайте WordPress, то все, что вам нужно сделать, это установить и активировать плагин FitVids for WordPress. После активации вам необходимо перейти по адресу Внешний вид » FitVids и ввести селектор CSS класса. WordPress автоматически добавляет .класс поста для статей, поэтому вы можете просто использовать его.
Вот и все, сохраните изменения и просмотрите ваш сайт. Вам нужно будет изменить размер экрана браузера, чтобы увидеть, как видео настраивается соответствующим образом.
Видеоучебник
Подписаться на WPBeginner
Если вам не понравилось видео или нужны дополнительные инструкции, то продолжайте читать дальше.
Ручное добавление FitVids, чтобы сделать ваши видео отзывчивыми в WordPress
Если вы не хотите устанавливать плагин FitVids for WordPress, то вы можете добавить плагин FitVids jQuery вручную. Первое, что вам нужно сделать, это скачать и извлечь плагин FitVids jQuery на свой компьютер. Теперь вам нужно загрузить извлеченный FitVids.папку js-master в каталог js вашей темы.
Вам нужно подключиться к вашему сайту с помощью FTP-клиента, например Filezilla, и открыть каталог вашей темы. Возможно, в вашей теме WordPress нет папки js. Если его нет, то вам необходимо создать его, а затем загрузить FitVids.папку js-master с вашего компьютера.
Внутри папки js нужно создать новый файл и назвать его FitVids.js . Отредактируйте этот файл и вставьте в него этот код.
(function($) < $(document).ready(function()< // Target your .container, .wrapper, .post, etc. $(".post").fitVids(); >); >)(jQuery);
Приведенный выше код сообщает FitVids, что нужно искать .пост CSS селектор класса. Теперь, когда вы подготовили FitVids, пришло время правильно добавить яваскрипты в вашу тему WordPress.
Просто скопируйте и вставьте следующий код в функции вашей темы.php файл:
wp_enqueue_script('fitvids', get_template_directory_uri() . 'https://cdn3.wpbeginner.com/js/FitVids.js-master/jquery.fitvids.js', array('jquery'), '', TRUE); wp_enqueue_script('fitvids-xtra', get_template_directory_uri() . 'https://cdn4.wpbeginner.com/js/FitVids.js', array(), '', TRUE);
Как только вы это сделаете, вы закончите. Вы успешно сделали ваши видео WordPress отзывчивыми.
Мы надеемся, что вы нашли эту статью полезной. Для обратной связи и вопросов, пожалуйста, оставьте комментарий ниже или присоединяйтесь к нам в Twitter и Google+.
Источник: www.wpbeginner.com