In this post, we will see how to do just that – to create different sizes of text on one line, in a single paragraph using Elementor and CSS. You can now make individual words or letters bigger or smaller than the rest of the text within the same text widget! And not just that, but you can use different styling, color and text-decoration properties as well! The solution isn’t straightforward, but it is extremely easy. It is using so called “span” elements to mark up pieces of text that can be styled differently from the rest of the paragraph. We will be using Elementor builder and just a few lines of code. So, let’s get to it!
IMPORTANT NOTE: If you are using CSS classes to define your text styling, this process will differ just a bit. Let’s first see how it looks like if you are editing the text directly in Elementor page, without defining CSS classes.
If you are not using custom CSS classes to style the text and you just want to make these text changes local, on a single place on your website, then once you’ve switched to ‘Text’ editor, simply decide which part of text you would like to appear in different size (bigger or smaller). Add <span> before it and </span> after it to close it. The ‘span’ marks up part of the text (or simply put, words) that you can then style differently than the rest of the paragraph, while keeping it within the same class and same paragraph. Dentro de la etiqueta <span>, puedes añadir todas las propiedades que quieras que tenga este trozo de texto utilizando la llamada “estilo”. Puedes cambiar el color, el tamaño de la fuente, el estilo, etc.
Editor de texto de Elementor Problema de tipografía [solución]OtrosEditor de texto de Elementor Problema de tipografía [solución] Tamaño de la fuente, el color, la altura de la línea problema fijoSi usted trabaja con elementor usted puede ver Editor de texto Widget tiene algún problema en el cambio de tipografía.tamaño de la fuente y algunos otros estilos no funcionan correctamente. Quizás lo arreglen en la próxima actualización pero hasta entonces puedes usar un CSS simple en tu área de CSS personalizado para arreglar este problemaSi usas la versión gratuita de elementor puedes ir a Personalizador > CSS personalizado o Si tienes la versión Pro de elementor puedes usar su panel de CSS personalizadoPon este código css en el lugar que prefieras para usar css personalizadoCustom Css
El uso de encabezados en su contenido es una gran manera de captar la atención del usuario con una fuente de mayor tamaño. En la mayoría de los temas de WordPress, los encabezados tienen una fuente más grande que el texto normal. Permiten dividir tus entradas y páginas en secciones.
El bloque estará por defecto en el encabezado 2. Normalmente, tiene sentido seguir con el Título 2 para sus subtítulos. Si quieres cambiar esto, puedes simplemente hacer clic en el desplegable “H2” para seleccionar un tamaño diferente.
Estas opciones no están disponibles en el antiguo editor clásico de WordPress. Si quieres usarlas, entonces piensa en hacer el cambio. Nuestro tutorial sobre cómo utilizar el nuevo editor de bloques de WordPress te ayudará.
Esperamos que este artículo te haya ayudado a aprender cómo cambiar fácilmente el tamaño de la fuente en WordPress. Quizás también quieras ver nuestra guía sobre cómo usar fuentes personalizadas en WordPress o nuestra lista de los mejores plugins constructores de páginas de WordPress de arrastrar y soltar.
La caja de herramientas definitiva de WordPressObtenga acceso GRATIS a nuestra caja de herramientas – una colección de productos y recursos relacionados con WordPress que todo profesional debería tener¡Descargue ahoraInteracciones del lector172 ComentariosDeja una respuesta
Hola, he actualizado elementor a la versión 3.0.4 pero sigue el mismo problema. Ni las fuentes globales ni los colores se muestran. Las fuentes y colores correctos son visibles en el backend pero el frontend sigue siendo un desastre. El navegador sólo escoge una fuente del sistema y el color por defecto (gris) para los encabezados.
Selecciono PRIMARY HEADLINE para el título de la página, pero sigue desapareciendo. También selecciono un color (blanco) y cambia a un color marrón. Los tamaños también siguen cambiando de lo que les puse en la tableta y el móvil. Tengo un widget de pestañas en una página y no muestra el contenido de la primera pestaña cuando entras por primera vez en la página. Tienes que hacer clic en la segunda pestaña y luego volver a la primera pestaña.
Después de varias horas de pruebas, finalmente conseguí que funcionara, parecía ser una combinación de desmarcar “colores por defecto” y “fuentes por defecto” en la pantalla principal de configuración de elementor en wp-admin, además de este truco – hacer clic en el icono “volver a los valores predeterminados” bajo cada uno de esos ajustes de fuente. Después de eso, fui capaz de ajustar el tamaño de la fuente después de restablecer h1 y h3.