Design – Joomla templates

Design - Joomla templates

På nettet finder du mange templates til Joomla – både gratis og købe-templates.
Når du har fundet en template, du kan lide, kan du enten bruge den som den er, eller du kan rette den
til. Det kræver lidt kendskab til HTML og CSS, men det er til at overskue.
Hvis du er på bar bund mht. HTML eller CSS, vil jeg anbefale, at du besøger html.dk, som kan hjælpe
dig godt i gang med den del.
Vejledningen her er til Joomla 1.5, da det er den version, jeg selv bruger – men du kan sandsynligvis
overføre det hele eller det meste til de nyere versioner af Joomla.

Find en god template
Først og fremmest skal du finde en lækker template. Det kan tage lang tid, for der er rigtig mange at
vælge imellem.
Jeg plejer at besøge Best of Joomla, hvor du kan søge med versionsnr., søgeord, gratis/betaling og
meget mere. Du finder også mange gode templates hos Joomla24.
Fandt du ikke, hvad du ledte efter? Søg på Google efter “Joomla templates” eller “Free Joomla
templates” – her er der i hvert fald masser at vælge imellem.

Download og installer
Når du har fundet en god template (eller flere), skal du downloade og installere den på dit Joomla-site.

Det gør du ved at gå ind i backend (administrations-siden) og vælge “Extensions” i topmenuen og
derefter “Install/Uninstall”. Ved det øverste felt (Upload package file) klikker du på “Gennemse” og
vælger den fil, du har downloadet. (Hvis filen hedder noget med “unzip_1st” skal du lige unzippe filen
først.) Klik på “Upload file & install”.
Nu er din template installeret, og hvis du går ind under “Extensions” -> “Template manager” kan du
vælge at bruge din nye template. Det gør du ved at sætte et hak i feltet ud for templaten og klikke på
“Default” oppe i højre hjørne af siden.

Templatens opbygning
Via ftp (find et program som f.eks. FileZilla, hvis du ikke har et ftp-program i forvejen. Det er gratis og
meget simpelt at arbejde med) kan du nu rette i din template.
Under /templates/ finder du en mappe med templatens navn. I denne mappe finder du en index.php fil,
som styrer hele din template.
Du finder også en mappe ved navn “css”, som indeholder alle de CSS-filer, der bruges i designet, samt
en mappe ved navn “images”, der sjovt nok indeholder alle de billeder, der bruges i templaten.

index.php
index.php filen i Joomlas templates er helt grundlæggende bygget op ligesom en almindelig php/html
side. Eneste forskel er, at du her og der vil se kodestumper som “<jdoc:include type=”modules”
name=”user3″ />”. Denne stump kode betyder, at her indsættes alle de moduler, som du via
administrationen sætter til positionen “user3”.
Koden indsætter altså en plads, som indeholder alle moduler med en bestemt position.

templateDetails.xml
I templateDetails.xml finder du en række oplysninger, som Joomla skal bruge for at finde rundt i
templaten. For eksempel templatens navn, versionsnr. etc.
Der står også kodestumper som “<position>user3</position>”. Denne kode fortæller Joomla, at du har
en position, der hedder “user3”.
Når denne kode står i templateDetails.xml, vil du på administrations-siden under moduler kunne vælge
den position til dit modul. Strengt taget er det dog ikke nødvendigt at skrive koden ind i
templateDetails.xml – hvis den ikke står der, kan du altid selv skrive dit ønskede positionsnavn på dit
modul. Men ved at skrive koden ind i templateDetails.xml vil positionen dukke op på den liste, du kan
vælge positioner fra på dit modul.
Det anses for god stil at skrive det ind i templateDetails.xml – men det er som sagt ikke strengt
nødvendigt…v

css-mappen
I css-mappen finder du forskellige CSS-filer.
editor.css er til at rette udseendet på din editor – altså det felt du bruger til at indtaste indhold til din
hjemmeside.
Som hovedregel er der ingen grund til at røre denne fil. Men hvis nu templatens designer af en eller
anden grund har lavet hvid tekst på hvid baggrund, kan det i den grad være op ad bakke at rette i sin
hjemmeside – og i så fald er det rart at vide, at du kan rette det i editor.css.
Du vil sandsynligvis også finde filer som f.eks. template.ie6.css og template.ie7.css. Disse css-filer
indeholder små detaljer, som forskellige browsere har brug for for at forstå, hvordan din hjemmeside
skal se ud.
Forskellige browsere kan fungere meget forskelligt, og enkelte af dem har brug for en anden kode end
normalt. Derfor laver man særlige filer til de browsere, og hvis det så er en af de browsere, der skal
læse hjemmesiden, så bliver den bedt om lige at læse den specifikke fil.
Du behøver ikke rette i disse filer.
Den fil, du har brug for, hedder sandsynligvis template.css eller layout.css. Hvis du har begge filer,
er det sikkert template.css, du har brug for. (Men er der noget, du ikke kan finde, så kig i den anden.)

Leave a Reply

Your email address will not be published. Required fields are marked *