Jacob Jensen | Jacob Jensens blog om webdesign

tirsdag den 16. august 2011

Facebook Metatags

Må hellere lige for en god ordens skyld præsentere hele FB-koden
Nedenstående placeres i <head>

<!-- facebook meta #start ************************* -->
<meta content='Jacob Jensens blog om Webdesign, mm.' property='og:title'/>
<meta content='website' property='og:type'/>
<meta content='http://jacob-jensen.blogspot.com/' property='og:url'/>
<meta content='http://www.jjweb.dk/images/jjweb-blog-facebook.png' property='og:image'/>

<meta content=http://www.ditsite.dk' property='og:site_name'/>
<meta content='din beskrivelsen som af sitet' property='og:description'/>
<meta content='DIT-FB-BRUGER-ID' property='fb:admins'/> 
<!-- facebook meta #end   ************************* -->

Nedenstående skal placeres i <body> hvor man ønsker FB.

<!-- facebook #start ************** -->
<div id='fb-root'/>
<script language='javascript' src='http://connect.facebook.net/da_DK/all.js#xfbml=1'/>
<fb:like action='like' font='segoe ui' href='http://jacob-jensen.blogspot.com/' layout='button_count' send='false' show_faces='false' width='200'/>
<!-- facebook #end   ************** -->

Du skal være opmærksom på at du ikke kan være logget på FB, når du bruger deres værktøjer. Dette også selvom du er medlem af deres developer group. Jeg kunne i hvert fald ikke!

Du skal også være opmærksom på at W3.org ikke anerkender Facebook metatags som valide!

Tjek hvad din Facebook kode melder tilbage

I disse Facebook-tider er det altid rart at kunne se, hvad ens website melder tilbage - hvad der bliver posted på FB. Det kan man via Facebook Developers.

Via deres Object Debugger kan du se, hvad din siden generere på Facebook.

onsdag den 10. august 2011

Brug egne skrifter på dine Websites 2

Her er en stump CSS, der viser koderne til alle font-typerne.

@font-face {
    font-family: 'DroidSerifRegular';
    src: url('../DroidSerif-Regular-webfont.eot');
    src: url('../DroidSerif-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../DroidSerif-Regular-webfont.woff') format('woff'),
         url('../DroidSerif-Regular-webfont.ttf') format('truetype'),
         url('../DroidSerif-Regular-webfont.svg#DroidSerifRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}
body, p { 
  font-family: 'DroidSerifRegular', Verdana, Tahoma;
}

<p >Hello world!</p>

søndag den 31. juli 2011

Brug egne skrifter på dine Websites

Et forsøg på at ændre skrifttyper på en hjemmeside. Det virker fint i Firefox og Chrome, men ikke i Explorer.

<style type="text/css">
  @font-face {
  font-family: "My Custom Font";
  src: url(http://www.example.org/mycustomfont.ttf) format("truetype");
}
p.customfont { 
  font-family: "My Custom Font", Verdana, Tahoma;
}
</style>

<p class="customfont">Hello world!</p>

For understøttelse i IE, skal fonten konverteres til EOT-formatet. Jeg har fundet et glimrende online værktøj til at generere stylesheet'et og font'ne. Med @font-face Generator kan du uploade dine fonte og automatisk få genereret stylesheet og web-formater af fonten.

Bemærk: At fonten SKAL ligge i samme mappen som den side den skal vises på, ellers virker det ikke

Et hurtigt eksempel kan ses her!

onsdag den 6. juli 2011

Flash vejr widget

Så lykkedes det endelig at få min flash-vejr-widget lavet. Der har været problemer undervejs, specielt pga. flash security-policy som gør det besværligt at hente variabler fra andre servere.
Jeg lavede et ASP-Script til at generere XML-siden server-side og dermed tror Flash at den får variablerne fra den lokale server og ikke en remote server.

Jeg henter data fra http://www.weather.com/, hvor jeg har oprettet en konto gratis.

Jacob Jensen | Jacob Jensens blog om webdesign | jjweb.dk