Проблема: Мне бы хотелось, чтобы MediaElement.js использовал стиль по умолчанию, когда я ничего не добавляю к шорткоду , но использую другую таблицу стилей, когда добавляю параметр или когда пишу другой шорткод, но только для этого точного игрока.
Возможное решение: В media.php, где wp_audio_shortcode()
называется, есть сегмент, который говорит:
if ( 'mediaelement' === $library && did_action( 'init' ) ) {
wp_enqueue_style( 'wp-mediaelement' );
wp_enqueue_script( 'wp-mediaelement' );
}
Поэтому я в основном скопировал всю функцию wp_audio_shortcode, присвоил ей другое имя (и изменил некоторые другие вхождения wp_audio_shortcode на мое новое имя) и изменил вторую строку на:
wp_enqueue_style('mini-audio-player', get_stylesheet_directory_uri() . '/assets/mediaelement/mediaelementplayer.css', array(), null );
где mediaelementplayer.css — моя новая таблица стилей.
Что просходит: Это работает в некоторой степени — когда на странице выполняется только мой новый шорткод (который вызывает мою измененную функцию шорткода), он использует эту таблицу стилей. тем не мение, если есть также дефолт [аудио] шорткод на странице, и, например, на одной странице есть два игрока, оба будут иметь скин по умолчанию.
Вопрос: Как правильно поставить в очередь обе таблицы стилей?
Я дам вам полную функцию для справки, если я просто забыл что-то изменить:
/**
* Builds the Audio shortcode output using a special stylesheet.
*
* This implements the functionality of the Audio Shortcode for displaying
* WordPress mp3s in a post.
*
* @staticvar int $instance
*
* @param array $attr {
* Attributes of the audio shortcode.
*
* @type string $src URL to the source of the audio file. Default empty.
* @type string $loop The 'loop' attribute for the `<audio>` element. Default empty.
* @type string $autoplay The 'autoplay' attribute for the `<audio>` element. Default empty.
* @type string $preload The 'preload' attribute for the `<audio>` element. Default empty.
* @type string $class The 'class' attribute for the `<audio>` element. Default 'wp-audio-shortcode'.
* @type string $style The 'style' attribute for the `<audio>` element. Default 'width: 100%'.
* }
* @param string $content Shortcode content.
* @return string|void HTML content to display audio.
*/
function wp_audiothumb_shortcode( $attr, $content = '' ) {
$post_id = get_post() ? get_the_ID() : 0;
static $instance = 0;
$instance++;
/**
* Filter the default audio shortcode output.
*
* If the filtered output isn't empty, it will be used instead of generating the default audio template.
*
* @since 3.6.0
*
* @param string $html Empty variable to be replaced with shortcode markup.
* @param array $attr Attributes of the shortcode. @see wp_audio_shortcode()
* @param string $content Shortcode content.
* @param int $instance Unique numeric ID of this audio shortcode instance.
*/
$override = apply_filters( 'wp_audio_shortcode_override', '', $attr, $content, $instance );
if ( '' !== $override ) {
return $override;
}
$audio = null;
$default_types = wp_get_audio_extensions();
$defaults_atts = array(
'src' => '',
'loop' => '',
'autoplay' => '',
'preload' => 'none'
);
foreach ( $default_types as $type ) {
$defaults_atts[$type] = '';
}
$atts = shortcode_atts( $defaults_atts, $attr, 'audio' );
$primary = false;
if ( ! empty( $atts['src'] ) ) {
$type = wp_check_filetype( $atts['src'], wp_get_mime_types() );
if ( ! in_array( strtolower( $type['ext'] ), $default_types ) ) {
return sprintf( '<a class="wp-embedded-audio" href="%s">%s</a>', esc_url( $atts['src'] ), esc_html( $atts['src'] ) );
}
$primary = true;
array_unshift( $default_types, 'src' );
} else {
foreach ( $default_types as $ext ) {
if ( ! empty( $atts[ $ext ] ) ) {
$type = wp_check_filetype( $atts[ $ext ], wp_get_mime_types() );
if ( strtolower( $type['ext'] ) === $ext ) {
$primary = true;
}
}
}
}
if ( ! $primary ) {
$audios = get_attached_media( 'audio', $post_id );
if ( empty( $audios ) ) {
return;
}
$audio = reset( $audios );
$atts['src'] = wp_get_attachment_url( $audio->ID );
if ( empty( $atts['src'] ) ) {
return;
}
array_unshift( $default_types, 'src' );
}
/**
* Filter the media library used for the audio shortcode.
*
* @since 3.6.0
*
* @param string $library Media library used for the audio shortcode.
*/
$library = apply_filters( 'wp_audio_shortcode_library', 'mediaelement' );
if ( 'mediaelement' === $library && did_action( 'init' ) ) {
wp_enqueue_style('mini-audio-player', get_stylesheet_directory_uri() . '/assets/mediaelement/mediaelementplayer.css', array(), null );
wp_enqueue_script( 'wp-mediaelement' );
}
/**
* Filter the class attribute for the audio shortcode output container.
*
* @since 3.6.0
*
* @param string $class CSS class or list of space-separated classes.
*/
$html_atts = array(
'class' => apply_filters( 'wp_audio_shortcode_class', 'wp-audio-shortcode' ),
'id' => sprintf( 'audio-%d-%d', $post_id, $instance ),
'loop' => wp_validate_boolean( $atts['loop'] ),
'autoplay' => wp_validate_boolean( $atts['autoplay'] ),
'preload' => $atts['preload'],
'style' => 'width: 100%; visibility: hidden;',
);
// These ones should just be omitted altogether if they are blank
foreach ( array( 'loop', 'autoplay', 'preload' ) as $a ) {
if ( empty( $html_atts[$a] ) ) {
unset( $html_atts[$a] );
}
}
$attr_strings = array();
foreach ( $html_atts as $k => $v ) {
$attr_strings[] = $k . '="' . esc_attr( $v ) . '"';
}
$html = '';
if ( 'mediaelement' === $library && 1 === $instance ) {
$html .= "<!--[if lt IE 9]><script>document.createElement('audio');</script><![endif]-->\n";
}
$html .= sprintf( '<audio %s controls="controls">', join( ' ', $attr_strings ) );
$fileurl = '';
$source = '<source type="%s" src="%s" />';
foreach ( $default_types as $fallback ) {
if ( ! empty( $atts[ $fallback ] ) ) {
if ( empty( $fileurl ) ) {
$fileurl = $atts[ $fallback ];
}
$type = wp_check_filetype( $atts[ $fallback ], wp_get_mime_types() );
$url = add_query_arg( '_', $instance, $atts[ $fallback ] );
$html .= sprintf( $source, $type['type'], esc_url( $url ) );
}
}
if ( 'mediaelement' === $library ) {
$html .= wp_mediaelement_fallback( $fileurl );
}
$html .= '</audio>';
/**
* Filter the audio shortcode output.
*
* @since 3.6.0
*
* @param string $html Audio shortcode HTML output.
* @param array $atts Array of audio shortcode attributes.
* @param string $audio Audio file.
* @param int $post_id Post ID.
* @param string $library Media library used for the audio shortcode.
*/
return apply_filters( 'wp_audiothumb_shortcode', $html, $atts, $audio, $post_id, $library );
}
add_shortcode( 'audiothumb', 'wp_audiothumb_shortcode' );
Задача ещё не решена.
Других решений пока нет …