NYE KOMMENTARER

Bloggen har skiftet udseende i disse dage – vel at mærke kun små, næsten umærkelige ændringer, som ikke bryder med med det overordnede layout. Som tidligere bemærket er kodning absolut ikke min stærke side, men for at tweake dette layout er jeg nødt til at bevæge mig på tynd is, nemlig den bagvedliggende PHP-kode.

Sidebaren er ikke widget-venlig – alle ændringer/tilføjelser kan kun foretages via koden. Det tager sin tid for mig, men – naturligvis især når resultatet er tilfredsstillende – det er ganske sjovt arbejde. Således er den lille Twitter-tilføjelse lavet vha. en plugin og indsættelse af linien <?php twitter_messages('uggerholt', 2, false, true, '#', true, true, false) ?>  
Dette kan ikke kaldes ‘at springe over, hvor gærdet er lavest’ – Twitter er leveringsdygtig i flere forskellige widgets, der kan tilpasses i farver og størrelse, hvorefter en kodestump genereres til copy-paste på fx webside eller blog uden yderligere bekymringer for funktionaliteten. Noget nemmere end den løsning, jeg her har valgt, men bærer præg af genkendelige standard-elementer.

Da jeg nu var i gang, er de øvrige eksisterende elementer rykket op eller ned, og for en dels vedkommende opdateret. Endvidere er der tilføjet en helt ny, lille sektion, nemlig en footer, og flere oplysninger flyttet dertil eller tilføjet (bl.a. kodekræs som min spambeskyttede, krypterede email). Og der er skiftet skrifttype overalt – tidligere var Verdana førstevalg, nu Helvetica hhv. Arial (bruges hvis første skrift ikke er installeret på brugerens maskine).

Forhåbentlig medvirker disse tiltag til at bevare layout’ets enkelhed – trods Twitter-tilføjelsen – en del oplysninger flyttet fra sidebar til sidefod med mindre punktstørrelse, og skiftet fra Verdana til Helvetica bidrager væsentligt til en mere tiltalende fremtræden.

Men et ikke ubetydeligt irrititationsmoment er Google’s nye oversættelses-gadget/widget (den gamle virkede slet ikke mere), som ganske vist i sig selv ser pænere ud end den tidligere, men indeholder et script, som indledningsvis (kan lukkes ved klik) placerer et grimt, hvidt Google Translate banner over bloggen. Aldeles unødvendigt, før man rent faktisk vælger en eller anden oversættelse – det er jo ikke Google, som har indflydelse på, hvad der står på originalsproget dansk. Jeg overvejer pt helt at fjerne sidebar-elementet pga. dette æstetiske attentat – hvad synes læseren?

Som tidligere beskrevet er jeg ‘webmaster’ for den andelsboligforening, hvor jeg bor. Sitet er lavet i WordPress, og har nu – efter talløse experimenter og en del timers arbejde, ikke mindst med oversættelse engelsk-dansk – fundet en (i hvert fald lige nu) endelig form i SimpleX temaet, som ses herunder:

Både beboere, bestyrelse og jeg selv er rimelig tilfreds med resultatet, der er ‘fremtidssikret’ mht. fx udvidelse af menuantal og er forberedt for ‘fuldfedt’ nyhedsbrev vha. en (testet!) plugin, der pt. dog mangler en del oversættelse (og selvfølgelig aktivering).

Blandt ønsker/ideer til sitet var muligheden for nemt at kunne skrive til webmaster. Selvfølgelig er der ingen ben i at indsætte en email-adresse i footer’en, men, som jeg tidligere har nævnt, ligger det mig ret meget på sinde så vidt muligt at undgå spam-mail, og at skrive sin mailadresse åbenlyst, er en næsten 100% sikker måde at havne i mailinglister, der så benyttes til udsendelse af bulk-mails med mere eller mindre tvivlsomt indhold (typisk porno, receptfri Viagra, casinoer og investeringsmuligheder).

Blot at erstatte @ med (at) er så åbenlyst gennemskueligt, at de fleste spambots også ‘forstår’ betydningen (mens en lille del af brugerne nok desværre ikke fatter det). Og jo ‘bedre’ metoden til at skjule mail-adressen er, jo sværere er det at opretholde hensyn til usability – jeg har anvendt en metode, der kræver at Javascript er aktiveret i browseren (og man får en meddelelse om dette, hvis Javascript af en eller anden grund ikke er aktiv).

