Hemsidor

Så gjorde vi en sportevenemangs-applikation av WordPress

Svenska Grapplingligan (SGL) är Sveriges största turnering för submission wrestling-utövare i hela landet. Trots att grappling (submission wrestling) som sport inte funnits så många år i Sverige har den redan lockat till sig hundratals klubbar och tusentals utövare. Varje år arrangeras ett antal deltävlingar inom de sex regioner som man delat upp landet i för att slutligen avgöra mästarna för säsongen i en nationell final. Vårt uppdrag var att skapa en smidig webblösning för att registrera tävlingar och hantera anmälningar, matchlistor, matchresultat, ranking, m.m.

Varför WordPress?

Det vi direkt kunde konstatera var att det inte fanns något bra färdigt sportevenemangshanteringssystem(?) att använda sig av. Att skapa vår egen speciallösning såg vi därför som ofrånkomligt. Dock ville vi undvika återuppfinna hjulet för de mest grundläggande byggstenarna som databaslager, mallramverk, m.m. Med ett öppet CMS som WordPress får man dessutom ett väldokumenterat API och tillgången till miljoner färdigskrivna tillägg som ger ett ovärderligt mervärde.

Utmaningarna

  • Att ersätta WordPress vanliga administrationsverktyg (wp-admin) med rollanpassade och ändamålsenliga verktyg för tävlingarnas administratörer och deltagare.
  • Att stöpa om WordPress vanliga sätt att hantera användare för att koppla användare till tävlingar och dela upp dem efter säsong, region, klubb, viktklass, kön och erfarenhetsnivå.
  • Att utifrån sportens regelverk automatisera och förenkla förfarandet för att skapa matchlistor, registrera matchresultat samt beräkna poäng och ranking.

Vad är det för fel på WordPress administrationsverktyg?

Vi såg direkt det orimliga i att släppa in alla användare i WordPress administrationsverktyg med hänsyn till all information vi behövde ha kontroll över i programmeringen och de begränsade möjligheterna att anpassa administrationsverktygets gränssnitt och funktion. Istället bestämde vi oss för att plocka russinen ur kakan och bara tillgängliggöra den funktionalitet som användarna behöver med vårt eget rollanpassade webbgränssnitt.

Varför ändra på hur WordPress hanterar användare?

Att utöka vilka uppgifter som ska lagras om varje användare är en relativt smal sak för en någorlunda erfaren WordPress-utvecklare. Problemet är att vi dessutom ville kunna styra över användarinformationen i programmeringen och koppla den till våra egna informationstyper. Exempelvis att användaren ska vara den som uppger sitt kön och sin vikt i sin användarprofil medan vår programmeringslogik utifrån den informationen sätter korrekt viktklass. Ett annat exempel är att när användaren uppgett vilken klubb denne tillhör så ska systemet läsa ut vilken region användaren tillhör utifrån klubbens regionstillhörighet.

Resultatet

För att visa hur resultatet blev har vi valt att göra fem korta filmklipp; ett som visar hur administratören skapar ett tävlingsevenemang, ett som visar hur man registrerar en ny användare, ett som visar hur användaren anmäler sig till en tävling, ett som visar hur administratören för en tävling skapar matchlistor och till sist ett som visar hur administratören registrerar matchresultat.

Skapa tävling:

Registrera ny användare:

Anmälan till tävling:

Skapa matchlistor:

Registrera matchresultat:

Tekniska lösningarna

OBS! För dig som är lite mer tekniskt intresserad av våra lösningar tänkte jag här berätta lite mer om det, ni andra kan skippa denna bit utan att känna skam. 🙂

Som den erfarne webbutvecklaren kanske redan lagt märke till har vi varit flitiga användare av ramverket Bootstrap. Vidare har vi använt oss av en hel del jQuery och inte bara för visuella effekter. För att minska antalet klick och sidladdningar skapade vi vårt eget API för AJAX-anrop som hanterar att läsa så väl som skriva till databasen.

Vad gäller det som inte är lika synligt har vi en informationsarkitektur som ställer mycket speciella krav på funktionerna för att läsa och skriva till databasen. Till vår hjälp har vi använt oss mycket av ett tillägg som heter Taxonomy Metadata. Med det har vi kunnat utöka informationen kopplad till varje taxonomi och term för att bl.a. skapa relationer mellan informationstyper som annars varit omöjligt eller väldigt svårt.

Med en allt mer komplex informationsarkitektur får man dock vissa problem med WordPress standardfunktion för att iterera genom poster, även känd som ”The Loop”. Kort och gott; alltför många loopar i looparna gör så väl WordPress som utvecklare snurriga. Ett annat problem var WordPress sätt att koppla permalänkar till vilken sidmall som ska visas. Det slutade med att vi utökade WordPress permalänksystem och mallramverk för att helt ta kontrollen över vilka funktioner, variabler och sidmallar som ska laddas för vilken permalänk.

