Estilos de texto

H1

Títulos de los post, títulos de las paginas o textos cortos que se quieran destacar mucho. Evitar su uso en el interior de los post y utilizar preferiblemente el H3.

H2

Subtitulares dentro de un post. Es posible combinarlos aplicando negritas para añadir varios niveles de profundidad al contenido como en listados o bullets.

H3

Uso en el excerpt de los post aplicando el custom color elegido de forma automática. 

H4

Vestibulum eu vestibulum felis. Pellentesque dictum, dolor et aliquam egestas, massa justo semper felis, et vehicula augue erat vitae est.

H5
Praesent posuere arcu nunc, id venenatis nibh facilisis et. Praesent sodales turpis sed ante tincidunt sollicitudin. Phasellus sed ultricies tortor. Curabitur sit amet mollis massa. Suspendisse sagittis congue velit.
H6
Nam tristique pharetra cursus. Suspendisse molestie lacinia blandit. Pellentesque metus ex, dignissim mattis nisl a, ultricies tempus tortor. Nunc ultrices tortor ac mi finibus malesuada. Nullam porttitor metus eget turpis euismod, eget pharetra ante vulputate.

P

Vestibulum mattis imperdiet tellus, vel mattis ligula eleifend ut. Proin laoreet enim nisi, vitae ultrices urna pretium non. Praesent nibh eros, tristique a fringilla convallis, convallis vestibulum leo. Vivamus tempor egestas sapien, sit amet cursus tortor hendrerit a. Cras nunc purus, ullamcorper in ligula ac, lacinia hendrerit erat. Nunc ultricies mi eget urna bibendum congue. Suspendisse molestie placerat quam eget ultricies. Aenean a purus nec leo blandit tempor. Maecenas tempus orci id augue suscipit, sit amet sollicitudin justo lobortis. Proin ultricies augue volutpat, egestas nulla vitae, consequat erat. Quisque at tempus ligula, in volutpat sapien. Phasellus enim mi, scelerisque in massa fringilla, luctus dignissim magna.

Estilos de texto plantillas

Estos estilos aparecen definidos cuando se utiliza Elementor como editor y son similares a los utilizados en CSS dentro de la pagina.

Principal

Sed vehicula sapien flelis, sed ultricies mauris luctus quis. Fusce eu nulla vel ligula dictum varius. Sed sed hendrerit ex, id lobortis leo.

Secundario

Sed vehicula sapien flelis, sed ultricies mauris luctus quis. Fusce eu nulla vel ligula dictum varius. Sed sed hendrerit ex, id lobortis leo.

Texto

Sed vehicula sapien flelis, sed ultricies mauris luctus quis. Fusce eu nulla vel ligula dictum varius. Sed sed hendrerit ex, id lobortis leo.

Énfasis

Sed vehicula sapien flelis, sed ultricies mauris luctus quis. Fusce eu nulla vel ligula dictum varius. Sed sed hendrerit ex, id lobortis leo.

Titulo

Sed vehicula sapien flelis, sed ultricies mauris luctus quis. Fusce eu nulla vel ligula dictum varius. Sed sed hendrerit ex, id lobortis leo.

H2

Sed vehicula sapien flelis, sed ultricies mauris luctus quis. Fusce eu nulla vel ligula dictum varius. Sed sed hendrerit ex, id lobortis leo.

Excerpt

Sed vehicula sapien flelis, sed ultricies mauris luctus quis. Fusce eu nulla vel ligula dictum varius. Sed sed hendrerit ex, id lobortis leo.

Post titular

Sed vehicula sapien flelis, sed ultricies mauris luctus quis. Fusce eu nulla vel ligula dictum varius. Sed sed hendrerit ex, id lobortis leo.

Crear un Post

Se pueden crear nuevos post utilizando el editor clásico de WP o el editor visual llamado Elementor. Para crear post sencillos se recomienda utilizar el editor clásico de WP y para post donde se quieran crear layouts más originales o incluir más elementos multimedia se usaría el editor visual Elementor.

