Fina typsnitt till din blogg med font-face

font

Webbsäkra typsnitt är ju inte de roligaste att piffa upp sin blogg med men det finns andra alternativ, själv så använder jag sedan en tid tillbaka något som kallas för @font-face. @font-face gör det möjligt att baka in ett valfritt typsnitt på hemsidor och bloggar och som i mitt fall i WordPress.  Hos Font Squirrel finns det massor med typsnitt som är gratis och så här bakar man enkelt in @font-face i sin WordPress-blogg:

@font-face från Font Squirrel

  1. Välj den font du vill ha t.ex. Enriqueta
  2. I menyn högst upp, välj @font-face Kit
  3. Choose a subset: Swedish, låt alla andra inställningar vara
  4. Klicka på ”Download @font-face Kit”
  5. Pack upp zip-filen och döp om mappen där allt ligger t.ex. Enriqueta
  6. Ladda upp hela mappen till din tema-mapp
  7. Öppna din header.php och klistra in länken till css-filen
     <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/Enriqueta/stylesheet.css" media="screen" />
  8. Öppna din style.css och klistra in (eller byt ut) i de rubriker (h1 till h6) som du vill ska använda det nya typsnittet. OBS! Det är inte att rekommendera att använda @font-face Kit i brödtexten <p>
    font-family: 'EnriquetaRegular',Geneva,sans-serif;

    FTP:a upp eller spara din css-fil (om du ändrar via adminpanelen i WordPress).

Så här ser det ut i min css-fil

#content h2, #content h3, #content h4, #content h5, #content h6 { font-family: 'DancingScriptOTRegular',Geneva,sans-serif; color: #FD6847; line-height: 1em; letter-spacing:0px; margin: 0 0 5px 0; }
#content h2 { font-size: 35px; }
#content h3 { font-size: 30px; }
#content h4 { font-size: 26px; }
Related Posts Plugin for WordPress, Blogger...

One thought on “Fina typsnitt till din blogg med font-face

  1. Eva Trillian says:

    Oh! Nu vill jag ju hem och leka med bloggen – och inte sitta här, på jobbet och inte kunna leka :)
    Tack för tipset … nu ska jag bara lista ut om det fungerar på blogger också ;)

Kommentera

E-postadressen publiceras inte. Obligatoriska fält är märkta *