Как определить код HTML на основе устройства на Wordpress? - PullRequest
Новая
       2

Как определить код HTML на основе устройства на Wordpress?

1 голос
/ 02 июня 2019

У меня нет опыта работы с HTML, и я пытаюсь создать для себя небольшой веб-сайт на WordPress.

У меня есть следующий код для воспроизведения видео на моем веб-сайте: 

<video poster="video poster link" controls="controls" width="270" height="490">
<source src="video link" type="video/mp4"></video>

Видеоплеер отлично отображается на рабочем столе сайта.Однако, когда WordPress изменяет размеры сайта для планшетов, он сильно растягивается.Итак, я хотел бы изменить размер кода, когда он отображается на планшетах / мобильных устройствах.

Чтобы обнаружить, я обнаружил следующий код в Интернете, но не смог заставить его работать: 

<?php
if ( wp_is_mobile() ) {
    /* Include/display resources targeted to phones/tablets here */
} else {
    /* Include/display resources targeted to laptops/desktops here */
}
?>

Спасибо.

1 Ответ

1 голос
/ 02 июня 2019

Если у вас нет прав на редактирование кода на вашем WordPress-сайте, вы можете добавить плагин, например fitvids . Если у вас есть права на редактирование, вы можете добавить медиа-запрос, чтобы проверить, соответствует ли ширина устройства таку 

@media screen and (max-width: 768px) {
    video {
        max-width: 75%;
        height:auto;
}  // iPad

@media screen and (max-width: 480px) {
    video {
        max-width: 45%;
        height:auto;
}  //Phone

При необходимости отрегулируйте ширину.

Надеюсь, это поможет

...