Pregunta sobre Primer de Wordpress:

Problema con los encabezados de video en dispositivos móviles

Un usuario preguntó 👇

Hola, estoy usando Child Primer Theme, Lyrical. Tengo un video de encabezado en la página de inicio y funciona muy bien en un escritorio; sin embargo, aunque la «vista previa» muestra que el video funciona tanto en la versión de tableta como en la de teléfono (es decir, cuando estas opciones están activadas en el modo de vista previa, el video aún se reproduce), cuando cargar la página en tabletas activas. y teléfonos, muestra el encabezado estático que aparece en todas las demás páginas. Queremos mostrar el video en la página de inicio de cada dispositivo. es posible? gracias

La página con la que necesito ayuda: https://warnerpoint.net/

Aquí está el enlace de github al tema lírico: https://github.com/godaddy/wp-lyrical-theme/ ¿Puede alguien ayudarme amablemente?

(@snakelyone)

Hace 2 años, 1 mes

Estoy confundido en cuanto a por qué Even no responde. Esta es la segunda vez que hago esta pregunta. ¿Estoy preguntando mal? Pagué por el tema, así que estoy confundido por qué no recibo apoyo. Gracias

(@ eherman24)

Hace 2 años, 1 mes

Hola @snakelyone

Los temas alojados aquí en WordPress.org son gratuitos y no hay ningún cargo por usarlos. Cualquiera, incluidos los clientes de GoDaddy, puede descargarlos y utilizarlos de forma gratuita.

Dicho esto, estamos utilizando la funcionalidad principal de WordPress. A saber the_custom_header_markup (Fuente: https://github.com/godaddy/wp-primer-theme/blob/develop/inc/hooks.php#L48, Codex: https://developer.wordpress.org/reference/functions/the_custom_header_markup/)

Si profundiza lo suficiente en el corazón de WordPress, encontrará que hay una verificación para ver si el entorno actual admite videos.

https://github.com/WordPress/WordPress/blob/master/wp-includes/js/wp-custom-header.js#L83

Valor predeterminado settings.minWidth a 900. Debido a que el ancho interior de las ventanas es menor que el valor predeterminado minWidth, esa línea devuelve verdadero y por lo tanto supportsVideo devoluciones de cheques falsos.

Puede filtrar el valor minWidth y establecerlo en 0, para que el video esté siempre encendido. Primero querrá crear un plugin MU. Para hacerlo, puede seguir el tutorial que hemos configurado en la documentación de Primer.

https://godaddy.github.io/wp-primer-theme/tutorials-and-examples/tutorials/mu-plugin.html

Una vez que haya realizado esa configuración, querrá agregar el siguiente fragmento de PHP al archivo:

// Enable video header support on mobile devices
add_filter( 'header_video_settings', function( $args ) {

	$args['minWidth'] = 0;

	return $args;

} );

Esto debería hacer que los videos se reproduzcan en todos los dispositivos, independientemente del tamaño de la ventana.

Avísame si eso ayuda.

Evan

(@snakelyone)

Hace 2 años

¡gracias! Lo intentaré … Agradezco su orientación.

(@snakelyone)

Hace 2 años

Hola Evan,

Hice lo que dijiste (¡al menos creo!) Y el video muestra, pero hay una «flecha de reproducción» roja en el medio de la pantalla y en la línea de arriba dice lo siguiente: ¿podrías decir lo que hice? ¿incorrecto? aún no es visible en un teléfono, pero solo lo queremos en el ipad, gracias, blake

// Habilite la compatibilidad con el encabezado de video en dispositivos móviles add_filter (‘header_video_settings’, function ($ args) {

$ args[‘minWidth’] = 0;

return $ args;

});

(@snakelyone)

Hace 2 años

lo siento, se envió demasiado pronto. Por supuesto, puse el código en el lugar equivocado. porque supongo que es por eso que el código que me dijiste que pegara se muestra en la página … sería de gran ayuda. Gracias

(@snakelyone)

Hace 2 años

Traté de meterlo en el cuerpo y en la cabeza, ninguno funcionó

(@snakelyone)

Hace 2 años

Y luego usé texto de wrangler para repetir el proceso descrito sobre cómo usar un plugin que debe usarse (esta vez no hay php dreamweaver, ya que hay mucha información adicional en el archivo) pero el t suerte para él. Sigo mirando el código en la parte superior de la página (en el escritorio y la tableta, pero el teléfono todavía tiene la imagen estática, pero ahora la línea de código también está en la parte superior) … Le dije al cliente que esto se resolverá pronto, así que espero que pueda ofrecer algunas sugerencias para solucionar problemas

(@ eherman24)

Hace 2 años

