¿Quieres agilizar el proceso de creación de tus páginas o entradas? ¿Son parecidas o similares la estructura entre ellas? Te explico cómo puedes crear con WordPress Gutenberg una plantilla gracias a los sus bloques y opciones:
Crear plantilla reutilizable con WordPress Gutenberg
¡Volvemos a nuestro magnífico bloque “Fondo”! al igual que lo usamos para crear secciones y poder configurar la anchura etc.. (podéis ver cómo en el apartado de crear sección de ancho completo en Orbital Theme)
Ésta vez aprovecharemos la opción de “Bloques reutilizables”¿quieres sabes cómo?
TIPS CSS Layouts sin anchura completa
Para las secciones que no son de anchura completa, podéis personalizar los bloques de Layouts para destacar éstos conjuntos, elegid entre los siguientes y añadir la clase “layout” a vuestro bloque “Fondo”
/* PERSONALIZAR Layouts en bloque */ .layout{ border-radius:70px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.7), 0 9px 20px 0 rgba(0, 0, 0, 0.19); border: 2px solid darkgrey; } .layout:before{ opacity:0!important; }
Tipos de Bordes
/* tipos para añadir a la propiedad border:dotted
,dashed
,solid
,double
,groove
,ridge
,inset
,outset
,none
,hidden
*/
Box Shadow
/* PERSONALIZAR sombreado */
box-shadow: 0 4px 8px 0 #DDA20B, 0 9px 16px 0 #FFC545;
/*Elegir color y variar las profundidades para probar*/
Efecto Hover
/* LAYOUT HOVER*/ @keyframes bounce { 0%, 20%, 60%, 100% { -webkit-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-20px); transform: translateY(-20px); } 80% { -webkit-transform: translateY(-10px); transform: translateY(-10px); } } .layouthover{ border-radius:30px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.7), 0 9px 20px 0 rgba(0, 0, 0, 0.19); border: 2px solid darkgrey; } .layouthover:before{ opacity:0!important; } .layouthover img{ border-radius:15px; object-fit: cover; overflow:hidden; } @media (min-width: 1040px){ .layouthover:hover{ border: 3px groove #FFC545; box-shadow: 0 8px 10px 0 #DDA20B, 0 10px 16px 0 #FFC545; animation: bounce 1s; } }
Escoger Colores
Ejemplos de Layout de bloques con TIPS CSS
TIP: si usáis secciones a tamaño completo, podéis añadir vuestro Bloque Reutilizable dentro de otro bloque “Fondo” con la clase “fondowp” que se enseña en el apartado de CSS TIPS para Orbital Theme
Ejemplo de conjunto de bloques reutilizables

Ejemplo de bloque compuesto de imagen y texto, botón de llamada a la acción y tabla comparativa.. Éste texto es el ejemplo de una descripción de la imagen o producto que se muestra en éste Layout, para decir que se vende en todos sitios y que tienes que comprarlo AQUÍ
Ventajas
- Éstos Layouts con WordPress y Orbital Theme
- Los Bloques reutilizables son la caña
- Sirven como plantillas predefinidas
Desventajas
- Ninguna
- Soy tan vago que ni con ésto
- Fer házmela tú y ya yo me quejo luego
BARATO

Si crees que todo lo barato sale caro aún no conoces éstos productos
CALIDAD

Te garantizo que éstos productos te van a durar toda la vida, los mejores de 2020
DISEÑO

Vas a poder lucir estilo y glamour, ésta es la tendencia de moda ¡no te la pierdas!

- Optimizado para Gutenberg
- Soporte ilimitado
- Monetiza tu WEB
- Mejora los Rankings en Google
- Actualizaciones de por vida
Últimas Novedades de nuestro Blog
Mira los artículos de nuestro Blog con los mejores consejos tras la experiencia de uso del Tema Orbital enfocado a SEO y posicionamiento.