Font gratuïta d’alta qualitat amb productes i icones de la web


Des de wordpress han creat una tipografia on enlloc de fer servir lletres cada gliph és una imatge que representa un icona dels elements més comuns de la web, com per exemple icones per indicar calendaris o fotografies i també de serveis com linkedin o youtube.

Aquestes imatges estan dissenyades com a tipografies de maneres que es veuen a tots els navegadors, a totes les resolucions i en qualsevol esquema de color, i fins i tot es poden fer instal·lar a l’ordinador per fer textos o dissenys amb programes de dibuix. Les icones per defecte estan en negre.

genericons

La web oficial és genericons.com

Si volem fer servir aquestes fonts en les nostre webs tenim tres opcions a dia d’avui:

La fàcil (només wordpress)

La manera més fàcil és directament fent servir una extensió per fer-ho. L’extensió més coneguda és genericond.

Un cop tinguem l’extensió instal·lada, podem posar les icones amb un shorcode o amb una etiqueta de css:

  • [[genericon icon=twitter]] -> 
  • <div class="genericon genericon-twitter"></div> -> 

Més difícil però genèrica

Aquesta opció ens serveix tant si fem servir wordpress com qualsevol altre sistema per fer les nostres pàgines web. Simplement necessitem un espai en el servidor on pujar la carpeta font i el fitxer genericons.css que hi ha en els continguts del fitxer zip que es pot descarregar de la web aquí.

estructura

A la declaració de la fulla d’estils hem de indicar la ubicació del fitxer css
<link href="ruta/a/genericons.css" rel="stylesheet">

I per fer servir les icones ho hem de fer fent servir la classe corresponent dins d’etiquetes div.

<div class="genericon genericon-standard"></div> ->


 

Per afegir el css al tema en el cas de wordpress es pot fer fent servir una extensió com my custom css o segons el tema incrustant directament el codi css a la capçalera (això és el que fet en el tema lightword).

Per la gent pacient

A partir de la pròxima versió de wordpress, la 3.6, sembla que s’integraran les icones de genericons amb el sistema per defecte. O sigui que a partir de llavors no caldrà ni tan sols instal·lar res. Està pendent a dia d’avui encara saber com es farà exactament o sigui que toca esperar per aquesta opció.

 

Més informació aquí

Add a Comment

L'adreça electrònica no es publicarà. Els camps necessaris estan marcats amb *