Sonomobile – från PSD till WordPress

Sonomobile var ett annorlunda jobb för mig då jag oftast sitter och designar en hel del. Den biten var redan avklarad när Sonomobile kom till studion och önskade att omvandla deras .PSD till en fullfjädrad CMS-lösning. Deras önskemål var inget mindre än WordPress, mitt favoritverktyg. Eftersom koncept och mål redan var avklarat med den genomtänkta designen så var det lite mer fokus på att hitta rätt plugins och rätt lösningar.

Vanligtvis när jag sitter här i studion och designar så gör jag vissa designval som är baserade på mina kunskaper om WordPress. Eftersom designen levererades färdig så var det inte riktigt mitt sätt, vilket gjorde att jag fick nya och trevliga utmaningar att handskas med.

Plugins

Det var inte mycket WordPress plugins som utnyttjas på Sonomobiles hemsida:

• List Tags
• My Page Order

Ny funktion – Miniatyrbilder

Med WordPress version 2.9 och uppåt så har man nu möjligheten att lägga till en miniatyrbild på sina inlägg och sidor. Förut så fick man ta till med specialanpassade lösningar som många kunder vek sig för. Idag slipper man det problemet genom att WordPress tar din önskade bild som ska associeras med inlägget och förminskar det (alternativt beskär det) till önskade mått.

Denna utmärkta funktion som även heter the_post_thumbnail(); utnyttjade jag på Sonomobiles framsida, där de tre bilderna är miniatyrbilder som enbart syns på framsidan och som även är inställda att förminskas till 200 x 130 px. När man väl klickar sig in i inlägget så syns inte bilderna. Allt detta sköts i WordPress administrationssida på ett smidigt och enkelt sätt.

Sidor, undersidor och ytterliggare undersidor

Varje sida skulle visa sin egen undersida i en lista som i sin tur skulle kunna visa en nästlad lista vid val. Här finns alltså tre nivåer och vanligtvis när man listar sidor i WordPress så gör man det för alla hemsidans undersidor. Här var det den specifika sidans undersidor som skulle visas och ett par undersidor som i sin tur har egna undersidor som också ska synas i sidomenyn, men bara om man klickar på länken.

Exempel: Klickar du på länken ”Implementering” så dyker tre underlänkar upp. Dessa har alltid varit där, men jag gömde de med hjälp av lite CSS och ordnade så att de bara syns när man klickar på ”Implementering”. Det är egentligen ingen avancerad lösning, men en rätt praktisk sådan och även ny för mig.

Konklusion

Sonomobile visste vad de ville ha med den levererade designen, en genomtänkt design som bryter mot mina vanliga tankemönster. Detta gjorde att jag fick lära mig ny teknik för att åstadkomma en del av hemsidans funktionalitet och det var en väldigt givande inlärningsprocess. Tack till Sonomobile.se för ett givande uppdrag!

2010-01-20 – Sidan är under konstruktion av Sonomobile.se