Bag ordene ‘Søren Uggerholt’ gemmer sig følgende kode, der betyder ‘<a href=”mailto:…’ osv.

<script type="text/javascript"><!--
<! 
var x="function f(x){var i,o=\"\",ol=x.length,l=ol;while(x.charCodeAt(l/13)!" +
"=48){try{x+=x;l+=l;}catch(e){}}for(i=l-1;i>=0;i ){o+=x.charAt(i);}return o" +
".substr(0,ol);}f(\")44,\\\"meozpo1`r9 $\\\"\\\\;- !020\\\\d-'3{WM\\\\\\\\PH" +
"U730\\\\kt\\\\420\\\\iXZS\\\\\\\\U710\\\\KIBNYt\\\\ZF600\\\\WKE200\\\\JIsU?" +
"@&#038;771\\\\ul~b56O771\\\\~s!zaccxlo`sEpno520\\\\t\\\\430\\\\020\\\\220\\\\600" +
"\\\\K000\\\\130\\\\700\\\\000\\\\600\\\\010\\\\A=b;>+?u2mme%%\\\"\\\\1*3H32" +
"0\\\\OWRXFR@I\\\"(f};o nruter};))++y(^)i(tAedoCrahc.x(edoCrahCmorf.gnirtS=+" +
"o;721=%y;++y)44<i(fi{)++i;l<i;0=i(rof;htgnel.x=l,\\\"\\\"=o,i rav{)y,x(f no" +
"itcnuf\")"                                                                   ;
while(x=eval(x));
//-->
// --&gt;
// --&gt;
// --&gt;
// --&gt;
// --&gt;</script>

Nej, jeg har selvfølgelig ikke selv fundet på det – koden er genereret på denne side.
Så håber jeg bare, at man ikke ikke dér registrerer min mail mhp. videresalg

Som ‘almindelig’ Mac-bruger er der en række fænomener, man ganske og aldeles lever i lykkelig uvidenhed om, fx virus – som enhver Windows-bruger jo er nødt til at forholde sig  og sørge for modtræk til, mens en Macintosh (især pga OS X’s fundamentale struktur) er 100% immun overfor.
Men hvis man stifter bekendtskab med webudvikling, er det uundgåeligt at tage i betragtning at næsten 25% (aktuelt, men faldende) af alle internet-brugere faktisk stadig anvender en forældet, fejlbehæftet browser, Internet Explorer 6, der endvidere i høj grad er ‘indsyltet i styresystemet’, så det er åbent for infektioner via nettet.
De websites, som udvikles af min arbejdsplads, Propeople, er altid browserkompatible, altså fungerer de, uanset hvad kunden bruger. Og jeg véd, hvor mange særregler og programmeringsmæssige fif, der skal til for at opnå, at websitet kan fungere på trods af især Explorer 6′s ejendommeligheder.
Der pågår en slags krig på browsermarkedet og indenfor webudvikling, som Mac-brugere også lever i delvis uvidenhed om – læs om den her – og der er pt efterhånden en kampagne med mottoet ‘Stop living in the past’, rettet mod alle de mennesker, som bare bruger deres PC, som den var, da de købte den – uden at bekymre sig om nye versioner af softwaren.
Disse brugere vil være meget bedre tjent med at bruge fx Firefox, Safari eller Opera … eller opgradere til Explorer 8, der ér officielt udgivet. Der findes (selvfølgelig…) en række Facebook-grupper med formålet, der er WordPress-plugins, som viser en advarsel/opfordring, og der er kodestumper på flere sprog, som man kan bruge.
Et emsempel:

Dette skilt møder nu brugeren i toppen af Today’s joke – i hele browservinduets bredde – men kun, hvis man bruger Explorer 6.

