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 IronPDF de C# 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 fuentes utilizando 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 conWebFonts (como Google Fonts y la API de fuentes web de Adobe) y fuentes de iconos, como las utilizadas por Bootstrap yFontAwesome.
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 utilizar el método WaitFor.AllFontsLoaded para esperar la fuente asignándole un tiempo máximo de espera. El tiempo máximo de espera por defecto es de 500 ms.
He aquí un pequeño ejemplo de cómo utilizar unWebFont llamado Langosta en su 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 las relativas a fuentes, JavaScript, elementos HTML y ralentí de red en la página 'Documentación de la clase WaitFor de IronPDF.'
Importar archivo de fuentes Ejemplo
Para utilizar un archivo de fuentes existente, aplique la función@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, utilizaréPixelify Sans Font.
: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
EnPlataforma de alojamiento Azure no admite que los servidores carguen fuentes SVG en sus niveles inferiores 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.
