Rogient Block Fonts en WordPress con consejos de carga

Bloque Rogient Es una fuente sans-serif con una estructura geométrica muy personalizada y líneas atrevidas, lo que la hace especialmente adecuada para sitios web con un aire más tecnológico y moderno. Si su sitio web necesita este tipo de estilo duro y moderno, quizá le interese añadir Rogient Block a la colección WordPress Pruébalo en.

Este post trata sobre cómo funcionan las fuentes Rogient Block en WordPress, incluyendo el proceso completo de subirlas, traerlas y mostrarlas en la página.

I. Preparación de los archivos de fuentes

En primer lugar, debe descargar la fuente Rogient Block, cuyo formato de archivo general es el siguiente .ttf tal vez .otfY a veces hay .woff tal vez .woff2.

Si el objetivo es cargar fuentes en una página web, se recomienda utilizar la función .woff tal vez .woff2son más pequeños, se cargan más rápido y son más fáciles de navegar.

Descomprime el archivo descargado y guárdalo, lo necesitarás más adelante.

En segundo lugar, cargue las fuentes en el sitio web de WordPress

Para utilizar fuentes personalizadas en WordPress, se recomienda utilizar plugins para ello. Los más utilizados son:

Plugin de fuentes personalizadas

Vaya a Backstage → Plugins → Instalar plugin.
Busque "Fuentes personalizadas", haga clic en Instalar y activar
Una vez instalado, vaya a Backstage → Apariencia → Fuentes personalizadas.
Añade una nueva fuente llamada "Rogient Block".
Cargar archivos de fuentes (recomendado) .woff responder cantando .woff2)
Guardar ajustes

De esta forma habrá añadido correctamente las fuentes a su sistema WordPress.

III. Uso de fuentes en relación con el tema

Los distintos temas admiten fuentes personalizadas de formas diferentes, pero siempre que utilices un tema como AstraBlocksy, GeneratePress,Kadence Los temas que admiten fuentes personalizadas podrán llamar a la fuente que acabas de cargar directamente en la configuración del tema.

Por ejemplo, Astra:

Vaya a Backstage → Panel de control → Tipografía

En las opciones de fuente, busque el "Bloque Rogient" que acaba de añadir.

Aplíquelo a encabezados, cuerpo de texto, botones y otras áreas donde sea necesario
Publicar Guardar

Si utiliza el Elementor ProTambién puedes seleccionar esta fuente directamente en "Ajustes del sitio → Tipografía" de Elementor.

En cuarto lugar, no utilice plug-ins, directamente con la introducción del código está bien

Si no desea utilizar un plugin, también puede cargar manualmente los archivos de fuentes en el directorio del tema y, a continuación, pasar la propiedad CSS Introducido. Por ejemplo:

clasificador para objetos con asa .woff2 El archivo se carga en el tema actual de fuentes/ archivo (papel)
Editar el tema del style.css Documentación, además:

@font-face {
  font-family: 'Rogient Block';
  src: url('fonts/rogient-block.woff2') format('woff2');
  font-weight: normal;
  font-style: normal; }
}

A continuación, especifique los elementos de página que deben utilizar esta fuente, por ejemplo:

h1, h2, .site-title {
  font-family: 'Rogient Block', sans-serif;
}

Una vez guardada, actualice la página para que la nueva fuente surta efecto.

V. Compatibilidad de fuentes y recomendaciones de carga

Las fuentes Rogient Block, aunque son únicas en su estilo, no son compatibles por defecto con todos los sistemas, por lo que las fuentes(de carga, etc.) cargaEl planteamiento debe ser fiable.

Recomendación:

Ofrece varios formatos de fuentes (por ejemplo .woff2 responder cantando .ttf)
Además de fuentes alternativas, por ejemplo:

font-family: 'Rogient Block', 'Arial', sans-serif;

Fuentes precargadas para una visualización más rápida (disponibles en el <head> (Añadir enlace precargado en)

resúmenes

Si quieres utilizar la fuente Rogient Block en tu sitio web WordPress, puedes cargarla con la ayuda de un plugin o escribir CSS manualmente para conseguirlo. Configúrala con un tema o editor de páginas y se mostrará perfectamente en tu página.

Contacte con nosotros
¿No puede leer el tutorial? Póngase en contacto con nosotros para obtener una respuesta gratuita. Ayuda gratuita para sitios personales y de pequeñas empresas	Servicio de atención al cliente WeChat
① Tel: 020-2206-9892
② QQ咨询：1025174874
(iii) Correo electrónico: info@361sale.com
④ Horario de trabajo: de lunes a viernes, de 9:30 a 18:30, días festivos libres