Har brugt flere timer på forskellige experimenter med implementeringen af denne blogs ‘tag cloud’ i sidebjælken til højre, men læseren kan næppe se nogen som helst iøjnefaldende forandring. Der er lavet adskillige udgaver af tag cloud plugins til WordPress, og jeg har efterhånden prøvet mig frem med en del forskellige, men er vendt tilbage til den første igen!
De øvrige afprøvede viste sig alle at indebære en eller flere uhensigtsmæssigheder og/eller direkte fejl/mangler, fx mht. indstilling af farver og angivelse af antal for de enkelte kategorier – den allerførst anvendte var faktisk overlegen på disse områder, efter at jeg havde lært at ‘tweake’ koden lidt mere, end jeg kunne til at begynde med. Da jeg jo ikke er nogen ørn til programmering (og ikke har ambitioner om at blive det), kan jeg ikke straks identificere de linier, der skal omskrives for at få det ønskede resultat, men er nødt til at bruge en del tid på trial-and-error.
Når slutproduktet så ikke er mere påfaldende end som så, men ender tæt på udgangspunktet, nærmer processen sig futilt arbejde i betænkelig grad – og (som i øvrigt tidligere anført): jeg kan virkelig ikke lide at arbejde forgæves.
Anyway, min tag cloud er mere tilfredsstillende for mig selv nu, end den var i går – ‘code is poetry’, som de siger hos WordPress, men det er f***me også tough.

I dag har jeg leget en smule både med denne blog og mit website.
1) Bloggen har fået tilføjet knap på alle blogposts mhp. let at kunne dele emnet vha. sociale bogmærker. Dette er rørende nemt, og kan gøres helt uden kodning, blot med en plugin hentet her.
Knappen kan fås i adskillige varianter, afhængig af om den skal bruges til website eller blog – og til hvilken blogplatform.
2) Et emne, som går igen de fleste steder, hvor der rådgives om ‘god webskik’, er fordingen om at brugeren altid med lethed kan se hvor han/hun er, og hvordan man – om ønsket – kan komme tilbage til forsiden (‘hjem’).
Denne navigation kræver en ‘brødkrummesti’, atså en visuel indikation af sted og vej i sitets hierarki. Mht. mit eget site er det overordentlig nemt at rundt, da der ikke er ret mange underniveauer, og navigationen frem og tilbage kan ske vha. browserens indbyggede knapper – men alligevel googlede jeg efter ‘breadcrumb navigation for any website’ og fandt dette:

