Нет css для аудиоблока Гутенберга в Wordpress?

Есть ли способ стилизовать аудиоблоки Gutenberg с помощью css? Обычные виджеты Wordpress и шорткод [аудио] используют mediaelement.js, поэтому стилизовать эти элементы не проблема, но вывод аудиоблока Gutenberg представляет собой простой аудио-тег html. Лучше всего для них использовать mediaelement.js - мне интересно, почему это не по умолчанию.


wordpress audio wordpress-gutenberg mediaelement.js
person Balduin    schedule 30.08.2019    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Я нашел быстрое и грязное решение этой проблемы. Я добавил следующий код прямо перед концом тега заголовка, чтобы применить mediaelement.js к блокам gutenberg-audio.

<script>
        jQuery(document).ready(function() {
            jQuery(".wp-block-audio audio").addClass("mejs__player");
        });
</script>
<script src="/wp-includes/js/mediaelement/mediaelement-and-player.min.js"></script>
<link rel="stylesheet" href="/wp-includes/js/mediaelement/mediaelementplayer.min.css" />

Ссылки на медиаэлементы js и css нужно добавлять только в том случае, если у вас еще нет боковой панели с аудио-виджетами, видимыми на всех страницах вашего веб-сайта - в этом случае медиаэлементы js и css добавляются автоматически.

Как я уже сказал: это всего лишь взлом, а не настоящее долгосрочное решение. Думаю, есть более чистый способ решить проблему с помощью некоторого кода в functions.php. Предложения приветствуются.

person Balduin    schedule 02.09.2019