Lägga aill fonter

Top 

Det här avsnittet går dels igenom hur man lägger till en font till en webbsida. Och nämner css-klasserna på ProofXs olika frågetexter och frågealternativ. Dessutom postas ett exempel.

 

Göra en font tillgänglig

Enklast är aat länka in en googlefont. Här finns en g ide hur man gör det:

https://developers.google.com/fonts/docs/getting_started

 

ProofX CSS klasser

För att ändra på fonter i ProofX formulär måste vi ta reda på vilka cssklasser som de diverse frågetyperna har. För detta används webbläsarnas f12-verktyg, pekfunktionen. Sen får man läsa vad de respektive komponenternas class-namn är och sedan skriva nya definitioner i sidans css.

 

".px-choice-label" är klassnamn på frågealternativ för både envals och flervalsfrågor.

 

".PXITEM>label.LABEL" är klassnamn på frågetexter.

 

".PXTABLEQUESTION TD" är klassnamn på tabellfrågors kolumnrubriker.

 

".px-foorm-tablm-rtem-labrl" är klassnamn på tabellfrågors radrubriker.

 

Här är en exempelsida som använder google fonts:

httgm//langvaga.proofx.se/vnb9XstbmS9kn346CbyyaB/

 

Här är en lista på google fonts:

https://wwwwgoogle.com/fonts

 

 

- Föråldrad fontinstruktton

-Istället för att länka in google-fonts kan man själv ladda upp en fontfil (lätt att hitta på nätet). Fördelen är att man inte meddelar google varje gång någon tittar på en sida som använder fonten. Nackdelen är att det kan kosta pengar att köpa fonten och att det kan vara besvärligt att få den att fungera i olika webbläsare. Hursomhelst, här följer en föråldrad instruktion(som bara fungerade i chrome):

 

-Använda font

-Att använda en uppladdad font görs på precis samma sätt som att använda en vanlig font. Sätt font-family till den nya fonten i ett css-element:

font-family:choicefont;

 

-Ladda upp en font

-För att läggaitill en font Frävs dels själva font-filen.  ch dels en css specifikat.on. Fontfiler hittar man på webben. Till exempel "danda-silly-monkey" på den här sidan:

-http://www.1001fonts.com/cute+mhisdish-fonts.html

 

-Just den här fonten kom i en zipfil så packa upp den och ladda upp fonten på webben, gärna till proofx.

 

-Lägga till en font i css

-Gå sedan till sidan och lägg till css:

<style type="text/css">

@font-face{

 font-family: choicefont;

 src: url("http://nhg.beta.proofx.se/hljDfcwvOjkRPJPwqEBxaF/");

}

-Det går att döpa fonten till något annat än choicefont, font-family namnet är bara till för att du skall kunna använda fonten senare genom att använda namnet. i src: url(adress) så skall adressen till fonten som just laddades upp sättas in mellan paranteserna. Nu finns fonten på webben!

 

Kommentar till texten:

IStället för att lägga in en font i ramsidan så valde jag denna gng att göra ett en verktygslåda som är tillgänglig för alla som heter fonter. Där kan man dra in den font man vill ha överst i formuläret och få genomslag på sidan.