<script>&lt;br /&gt;
&lt;!--&lt;br /&gt;
//Bread crumb script - Kevin Lynn Brown&lt;br /&gt;
//Duplicate directory names bug fix by JavaScriptKit.com&lt;br /&gt;
//Visit JavaScript Kit (http://javascriptkit.com) for script&lt;br /&gt;
var path = "";&lt;br /&gt;
var href = document.location.href;&lt;br /&gt;
var s = href.split("/");&lt;br /&gt;
for (var i=2;i&lt;(s.length-1);i++) {&lt;br /&gt;
path+="&lt;a href="\" mce_href="\"""+href.substring(0,href.indexOf("/"+s[i])+s[i].length+1)+"/\"&gt;"+s[i]+"&lt;/A&gt; / ";&lt;br /&gt;
}&lt;br /&gt;
i=s.length-1;&lt;br /&gt;
path+="&lt;A HREF="\" mce_HREF="\"""+href.substring(0,href.indexOf(s[i])+s[i].length)+"\"&gt;"+s[i]+"&lt;/A&gt;";&lt;br /&gt;
var url = window.location.protocol + "//" + path;&lt;br /&gt;
document.writeln(url);&lt;br /&gt;
//--&gt;&lt;br /&gt;
</script>

Kodestumpen indsættes blot dér, hvor man ønsker navigationen – altså skal den laves på hver enkelt side, så som en spæd begyndelse (og vellykket experiment) har jeg indføjet scriptet på en enkelt side.
At det kan gøres så simpelt overraskede mig en hel del – tak til ophavsmanden … og selvfølgelig tak Google

I den glimrende blog for ex-Grafix’ere har Peter for nylig sat sig som mål at skrive en blogpost hver dag. Jeg bifalder målsætningen, men selv har jeg ikke tid til at gøre ligeså hér, så det nærmeste jeg kommer på et sådant løfte, er at jeg (som hidtil) vil skrive hyppigt.
Men i dag er det absolut ikke vejr til udendørs aktiviteter, så jeg har ‘nørdet’ lidt med at lave et nyt favicon (det lille symbol, som nogle sites viser i browserens adresselinie til venstre for http-adressen). Ændringen er lavet både på mine sider af nerderiet og mit ‘eget’ domæne – slår igennem overalt, da koden jo allerede er implementeret, så det er bare at uploade en enkelt lille fil (favicon.ico) af den rigtige type på hvert domæne.
Det forrige smiley-favicon var genereret vha. dette site, mens de nye er lavet vha. en plugin til Photoshop, som føjer Windows-formatet .ico til Photoshop’s arkiveringsmuligheder. Jeg kan ikke illustrere, hvordan min tekst-smiley så ud, da WordPress laver den om til ikon
Sådan et ‘favicon’ er kun 16*16 px, så der er stærkt begrænsede muligheder for eventuelle kunstneriske udfoldelser.
Den gratis plugin kan hentes hos Telegraphics.com.

Det ‘forpligtende’ menupunkt Today’s Joke er efterhånden opdateret over 30 gange, og jeg er blevet lidt træt af at skulle finde noget nyt hvér eneste dag. Der er masser af kilder på internettet til sådanne vittigheder, men jeg er ikke ukritisk – bruger jeg én, skal jeg selv synes den er morsom, og det krav opfylder kun et mindretal. (Selvfølgelig skal den også være offentlig tilgængelig uden copyright).
For at slippe nemmere ledte jeg efter en metode til at vise billeder randomiseret fra en ‘pool’, og fandt en side, hvor en William Bontrager viser en meget nem Javascript-metode med blot få liniers kode til formålet.
Først dette i header:

<script type="text/javascript" language="JavaScript">
<!-- Copyright 2002 Bontrager Connection, LLC
NumberOfImagesToRotate = 34;
FirstPart = '<img src="pics/joke_files/jokes/joke';
LastPart = '.jpg">';

function printImage() {
var r = Math.ceil(Math.random() * NumberOfImagesToRotate);
document.write(FirstPart + r + LastPart);
}
//-->
</script>

Funktionen kaldes så i body:

<script type="text/javascript" language="JavaScript"><!--
printImage();
//--></script>

Efter lidt trial-and-error fik jeg det til at virke perfekt med netop den kode, der er gengivet her – jeg har kun de første 34 vittigheder i ‘bunken’ der vælges fra, men det er let at tilføje nye efterhånden, navngivet som beskrevet i artiklen, der henvises til, samt ændre antallet i NumberOfImagesToRotate.
‘Code is poetry’.

Min netop oprettede tag-cloud var skæmmet af, at første ord stod rykket lidt ind på linien. At den i øvrigt står venstrestillet trods angivelse af centrering kan jeg leve med, men første linies indrykning var iøjnefaldende og grim. Og jeg kunne ikke gennemskue årsagen til denne lille ulempe.
Søgte i koden og prøvede mig frem – forgæves, lige ind til jeg trodsede denne ret explicitte tekst om, at dette skulle man ikke pille ved:
#labelCloud .label-cloud li:before{content:"" !important}<br />
Fjernes denne linie helt, fjerner man også det omtalte problem.

Denne blogs html er igen ændret en smule på følgende punkter:

1) Navigation bar er igen gemt (af grafisk/æstetiske hensyn) ved at indsætte kodestumpen

#navbar-iframe, #b-navbar{
visibility: hidden;
display: none;
height: 0px;
}

2) Jeg faldt endvidere over en anden udgave af den anvendte blogskabelon (Beckett), som havde linier for indsættelse af kode-tekst som illustreret ovenfor.

3) Den modificerede skabelon har også punktet ‘blockquote’, som tager sig sådan ud:

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

Næppe noget, jeg kommer til at bruge ret meget, men Blogger’s redigeringsværktøj indeholder selv denne option, og nu kan den bruges – som skabelonen var før, stod den således indsatte tekst ganske som de øvrige linier.

Der var en forskel mellem de to versioner af min hjemmeside, som irriterede mig en hel del, både mht. funktion og især fordi jeg ikke kunne gennemskue årsagen.
Problemet var, at besøgte links opførte sig forskelligt ved mouseover (ikke-besøgte virkede begge steder som jeg ønskede) – på den nye side skiftede de ikke farve, som jeg ville have dem til at gøre, men reglen var fuldstændig éns i de to kodeudgaver…
Uden overhovedet at ane noget om dette, lykkedes det mig at ‘løse’ mysteriet, bare ved at bytte om på reglerne a:hover og a:visited, så rækkefølgen nu er:

a:visited {
text-decoration: none;
color: #666666;
}
a:hover {
color: #FFFF00;
text-decoration: underline;

Om dette er basal html-viden, véd jeg som sagt slet ikke, men udbryder spontant ‘heuraka’ – det virker!