Skip to content
Permalink
Browse files

Accessibility: Media: Allow users to set a proper language for Video …

…subtitles.

For a number of years, subtitles track added to videos were always set to "English" regardless of the actual subtitles language.

By making the track `srclang`, `label`, and `kind` attributes editable, content authors are now able to set a language that matches the actual track content.

Props BjornW, audrasjb, birgire, karmatosed, sabernhardt, afercia.
Fixes #47559.


git-svn-id: https://develop.svn.wordpress.org/trunk@46373 602fd350-edb4-49c9-b593-d223f7449a82
  • Loading branch information...
afercia committed Oct 1, 2019
1 parent dc0b9dc commit 65c94d5cd8f9c3cc5508ce318d0f12c4eeaff371
Showing with 25 additions and 4 deletions.
  1. +10 −0 src/wp-includes/css/media-views.css
  2. +15 −4 src/wp-includes/media-template.php
@@ -2126,6 +2126,16 @@
font-style: normal;
}

.media-embed .content-track + .description {
line-height: 1.4;
/* The !important needs to override a high specificity selector from wp-medialement.css */
max-width: none !important;
}

.media-embed .remove-track {
margin-bottom: 10px;
}

.image-details .embed-media-settings .setting,
.image-details .embed-media-settings .setting-group {
float: none;
@@ -1355,11 +1355,22 @@ function wp_print_media_templates() {
var content = '';
if ( ! _.isEmpty( data.model.content ) ) {
var tracks = jQuery( data.model.content ).filter( 'track' );
_.each( tracks.toArray(), function (track) {
_.each( tracks.toArray(), function( track, index ) {
content += track.outerHTML; #>
<label for="video-details-track" class="name"><?php _e( 'Tracks (subtitles, captions, descriptions, chapters, or metadata)' ); ?></label>
<input class="content-track" type="text" id="video-details-track" readonly value="{{ track.outerHTML }}" />
<button type="button" class="button-link remove-setting remove-track"><?php _ex( 'Remove video track', 'media' ); ?></button>
<label for="video-details-track-{{ index }}" class="name"><?php _e( 'Tracks (subtitles, captions, descriptions, chapters, or metadata)' ); ?></label>
<input class="content-track" type="text" id="video-details-track-{{ index }}" aria-describedby="video-details-track-desc-{{ index }}" value="{{ track.outerHTML }}" />
<span class="description" id="video-details-track-desc-{{ index }}">
<?php
printf(
/* translators: 1: "srclang" HTML attribute, 2: "label" HTML attribute, 3: "kind" HTML attribute. */
__( 'The %1$s, %2$s, and %3$s values can be edited to set the video track language and kind.' ),
'srclang',
'label',
'kind'
);
?>
</span>
<button type="button" class="button-link remove-setting remove-track"><?php _ex( 'Remove video track', 'media' ); ?></button><br/>
<# } ); #>
<# } else { #>
<span class="name"><?php _e( 'Tracks (subtitles, captions, descriptions, chapters, or metadata)' ); ?></span><br />

0 comments on commit 65c94d5

Please sign in to comment.
You can’t perform that action at this time.