Independientemente del tipo de post que se está creando hay información que debe introducirse en el editor clásico como el título del post, slug, excerpt, categoría, featured image y custom color. Después de crear un post nuevo e incluir esta información se puede seguir incluyendo el contenido en el mismo editor clásico o pulsar el botón de la parte superior EDIT WITH ELEMENTOR.

Evitar títulos demasiado largos

Excerpt es utilizado en varios listados del blog como introducción al contenido y en la pagina de un post sirve de entradilla. Es importante que siempre tenga una longitud similar entre unos post y otros para evitar que los listados de post queden escalonados con espacios en blanco.

Deben subirse imágenes cuadradas con proporción 1:1 ya optimizadas de 1080x1080 px en formatos jpg o png.

No subir archivos con nombres que incluyan acentos, eñes y otros caracteres no problemáticos en internet.

Web para optimizar imágenes: tinypng kraken.io

Utillizar sólo las categorías de primer nivel presentes en el menú principal

Es recomendable añadir el custom color después de subir la Featured Image, de ese modo podemos utilizar una extensión para el navegador que incluya la función cuenta gotas o eyedropper para elegir un color sobre la miniatura de la imagen. Si no se edita el color siempre queda por defecto el azul neutro.

El slug se genera de manera automática pero es posible que en títulos muy largos sea interesante acortarlo para no generar URLs demasiado largas

Panel del plugin Yoast para optimización SEO

Añadir GIF desde Elementor

Para utilizar imágenes GIF en las entradas se debe tener en cuenta tanto el peso de los archivos como el peso visual que representan sobre el total del contenido.

La cantidad de imágenes que se añaden en un post pueden afectar mucho al posicionamiento y velocidad de carga de la pagina de modo que no hay que abusar de ellas y tratar de mantener un equilibrio entre su número y peso total.

Por ejemplo si se usan GIF que sean trozos de películas pueden ocupar bastante al tener muchos fotogramas y por lo tanto no se debería abusar de ellos en un mismo post.

Para evitar el interface de Giphy los GIF se añadirán copiando su propia URL o descargando el archivo y subiendo este a la librería de WordPress como el resto de imágenes, teniendo en cuenta que si se utiliza la URL es posible que con el tiempo si el GIF original es eliminado este dejará de aparecer.

Widget Imagen

Utilizar siempre el Widget Imagen para imágenes individuales. Si se quieren añadir varias imágenes como un elemento hay disponibles varios widgets para ello como el carrusel, galería, imagen destacada, etc.

Insertar imagen

La imagen se puede descargar desde su pagina de origen como puede ser Giphy o se puede copiar su URL e insertarla directamente para que la cargue sin tener que descargarla. En este último caso es recomendable descargarla igualmente para poder comprobar que su peso no es excesivo

Tamaño de la imagen

Para estar seguros de que su peso es el mismo que cuando subimos la imagen aplicaremos la opción completo de forma que la imagen que se muestra es la misma que la que hemos subido y no una versión creada por WordPress internamente

Ancho de la imagen

Por último en la pestaña de estilo ajustaremos el ancho de la imagen al 100% para que rellene el ancho de la columna de contenido. En el caso de imágenes cuadradas este ancho tendrá que ajustarse a un 80% o lo que se considere necesario ya que si ocupa todo el ancho de la columna también será muy alto ocupando demasiado espacio dentro del contenido.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum vitae sollicitudin magna. Phasellus eu neque iaculis, aliquam enim ut, pretium odio. Sed elementum felis ac risus hendrerit, at iaculis massa accumsan. Fusce elementum neque non arcu dapibus, quis lobortis purus lobortis. Sed pellentesque convallis faucibus.

¡Apúntate para recibir nuestras novedades, lecciones y mucho más!

Introduce tus datos para mantenerte informado

Introduce tus datos para mantenerte informado