ElegantThemes

El bloque ‘Patrón’ y cómo soluciona un problema de larga data con datos dinámicos en plantillas HTML

Mientras navegaba por los temas de bloques más recientes en WordPress.org, encontré un nuevo favorito: Bai. La tipografía fue perfecta para aquellos que tienden a escribir contenido extenso. Además, tiene un diseño de modo oscuro incorporado que no me hizo arrancar los ojos de sus órbitas. Planeaba revisarlo, pero no tenía mucho que decir. Es solo un diseño sólido sin muchos extras.

Sin embargo, en el entorno de prueba especial que configuré, parte de él se rompió. Me encontré con uno problema de larga data con el sistema de bloques.

La imagen de introducción predeterminada utilizada en la página de inicio devuelve un 404 si WordPress no está instalado en el directorio raíz o si el /wp-content Se movió la carpeta. Lo cambié a otro sitio de prueba con la configuración predeterminada para que apareciera.

Página de inicio sobre Bai.

Esto no es culpa del desarrollador. Los diseños de bloques actualmente no tienen forma de agregar valores dinámicos a sus plantillas. Entonces, la única solución es usar una imagen de un sitio de terceros como un enlace directo o agregar una URL estática.

Este es un problema no tan trivial que ha obstaculizado, al menos parcialmente, la dinámica del desarrollo del tema de bloques.

Dado que los temas han existido, los datos se han generado a través de funciones PHP. Cuando se utilizan plantillas de bloques, todo es HTML y bits de datos JSON. Las partes dinámicas son los propios bloques, lo que funciona bastante bien para al menos el 90% (probablemente más) de los escenarios.

Cuando los autores de temas tienen problemas, no hay bloqueos o formas de agregar datos dinámicos en línea. Algunos casos de uso incluyen:

  • Impresión de cadenas de texto internacionalizadas.
  • Salida del año actual en el área de derechos de autor del pie de página.
  • Añadiendo URL de imagen.

No es tanto que estas cosas tengan que ser dinámicas. Se espera que los usuarios editen el contenido a través del editor del sitio. Sin embargo, la experiencia no es ideal con una imagen que devuelve un estado 404 cuando los usuarios tienen una estructura de directorio diferente. O si, al utilizar la traducción al español, su tema contiene pequeñas partes de inglés. Antes de que los temas de bloques terminen oficialmente en WordPress, esto debe solucionarse.

Hay un entrada abierta para Gutenberg 11.8.2018 planificado que resuelve este problema con un nuevo bloque de patrón. Básicamente, los temas permitirían generar un patrón desde dentro de las plantillas.

<!-- wp:pattern {"slug":"namespace/pattern-name"} /-->

La razón de esto es que los patrones se definen a través de PHP. Los autores de temas pueden utilizar funciones de internacionalización como __(), Imprime la fecha date_i18n()o proporcione una URL de imagen. el fin get_theme_file_uri().

Con esta próxima función, una propuesta anterior para un. cerrado bloque i18n independiente. También debe incluir las diversas ideas para un número anterior. datos dinámicos en archivos HTML estáticos. Otro para incluir Imágenes en plantillas de bloques. Y estoy seguro de que hay muchas otras entradas.

El impulso probablemente sucederá porque el próximo tema estándar Twenty Twenty-Two lo necesita. Actualmente, los desarrolladores necesitan averiguar cómo aparecerá el valor predeterminado imagen de pájaro volador en la página de inicio y agregue texto de crédito de pie de página internacionalizado.

Diseño de página de inicio del tema Twenty Twenty-Two de WordPress que presenta un fondo negro con un eslogan grande y una imagen de pájaro volador en la parte inferior.
Diseño de página de inicio de Twenty Twenty-Two.

Me gusta el concepto aquí. Los desarrolladores agregan el bloque de patrón a sus plantillas. El patrón aparece en el editor del sitio y permanece en su lugar hasta que un usuario lo edita directamente. Entonces se comporta como cualquier otra justificación y el contenido deja de ser dinámico.

Un beneficio adicional de esta función es que también podría resolver un problema de código duplicado y permitir que los autores de temas sigan el principio DRY.

Al crear plantillas o partes de plantillas, algunos autores de temas duplican el mismo contenido que los patrones de bloques que puede seleccionar el usuario. En lugar de tener el código en dos lugares, puede registrarlo una vez como patrón y llamarlo dentro de la plantilla.

Aunque el bloque Pattern aún no se ha fusionado oficialmente, parece ser la mejor solución al problema del contenido dinámico con los temas de bloques.

Deja una respuesta

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