Med lite ”mörk programmerar-magi” fick vi till en funktion som läser en enkelt utformad YAML-fil för att sätta permalänk-regler och en funktion för att haka på sidmallar och funktioner på permalänksreglerna, allt detta innan WordPress uppfattat vilken permalänk som efterfrågas och vilken mall som ska laddas. Lösningen är dock utformad så pass att man fortfarande kan ladda vanliga WordPress-mallar som vanligt lika väl som man kan välja att helt åsidosätta dem. På detta sätt plockar vi verkligen russinen ur kakan vi kallar WordPress.

Sist men inte minst kan det vara värt att nämna att vi använt oss av ett tillägg som heter WordPress Social Login för att låta användare registrera sig och logga in med sitt facebook- eller googlekonto.

Sidan inlägget handlar om hittar du på adressen: http://grapplingligan.se

Glada sponsorer av Norrköpings Stunt Camp!

Norrköpings Stunt Camp är ett event för unga att gratis prova på häftiga stunts. De visar även grymma föreläsningar och har filmvisningar som både barn och vuxna är välkomna till.

Nu i juli är det dags och är deras andra år i rad och vi på Angry Creative sponsrade dem genom att bygga en schysst webbplats.

Kolla in sidan och deras Facebook.

Ny sajt åt Skyltspektrum!

Vi här på webbyåran teamade upp med Skyltspektrum igen för en ny webbplats.

2010 gjorde vi designen åt Skyltspektrum medans Kafit byggde sajten i CMS’et Midgard. Den här gången var det WordPress som gällde, för ett enkelt och smidigt redaktionellt arbete.

De hade en rätt tydlig vision om hur sidan skulle kunna se ut så vi utgick ifrån en mall de själva gjorde som vi hade lov att modifiera efter tycke.

Upplägget av sidan är blockbaserat, lite som Pinterest. För att lösa detta använde vi oss av det häftiga jQuery-pluginet Masonry som pusslar ihop blocken så de passar in så bra som möjligt beroende på storlekarna. Masonry räknar även om när man ändrar storlek på webbläsaren vilket enkelt gjorde sidan responsiv så den ser bra ut på alla enheter.

I och med detta samarbete passade vi även på att uppgradera oss lite och köpte en helt galen skylt!

Joomla! – Sämsta CMS valet

Det finns många aspekter att ta i beaktning när man väljer administrationssystem (CMS) till sin hemsida. Vissa saker såsom hur systemet är designat är självklarheter för alla att kolla upp då det är vad man faktiskt ser när man använder systemet, medan andra saker såsom IT-säkerhet är någonting som går över huvudet för gemene man.

Joomla! är ett CMS system som en längre tid varit mycket utsatt för problem och har således blivit ett ‘svart får’ bland IT-människor, och en favoritmåltavla för hackare. Varför har det då blivit såhär? Och varför fortsätter det ändå att dyka upp nya installationer dagligen?

Joomla! och slarvkulturen

Joomlas största problem just nu är inte systemet i sig, utan många av människorna som livnärar sig på att sälja och göra hemsidor i systemet. Då många (men långt ifrån alla) av de som tillhandahåller Joomla! lösningar inte är särskilt duktiga på vad de gör har detta lett till en stor marknad där man kan köpa och sälja allt ifrån färdiga mallar till moduler – tilläggsprogram – till Joomla.

Affärsmodellen fungerar helt enkelt så att man oftast köper färdiga mallar och moduler som man klipper och klistrar i en eftermiddag och sedan säljer antingen som en billig mallösning – eller ibland till och med som en skräddarsydd hemsida (vilket är uppenbart lurendrejeri).

Detta är i sig inget problem, men när kompetensen saknas i så många led och det finns väldigt få granskande instanser så blir kvalitén därefter. Öppen källkod är fantastiskt, men det kan lätt slå slint om ”nördarna” lämnar projektet och de enda som finns kvar är säljare helt utan moral. Resultatet blir att både Joomla! och många modulerna är mycket dåligt programmerade. Vad innebär då detta för den som sitter med en Joomla! lösning?

Joomla! har mängder av säkerhetsproblem

Nämner man ordet Joomla! för någon som driver webbhotell eller jobbar med IT och säkerhet brukar man oftast mötas av en uppsjö av svordomar. Jag har inte pratat med en enda reklambyrå som inte haft säkerhetsproblem med sina klienters Joomla! installationer. De blir hackade på löpande band, och sprider sedan virus och annat till de som går in på sidorna. Och när de väl lagas tar det ibland bara en timme innan sidan är hackad igen.

Anledningen till att det blir såhär är dels på grund av att tilläggen är dåligt programmerade, men också på grund av att många av tilläggen är köpta. I och med att de är köpta finns de inte fritt tillgängliga när man vill göra uppgraderingar. I många system som inte bygger på öppen källkod kan man köpa tilläggen en gång och sedan uppgradera enkelt – men eftersom Joomla! är öppen källkod finns det ingen sådan lösning – och borde aldrig finnas heller. Modulerna bör istället släppas som öppen källkod, precis som Joomla! och sedan vara uppgraderingsbara med ett klick.

Tills dess att oseriösa aktörer rensats ut och modulernas kvalité höjts avsevärt bör inte någon använda Joomla!, till någonting.