editor de bloques (Gutenberg), que además de potenciar la personalización y customización del tema, introduce más complejidad, sobre todo en el caso deModificación y personalización del estilo de fuenteAspectos. En este artículo, exploraremos en detalle las mejores prácticas sobre cómo modificar los estilos de fuente en el editor de bloques de WordPress e implementar fuentes personalizadas a través de plugins.
I. Modificación del estilo de fuente
En los temas de bloque de WordPress, existen diferencias de prioridad en cómo afectan a las fuentes las distintas posiciones de los ajustes de fuente. Comprender estas prioridades es fundamental para modificar con precisión los estilos de fuente. En la práctica, los ajustes de mayor prioridad anularán los de menor prioridad. Por ejemplo, en el mismo artículo, si más de una posición de configuración de fuente actúa sobre la fuente del párrafo al mismo tiempo, el estilo real mostrado se basará en la configuración con la prioridad más alta.
El orden de prioridad es el siguiente:
- Estilos específicos de bloque
- Estilo bloque
- "Estilo "Contenido
- "Estilo "Texto
A continuación, tomamos como ejemplo el tema de bloque de WordPress "Twenty Twenty-Four", presentando cómo modificar el estilo de fuente en diferentes configuraciones, incluyendoTamaño de letra, grosor, inclinación, altura de línea, interlineadoetc.
En segundo lugar, la posición de la fuente y el análisis de prioridades
En el tema del bloque hay varias posiciones de ajuste de fuente, cada una con una prioridad de ajuste diferente. A continuación se indican las cuatro posiciones principales de ajuste de fuente y sus prioridades, ordenadas de menor a mayor, con ejemplos concretos para demostrar su impacto.
1. Configuración de fuentes División I: Configuración de fuentes de texto para todo el sitio
colocación: Personalizar > Estilos > Editar estilos > Tipografía > Texto
Alcance del impactoEsta opción afecta a la mayoría de las fuentes de texto del sitio, incluidos los números de página, párrafos, listas, detalles, preformatos, tablas, versículos, etc. Sin embargo, los encabezados no se ven afectados por esta configuración. Puede utilizar la función "Vista previa" para ver qué módulos se ven afectados por este estilo.
2. Ajustes de fuente División III: Ajustes de fuente del bloque de párrafo
colocación: Personalizar > Estilos > Bloques > Párrafos
Alcance del impactoEsta configuración afecta a todo el sitio".pasajes" La fuente del bloque, otros tipos de configuración del bloque afectan igual.
Tercero, cómo personalizar las fuentes en WordPress
Las modificaciones de estilo de fuente mencionadas anteriormente se refieren principalmente al tamaño de la fuente, grosor, altura de línea, etc., pero el tema viene con una selección limitada de fuentes. Si desea utilizar más fuentes, especialmente fuentes de Google, le recomendamos que utilice "Plugin de fuentes"Plugins".
tenga en cuentaComo este plugin utiliza fuentes de Google, es posible que no se cargue correctamente en servidores nacionales. Si su servidor web está en China, por favor elija otro plugin.
Cómo personalizar las fuentes con el plugin Fonts
El plugin ofrece dos modos de configuración: básico y avanzado. Puede ajustar el estilo de fuente de todo el sitio en la configuración básica, o refinarlo a la fuente del nombre del sitio, la fuente de la barra de navegación, la fuente del título del artículo, etc. en la configuración avanzada.
procedimiento:
- Instalar y activar el plugin: Busque en la página de plugins del backend de WordPress "Plugin de fuentes", instalado y activado.
- Ir al personalizadorVaya al Personalizador de WordPress y verá la adición de "Plugin de fuentes"Opciones.
- Configuración de fuentesPuede elegir diferentes tipos de letra para aplicarlos a elementos como el contenido general, los encabezados, los botones y otros. Si necesitas un control más preciso, puedes utilizar la opción de ajustes avanzados para configurar las fuentes de los distintos elementos por separado.
- Previsualizar y guardarAl modificar las fuentes, puedes previsualizar el efecto en tiempo real para asegurarte de que las fuentes seleccionadas coinciden con el estilo del sitio web. Cuando esté seguro, haga clic en "guardar (un archivo, etc.) (informática)"Hacer efectivos los cambios.
Preguntas frecuentes y soluciones
cuestiones: Las fuentes "Negrita" no son visibles en los artículos
razonamiento: Cuando se utiliza el plugin para establecer la fuente a "Noto Serif SC"y ajuste el grosor a "medio" Cuando el estilo de negrita por defecto del navegador está más cerca del estilo "medio", por lo que el efecto "negrita" no es obvio.
curaAñadir estilos personalizados mediante "CSS adicional" para dar diferentes grosores de fuente al texto en negrita. Por ejemplo
strong {
font-weight: 900; /* ajustar aquí según sea necesario */
}
IV. Resumen
En el editor de bloques de WordPress, el uso razonable de la modificación del estilo de fuente y de los plugins de fuentes personalizadas puede mejorar en gran medida el efecto visual y la experiencia de usuario de su sitio web. Comprender la prioridad de las diferentes posiciones de configuración de fuentes y utilizar estas configuraciones de forma flexible puede ayudarte a controlar mejor el estilo general de tu sitio web.