Cómo configurar fuentes en PDF
Una fuente web es una fuente especializada diseñada para su uso en sitios web. Estas fuentes se alojan en servidores web y son descargadas por los navegadores para garantizar una representación coherente y visualmente atractiva del texto en los sitios web, independientemente de la disponibilidad local de fuentes del usuario. Además, las fuentes de iconos, que utilizan símbolos y glifos, se usan a menudo en diseño web para crear iconos escalables y personalizables y mantener una interfaz de usuario visualmente coherente mediante la manipulación de CSS.
CSS incluye fuentes web, lo que le permite especificar archivos de fuentes para descargar cuando se accede a su sitio web. IronPDF admite la carga de fuentes y el renderizado a PDF desde HTML.
Cómo configurar fuentes en PDF
- Descargar la biblioteca C# IronPDF para configurar fuentes en PDFs
- Utilizar HTML para importar o solicitar fuentes de una fuente externa
- Retrasar el proceso de renderizado para garantizar la carga correcta de las fuentes.
- Convierta el HTML en PDF como de costumbre
- Importar archivo de fuente usando la regla @font-face en el estilo CSS
Comience con IronPDF
Comience a usar IronPDF en su proyecto hoy con una prueba gratuita.
Ejemplo de uso de WebFonts e iconos
IronPDF es compatible con WebFonts (como Google Fonts y la API de fuentes web de Adobe) y fuentes de iconos, como las utilizadas por Bootstrap y FontAwesome.
Las fuentes suelen requerir un retraso en la renderización para cargarse correctamente. Si una fuente no se carga correctamente, puede aparecer una página en blanco sin texto. Puede usar el método WaitFor.AllFontsLoaded para esperar a que se cargue la fuente asignándole un tiempo máximo de espera. El tiempo máximo de espera por defecto es de 500 ms.
Aquí tienes un pequeño ejemplo de cómo usar un WebFont llamado Lobster en tu proyecto.
:path=/static-assets/pdf/content-code-examples/how-to/webfonts-webicons-render-webfont.csusing IronPdf;
// HTML contains webfont
var html = @"<link href=""https://fonts.googleapis.com/css?family=Lobster"" rel=""stylesheet"">
<p style=""font-family: 'Lobster', serif; font-size:30px;"" > Hello Google Fonts</p>";
ChromePdfRenderer renderer = new ChromePdfRenderer();
// Wait for font to load
renderer.RenderingOptions.WaitFor.AllFontsLoaded(2000);
// Render HTML to PDF
PdfDocument pdf = renderer.RenderHtmlAsPdf(html);
// Export the PDF
pdf.SaveAs("font-test.pdf");Imports IronPdf
' HTML contains webfont
Private html = "<link href=""https://fonts.googleapis.com/css?family=Lobster"" rel=""stylesheet"">
<p style=""font-family: 'Lobster', serif; font-size:30px;"" > Hello Google Fonts</p>"
Private renderer As New ChromePdfRenderer()
' Wait for font to load
renderer.RenderingOptions.WaitFor.AllFontsLoaded(2000)
' Render HTML to PDF
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf(html)
' Export the PDF
pdf.SaveAs("font-test.pdf")Explore más opciones de WaitFor, como aquellas para fuentes, JavaScript, elementos HTML y red inactiva en la 'Documentación de la clase WaitFor de IronPDF'.
Importar archivo de fuentes Ejemplo
Para usar un archivo de fuente existente, aplica la regla @font-face en el estilo CSS. También funciona cuando se utiliza una combinación de la regla @font-face y la incrustación de archivos woff codificados en base64. En el siguiente ejemplo, usaré la fuente Pixelify Sans.
:path=/static-assets/pdf/content-code-examples/how-to/webfonts-webicons-custom-font.csusing IronPdf;
// Import custom font
string html = @"<!DOCTYPE html>
<html>
<head>
<style>
@font-face {font-family: 'Pixelify';
src: url('fonts\PixelifySans-VariableFont_wght.ttf');
}
p {
font-family: 'Pixelify';
font-size: 70px;
}
</style>
</head>
<body>
<p>Custom font</p>
</body>
</html>";
ChromePdfRenderer renderer = new ChromePdfRenderer();
// Render HTML to PDF
PdfDocument pdf = renderer.RenderHtmlAsPdf(html);
// Export the PDF
pdf.SaveAs("customFont.pdf");Imports IronPdf
' Import custom font
Private html As String = "<!DOCTYPE html>
<html>
<head>
<style>
@font-face {font-family: 'Pixelify';
src: url('fonts\PixelifySans-VariableFont_wght.ttf');
}
p {
font-family: 'Pixelify';
font-size: 70px;
}
</style>
</head>
<body>
<p>Custom font</p>
</body>
</html>"
Private renderer As New ChromePdfRenderer()
' Render HTML to PDF
Private pdf As PdfDocument = renderer.RenderHtmlAsPdf(html)
' Export the PDF
pdf.SaveAs("customFont.pdf")Limitaciones de Azure PDF
La plataforma de alojamiento Azure no admite servidores cargando fuentes SVG en sus niveles más bajos de aplicaciones web compartidas. Sin embargo, los VPS y Web Role de Azure no están sandboxed de la misma manera y sí soportan el renderizado de fuentes web.
