Google Web Fonts et la génération de PDF à partir de HTML avec wkhtmltopdf

une solution simple: Base64-Encoder votre police et l'intégrer dans le CSS:

@font-face {
    font-family: 'OpenSans';
    src: url(data:font/truetype;charset=utf-8;base64,AAEAAAATAQA...
}

FontSquirrel peut le faire pour vous à travers les options avancées de leur générateur Webfont ; Google et d'autres polices peuvent être encodés avec cet outil .

j'ai utilisé cette solution avec pdfkit et wicked_pdf , qui fonctionnent à travers wkhtmltopdf, donc je présume que cela devrait fonctionner avec le natif wkhtmltopdf aussi.

j'ai eu ce même problème et je l'ai résolu en téléchargeant les polices et en les exécutant à partir d'un fichier local dans mon serveur web avec cette déclaration de police-face:

@font-face {
    font-family: 'PT Sans';
    src: url( '/public/inc/fonts/PTS55F-webfont.eot');
    src: url( '/public/inc/fonts/PTS55F-webfont.eot?#iefix') format('embedded-opentype'),
         url( '/public/inc/fonts/PTS55F-webfont.woff') format('woff'),
         url( '/public/inc/fonts/PTS55F-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

j'ai pu trouver cette police sur Font Squirrel , mais votre kilométrage peut varier.

je pense que ce qui se passe avec les polices hors de Google est qu'il essaie de charger seulement le format qu'il pense que ce navigateur veut, qui pour WebKit est woff (je crois). Mais wkhtmltopdf ne peut pas intégrer une police woff dans un PDF, et donc renvoie par défaut à sans-serif. En les déclarant tous, la police TrueType est incluse, ce qui est ce que le PDF utilise réellement.

aussi, vous devez définir la police que vous voulez utiliser comme la première dans n'importe quelle définition de police-family CSS ou wkhtmltopdf va juste l'ignorer.

je viens de tester que l'utilisation de la notation @import fonctionne:

<style>
@import 'https://fonts.googleapis.com/css?family=Montserrat';
</style>

j'utilise django-wkhtmltopdf version 2.0.3

j'ai dû essayer un gazillion variations pour obtenir ce travail (de local). J'essaie d'intégrer Open Sans Condensed dans un pdf via WKHtmlToPdf.

je pense qu'il est important que vous téléchargez et installez le TTF ouvert sans condensé directement à partir de google et de l'installer. Il est également important de redémarrer pour permettre l'accès aux autres services après l'installation. J'ai téléchargé le ttf de font-squirrel à l'origine et condensé A ÉTÉ RÉPERTORIÉ COMME "Open Sans" dans windows / fonts, ce qui est faux, si vous vous occupez de l'installation de google, elle est listée comme "Open Sans Condensed Light" donc même le script local('Open Sans Cond Light') de google est faux.

Comme mentionné avant, vous devez être explicite avec l'étirement et le poids, c'est ce qui a fonctionné pour moi:

    @font-face { 
     font-family: 'Open Sans'; 
     font-style: normal; 
     font-weight: 400; 
     src: local('Open Sans');
    }

    @font-face { 
     font-family: 'Open Sans Condensed'; 
     font-stretch:condensed; 
     font-style: normal; 
     font-weight: 300; 
     src: local('Open Sans Condensed Light');
    }

@@font-face { font-family: 'Open Sans Condensed Bold'; font-stretch:condensed; font-style: normal; font-weight: 700; src: local('Open Sans Condensed'), local('Open Sans Condensed Bold');}

Cela fait environ deux jours que je lutte avec cela, mon conseil pour vous si aucune des réponses ci-dessus ne fonctionne pour vous:

installez la police (ttf) dans la machine qui héberge le serveur web et exigez-la simplement dans le css comme vous le feriez avec une police commune.

body{
    font-family: 'Lato';
}

Now wkhtmltopdf devrait pouvoir inclure la police

dans mon cas j'ai juste dû ajouter cette option

--javascript-delay 1000

et Google Font text ont commencé à apparaître.

[wkhtmltopdf 0.12.4 (avec Qt corrigé)]

assurez-vous de ne pas déclarer la police avec laquelle vous imprimez dans votre feuille de style.