Word press - 비디오의 모든 컨트롤을 비활성화 및 숨김

Word press - 비디오의 모든 컨트롤을 비활성화 및 숨김

워드프레스 4.6.1 동영상에서 모든 컨트롤을 비활성화하고 숨기는 방법?

WordPress 페이지 내의 실제 코드를 따라가기:

[video width="560" height="320" mp4="example.com/test.mp4" loop="true" autoplay="true" preload="auto"][/video]

안녕하세요. 해당 비디오 쇼트 코드에 대해 .mejs-controls div에 적용된 인라인 스타일을 재정의해야 합니다.할 수 있습니다.

.mejs-controls {
  display: none !important;
  visibility: hidden !important;
  }

이러한 컨트롤은 사용자가 지시하지 않는 한 일반적으로 호버에만 표시됩니다.컨트롤을 비활성화하려는 이유가 무엇인지 묻고 싶습니다. 이 기능을 사용자로부터 빼앗으면 이 제한으로 인해 그녀가 좌절할 수 있습니다.

이 게시물에서 좀 더 많은 정보를 찾았습니다. https://wordpress.stackexchange.com/questions/130402/hide-default-video-shortcode-controls-on-pageload

비 CSS 방법은 쇼트코드 출력에 필터를 추가하는 것입니다.이것을 당신의 것에 넣습니다.functions.php테마 파일:

add_filter( 'wp_video_shortcode', function( $output ) {
    $output = str_replace( 'controls="controls"', '', $output );
    return $output;
} );

이를 대체하는 것은controls="controls"공백이 있는 문자열에 특성을 입력하여 피쳐를 생략합니다.

HTML5 동영상이 GIF를 대체하고 있고 음소거 시 전화/태블릿 자동 재생 지원이 있기 때문에 배경 동영상이나 작은 2-3초 루프일 때 UX도 나쁘지 않다고 생각합니다.

동영상을 호버링할 때까지 모든 컨트롤을 숨길 수 있으므로 유용할 수도 있습니다.

.mejs-controls {
  opacity: 0!important;
  transition: all 0.5s ease;
}

.mejs-container:hover .mejs-controls {
  opacity: 1!important;
}

.mejs-overlay-button{
  display: none !important;
  visibility: hidden !important;
}

언급URL : https://stackoverflow.com/questions/39921040/wordpress-disable-and-hide-all-controls-on-video