Vi skal udvikle en skabelon til sitets forside, der kommer til at se sådan ud:

Skabelonen Forside henter bl.a. overskrift, indhold og udvalgt billede fra den side vi vælger til forside, det kan komme til at se sådan ud:

Du har brug for en forside, hvor sitets ejer kan redigere indholdet på forsiden.

Skab sitets side-struktur

Navigationsblokke virker bedst, hvis du opretter de sider der skal bruges før du sætter menuen ind. På den måde findes oplysningerne om siderne i databasen.

• Begynd med at oprette de vigtigste sider:
  • Forside – husk at give siden et udvalgt billede.
  • Blog – husk også at give denne side et udvalgt billede.
  • Tilføj gerne flere sider, fx “CV”, “Kontakt”, “Find vej”, “Galleri”, etc.

Du kan senere tilføje endnu flere sider. Lige nu har vi disse sider (jeg har slettet modelsiderne, som kommer med WP).

Indstillinger

Under indstillinger skal WP vide, hvor indholdet hentes fra:

Nu ser sitet sådan ud:

Opret skabelonen Forside

Skabelonen Forside – eller Frontpage – bliver til sitets forside, når den er oprettet, når vi har et hierarkisk site.

1. Gå ind i Udseende > Skabeloner
2. Klik på den blå knap “Tilføj skabelon”
3. Vælg “Forside” (Frontpage)

Når denne skabelon oprettes bliver den automatisk til sitets forside – lidt i stil med filen index.html i klassisk HTML.

Som konsekvens af dette bliver skabelonen Blog-forside knyttet til den side du kaldte blog; men bloggens layout præsenteres fortsat af skabelonen Blog-forside.

Begynd med en helt blank skabelon

Nu operettes skabelonen “Forside: Skabelon”. Undgå de foreslåede designs. Vi vil begynde med en helt blank side. WP foreslår en masse designs; men du skal lave dit eget.

Begynd med en helt blank skabelon, sådan:

Banner med udvalgt billede

På siden Forside har vi allerede defineret et udvalgt billede. Vi kan hente dette billede frem med indstillingen: brug udvalgt billede.

Inde i banneret kan du tilføje nogen blokke – i denne øvelse bruger vi:

• Blokken “Websteds titel”
• Blokken “Webstedets undertitel/slogan”
• Prøv eventuelt blokken “Website logo”

Det ser noget bart ud i din editor ….

Men prøv at åbne sitets forside!

Eksperimenter lidt med størrelsen af banneret. Prøv at give det en højde på 100vh.

Navigation

På et hierarkisk site skal brugeren kunne navigere – du kan indsætte navigationsblokken et passende sted. Jeg sætter mit banner til 45vh så vi altid kan se menuen.

• Indsæt blokken “Navigation” under banneret.

I dette tilfælde valgte jeg at centrere banneret under blokkens indstillinger.

Resultatet ser sådan ud:

Sidens indhold hentes

Fra den side vi har valgt som forside kan vi hente:

• Titel
• Indhold (“brødtekst”, billeder, øvrige medier …)
• Udvalgt billede (har vi allerede brugt i banneret)

En gruppe til indholdet

Indholdet skal formatteres som indhold. Her er blokken “gruppe” nyttig. Så opret en gruppe under navigationen.

Sørg for at gruppen bruger “indholdsbredde” til dit indhold (eller fuld bredde, hvis det er det du vil!).

Indsæt forsidens titel

Indsæt titlen på dit indlæg i gruppen.

Og her skal du netop IKKE skrive titlen, for den bliver hentet fra den side, som er valgt til at være forsiden. På forsiden ser det nu sådan ud:

Blokken: Indhold

Nu får vi brug for at hente sidens indhold. Her får du brug for blokken “Indhold”. Indsæt den i gruppen under titlen.

Footeren

Indsæt en passende footer ved hjælp af blokgrupperne. Du kan enten selv lave en footer ved hjælp af “Tilføj blokgruppe” – eller bruge en af de forud definerede. Husk at vælge “synkroniseret” hvis footeren skal genbruges på hele sitet.

Sammenfatning: skabelon til forsiden

Du har nu prøvet at lave en skabelon, der henter sit indhold fra den side, som du gør til forsiden. Du bestemmer selv, hvor og hvordan det udvalgte billede fra siden skal stå – her blev det placeret i et banner øverst på siden; men du kan hen de udvalgte billeder og formattere dem på andre måder. På en lignende måde kunne vi hente sidens titel, indhold mv. ved hjælp af de særlige skabelonblokke.

Eksemplet med forsiden viser samtidig, hvordan skabeloner fungerer, når de præsenterer attibutterne fra sider og indlæg. Skabelonen henter simpelt hen side- eller indlægss-objektets attributter og præsenterer dem dér, hvor du vil have det i dit layout.

Når du kan det her kan du gå på opdagelse i andre specialskabeloner.

---

Playground eksempel

Sådan anvendes eksemplet:

• Åbn Playground
• Installer zippen