Adición de fuentes personalizadas
Las páginas AMP no pueden incluir plantillas externas, con la excepción de fuentes personalizadas. Puede incrustar en su página fuentes personalizadas de dos maneras:
- Mediante una etiqueta
<link>
: solo para proveedores de fuentes autorizados. - Mediante
@font-face
(sin restricciones, se admiten todas las fuentes)
1. Utilizando <link>
Utilice la etiqueta <link>
(generalmente en el encabezado de su página), de la siguiente manera:
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Tangerine">
Los orígenes siguientes se incluyen en la lista blanca y se permite el uso de fuentes mediante etiquetas <link>
:
- Typography.com: https://cloud.typography.com
- Fonts.com: https://fast.fonts.net
- Google Fonts: https://fonts.googleapis.com
- Typekit: https://use.typekit.net
- Font Awesome: https://maxcdn.bootstrapcdn.com, https://use.fontawesome.com
2. Utilizando @font-face
Alternativamente, puede utilizar @font-face
dentro de su hoja de estilos AMP:
<style amp-custom> @font-face { font-family: "Bitstream Vera Serif Bold"; src: url("https://somedomain.org/VeraSeBd.ttf"); } body { font-family: "Bitstream Vera Serif Bold", serif; } </style>
Las fuentes que se incluyen con
@font-face
debe buscarse mediante ambos esquemas, ya sea HTTP o HTTPS. -
Written by @pbakaus