Tenías razón la primera vez. El video se mostrará pero no se reproducirá automáticamente en dispositivos móviles. Hasta donde yo sé, los dispositivos móviles no son compatibles con la reproducción automática. Puede escribir algo de JavaScript para reproducir el video en la carga de la página, pero aparte de eso, no estoy seguro de si existe una forma de reproducir el video en un teléfono móvil.

Evan

(@snakelyone)

Hace 2 años

el video no se reproducirá (el botón no está activo, simplemente estático y no hace nada), y además, ¿el código sigue en la parte superior de la página?

y en este punto no me permite iniciar sesión en mi página de administración cuando la cadena de código está en la parte superior … ¿no lo ve? en cambio, cuando voy a https://warnerpoint.net/wp-admin/
no hay opción de inicio de sesión, en su lugar, solo una página en blanco con el código stick

(@snakelyone)

Hace 2 años

Para ser claros, cada vez que intenté crear el archivo php, el sitio tenía el código en la parte superior de la página. ¿Lo ves?

(@snakelyone)

Hace 2 años

Hola Evan, todavía tengo el problema con el código en la parte superior de la página, ha estado ahí desde que comencé (así que nunca fui «correcto») … ¿puedes dar un consejo, por favor? Estaría muy agradecido, gracias

(@snakelyone)

Hace 2 años

Hola Evan,

De acuerdo, logré deshacerme del código, pero no se puede hacer clic en el enlace de YouTube: la flecha roja está allí, pero el video no se reproduce. Es decir, el encabezado del móvil es una imagen de la imagen inicial del video, y la flecha roja no hace nada.

Estaba buscando lo que estaba sucediendo sin efecto. Parece que no encuentro a nadie con este problema.

Esta es la URL de youtube: https://www.youtube.com/watch?v=Lj2Y8Rmlbq0

(@ eherman24)

Hace 2 años

@snakelyone

No estoy seguro de por qué se muestra ese código en su encabezado. Eso no debería estar sucediendo. Supongo que no incluiste una apertura. <?php etiqueta en la parte superior donde haya agregado ese fragmento de código.

En cuanto a que no se puede hacer clic en el video, eso se debe a que el elemento de la carpeta del encabezado está en la parte superior de ese reproductor de YouTube, el logotipo y otros elementos reciben el clic. Si revisa la marca, verá que el logotipo y otros elementos están “encima” del video en el espacio z.

Esto va un poco más allá del alcance del soporte gratuito y más en el área del desarrollo personalizado, pero para facilitar un poco las cosas, debería poder inspirar la reproducción del video, usando algo de Javascript, en dispositivos móviles agregando código a su plugin MU.

function autoplay_youtube_header() {

	ob_start();

	?>
	jQuery( window ).on( 'load', function() {
		window.wp.customHeader.handlers.youtube.player.playVideo();
	} );
	<?php

	$script = ob_get_clean();

	wp_add_inline_script( 'wp-custom-header', $script );

}
add_action( 'wp_enqueue_scripts', 'autoplay_youtube_header' );

Idealmente, agregaría esa colección a un archivo JavaScript y lo pondría en cola correctamente, pero si no está familiarizado con ese proceso, el fragmento anterior funcionará bien.

(@snakelyone)

Hace 2 años

Hola Evan, Sí, tenías razón, me faltaba el código PHP inicial … y me di cuenta de eso por mi cuenta … sin embargo, me temo que no estoy pegando tu código correctamente, porque la reproducción automática está sucediendo. (También leí en mi investigación que los videos de YouTube no se reproducirán con audio automáticamente … Estoy trabajando para acceder al video en sí, pero mientras tanto, ¿puedes ver si falta algo en este código? sobre mí:

$ args[‘minWidth’] = 0;

return $ args;

}); función autoplay_youtube_header () {

ob_start ();

?> jQuery (ventana) .on (‘cargar’, función () {ventana.wp.customHeader.handlers.youtube.player.playVideo ();});

$ script = ob_get_clean ();

wp_add_inline_script (‘wp-encabezado-personalizado’, $ script);

} add_action (‘wp_enqueue_scripts’, ‘autoplay_youtube_header’);

(@ eherman24)

Hace 2 años

@snakelyone

No puedo decir si el código que proporcionó en la respuesta anterior contiene citas individuales no válidas o si esa es la forma en que los foros de WordPress.org analizaron el código.

Deberá resaltar su código y luego hacer clic en el botón ‘código’ en la barra de herramientas del editor de texto. Esto devolverá su código en copias de seguridad y lo formateará correctamente.

Parece usar su código de arriba y en lugar de solo citas individuales '. Puede intentar actualizar su código para asegurarse de que se utilizan cotizaciones individuales. Copié el código que proporcionaste y actualicé esas citas y las cosas parecen estar funcionando en mi final.

Evan

¿Solucionó tu problema??

0 / 0

Deja una respuesta 0

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *