463 Tu propio archivo de bloques prediseñados en WordPress.
Suscribite para escuchar Marketing digital para gente como uno en: IVOOX | Spotify | Stitcher | Google podcast | Apple podcast | Audiobip
Tener un archivo de bloques prediseñados listos para utilizar en el desarrollo de un sitio web con WordPress es cada vez más sencillo. El editor de bloques te permite copiar el HTML y reutilizarlo de mil maneras ganando tiempo y mejorando tu flujo de trabajo. Hoy te cuento un truco sencillo que uso a menudo.
Los bloques y el HTML.
Una de las mejores cosas que tiene el editor de bloques de WordPress es trabajar con HTML y permitir intercambiar la vista entre el modo visual y el modo código.
Al pasar al modo código podemos copiar el HTML de cualquier sección, bloque o grupo de bloques de forma que al pegarlo en otra página de la misma web (o de otra) obtenemos el mismo resultado (el mismo diseño).
Esto es genial para crear nuestra propia biblioteca de bloques prediseñados.
Creando una biblioteca de bloques prediseñados.
El principio es simple y lo que propongo es una solución “de entrecasa” pero no por ello es una mala solución, al contrario, muchas veces las cosas más sencillas son las mejores.
La idea es diseñar utilizando el editor de bloques de WordPress y una vez que tenemos listo nuestro diseño cambiar para verlo en modo código (HTML) copiarlo y guardarlo en un documento de texto, en Google Docs, etc.
Podes estructurar tu biblioteca a tu gusto por ejemplo agrupando secciones con botones de llamada a la acción, otra con testimoniales, otra sección con un banner o un inline cta, etc.
Cada bloque o grupo de bloques que crees en WordPress con su editor lo podés guardar para reutilizarlo.
Un ejemplo de lo que te cuento.
A continuación vas a ver una sección creada con el editor y verás también el código que le da forma a la misma.
Esta es una sección a partir de un patrón de bloques que muestra una cita de Don Quijote.
«Ves allí, amigo Sancho Panza, donde se descubren treinta, o pocos más, desaforados gigantes, con quien pienso hacer batalla y quitarles a todos las vidas».
— Don Quijote
A continuación tenés el código que genera esa cita de Don Quijote.
<!-- wp:image {"align":"center","width":164,"height":164,"sizeSlug":"large","className":"is-style-rounded"} -->
<div class="wp-block-image is-style-rounded"><figure class="aligncenter size-large is-resized"><img src="https://s.w.org/images/core/5.5/don-quixote-03.jpg" alt="Dibujo a lápiz de Don Quijote" width="164" height="164"/></figure></div>
<!-- /wp:image -->
<!-- wp:quote {"align":"center","className":"is-style-large"} -->
<blockquote class="wp-block-quote has-text-align-center is-style-large"><p>«Ves allí, amigo Sancho Panza, donde se descubren treinta, o pocos más, desaforados gigantes, con quien pienso hacer batalla y quitarles a todos las vidas».</p><cite>— Don Quijote</cite></blockquote>
<!-- /wp:quote -->
<!-- wp:separator {"className":"is-style-dots"} -->
<hr class="wp-block-separator is-style-dots"/>
<!-- /wp:separator -->Si querés probar podés copiar ese código y pegarlo en tu WordPress de prueba (hacerlo en modo código HTML).
Como resultado obtendrás el mismo bloque que tengo de ejemplo aquí en mi web. En ciartos casos puede tener una leve variación de acuerdo al CSS del theme que usas.
Verás que las aplicaciones y el alcance de esto es prácticamente ilimitado, podés crear tu propia biblioteca de bloques.
Patrones de bloques.
Esto de guardar nuestros bloques preferidos (o un grupo de ellos) no es una idea original mía, es algo en lo que viene trabajando la gente de WordPress.
Ellos crearon una solución más profesional a la que denominan “patrones de bloques”. Este artículo de Fernando Tellado te explica cómo crear patrones de bloques.
La idea es guardar secciones completas formadas por distintos bloques para utilizarlas luego. Son como una especie de bloques reutilizables pero mucho más potente.
El editor de bloques de WordPress es tan versátil que podés hacer las cosas de distintas formas y obtener el mismo resultado, podés hacerlo de modo “artesanal” como lo planteo yo o bien de una forma un poco más profesional a partir de los patrones de bloques.
Como digo siempre. Fijate, probá y después me contás como te fue.
Enlaces.
Contacto.
Te dejo el formulario para tus dudas, consultas o comentarios. Al toque te voy a responder.