Añadir fuentes personalizadas

¿Qué puedes hacer con esto?

• Coincidir con la tipografía de tu marca — usa exactamente la misma fuente en el flujo de reserva que en tu sitio web.
• Añadir cualquier Google Font que no esté en la lista predeterminada de 30.
• Usar una fuente autoalojada (como una tipografía propietaria) que no está disponible en Google Fonts.
• Reutilizar una fuente que tu tema ya carga sin cargarla dos veces.

Dónde encontrarlo

1. En el menú de administración de WordPress, haz clic en RepairPlugin.
2. Haz clic en Settings en el submenú.
3. En la barra lateral de ajustes, haz clic en Front-End Steps.
4. En la sección Branding, busca el desplegable Choose a font.

Después de añadir una fuente personalizada mediante código, aparece en este desplegable junto a las fuentes integradas.

https://www.repairplugin.com/wp-admin/admin.php?page=wp_repair_settings&section=styling

https://www.repairplugin.com/book-a-repair

Cómo configurarlo

Esta es una función de nivel desarrollador. Necesitarás añadir un fragmento de código al archivo functions.php de tu tema o a un plugin personalizado.

Añadir una Google Font

Añade este código al archivo functions.php de tu tema (o un plugin específico del sitio):

add_filter( 'rp_get_font_options', 'my_custom_rp_font', 10, 1 );

function my_custom_rp_font( $fonts ) {

    $fonts['my_custom_font'] = array(
        'name'        => 'My Custom Font',
        'font_link'   => '<link href="https://fonts.googleapis.com/css2?family=My+Custom+Font:wght@300;400;500;600;700&display=swap" rel="stylesheet">',
        'font_family' => '"My Custom Font", sans-serif',
    );

    return $fonts;
}

Cada entrada de fuente necesita tres valores:

La clave del array (por ejemplo, 'my_custom_font') debe ser un slug único — minúsculas, sin espacios, usando guiones bajos.

Añadir una fuente autoalojada

Si tu fuente no está disponible en Google Fonts, aloja el archivo de fuente tú mismo y referéncialo:

add_filter( 'rp_get_font_options', 'my_selfhosted_rp_font', 10, 1 );

function my_selfhosted_rp_font( $fonts ) {

    $font_url = get_stylesheet_directory_uri() . '/fonts/MyBrandFont.woff2';

    $fonts['my_brand_font'] = array(
        'name'        => 'My Brand Font',
        'font_link'   => '<style>@font-face { font-family: "My Brand Font"; src: url("' . $font_url . '") format("woff2"); font-weight: 100 900; font-display: swap; }</style>',
        'font_family' => '"My Brand Font", sans-serif',
    );

    return $fonts;
}

Asegúrate de que el archivo de fuente (por ejemplo, .woff2) esté ubicado en el directorio referenciado dentro de tu tema.

Usar una fuente que tu tema ya carga

Si tu tema de WordPress ya carga la fuente, configura font_link como una cadena vacía. RepairPlugin usará el valor de font_family directamente:

add_filter( 'rp_get_font_options', 'my_theme_font_for_rp', 10, 1 );

function my_theme_font_for_rp( $fonts ) {

    $fonts['theme_font'] = array(
        'name'        => 'My Theme Font',
        'font_link'   => '',
        'font_family' => '"My Theme Font", sans-serif',
    );

    return $fonts;
}

Seleccionar tu fuente personalizada

Después de añadir el código:

1. Ve a RepairPlugin > Settings > Front-End Steps.
2. En la sección Branding, abre el desplegable Choose a font.
3. Tu fuente personalizada ahora aparece en la lista.
4. Selecciónala y haz clic en Save Changes.
5. Comprueba tu página de reservas para verificar que la fuente se ve bien.

Referencia de ajustes

Fuentes integradas

RepairPlugin incluye estas 30 fuentes por defecto: Archivo, Arial, Assistant, Barlow, Cabin, DM Sans, Fira Sans, Hind, Inter, Josefin Sans, Kanit, Karla, Lato, Manrope, Merriweather, Montserrat, Muli, Noto Sans, Nunito, Open Sans, Oswald, Playfair Display, Poppins, Quicksand, Raleway, Roboto, Roboto Slab, Signika, Source Sans Pro, Titillium Web, Ubuntu y Work Sans. La fuente por defecto (cuando no se selecciona ninguna) es Montserrat.

Preguntas frecuentes

Artículos relacionados

• Marca (Logo y color)
• Estilo del formulario de reparación
• Shortcodes