Temaer: opret og redigér dine egne tema-skabeloner

Temaer er en af de ældste sider i Shoporama-admin. Her laver du dine egne udgaver af enkelte filer i dit tema og lader dem overskrive de tilsvarende filer i det design, du bruger i forvejen. Det er samtidig Shoporamas oprindelige split-test-værktøj.

Vigtigt først: siden virker kun, hvis din webshop kører Smarty 2. Kører din shop Smarty 4, findes menupunktet slet ikke, og siden har ingen virkning. Spring i så fald direkte til Kører du Smarty 4? nedenfor.

Sådan ser du, om din shop kører Smarty 2 eller Smarty 4

Smarty er det skabelonsprog, dit tema er skrevet i, altså koden der henter produktnavne, priser, og billeder ind i de sider dine kunder ser. Der findes to udgaver: den gamle Smarty 2, og den nuværende Smarty 4.

1. Klik på Konto i menuen til venstre, fold Webshop ud, og vælg Generelt.
2. Find feltet Smarty version. Der står enten 2 eller 4 (fungerer muligvis ikke med gamle templates).

Er feltet gråt, står der Styret af temaet (Smarty 4), og så bestemmer temaet selv udgaven. Vil du skifte fra 2 til 4, så læs guiden til at skifte til Smarty 4 først. Kører du Smarty 2, står der også Du bruger Smarty 2 øverst på Temaer-siden.

Kører du Smarty 4? Så skal du et andet sted hen

På shops med Smarty 4 er Temaer fjernet fra menuen med vilje. Smarty 4 læser kun temaets filer fra shoppens temamappe, så et tema oprettet her ville alligevel aldrig blive brugt. Det du plejede at bruge siden til, gør du i stedet her:

• Butik, Design, Kodeeditor til at rette temaets HTML-, CSS-, og JavaScript-filer. Se guiden til kodeeditoren.
• Butik, Design, Sidedesigner til at bygge sider af færdige blokke, helt uden kode.
• Butik, Design, Split-test til at teste to versioner af en side mod hinanden. Den nye split-test arbejder sammen med Sidedesigneren, fordeler trafikken efter vægte, og kan stoppe sig selv, når resultatet er tydeligt.
• Butik, Design, Temaindstillinger til farver, logoer, og de valg temaet selv stiller til rådighed. Se guiden til temaindstillinger.
• Butik, Design, Stylesheet til egne CSS-rettelser, og Butik, Design, Tekster til de faste tekster.

Hvad et "tema" betyder her, og hvor du finder siden

Ordet tema bruges to steder i admin, og de er ikke det samme. Butik, Design, Tema er dit rigtige design, altså alle filerne shoppen er bygget af, og oversigten over temaer på Shoporama giver et overblik. Konto, Webshop, Temaer er derimod en lille samling enkeltfiler oven på designet. Kun de filer, du selv lægger ind, bliver overskrevet, og alt andet kommer fra dit almindelige tema.

Filerne gemmes i shoppens database og ikke som rigtige filer, så de bliver ikke overskrevet, den dag temaets filer lægges op igen. Det er netop dét, der gør siden brugbar: du kan afprøve en ændring ét sted uden at røre resten af designet.

Du finder siden under Konto, Webshop, Temaer, mellem robots.txt og Nulstil. Oversigten har tre kolonner: Navn er dit eget navn på temaet, I brug står på Ja for det aktive tema og Nej for resten, og blyant-ikonet åbner temaets filliste. Nederst er knappen Opret nyt tema.

Sådan opretter du et tema

1. Klik Opret nyt tema. Siden hedder Nyt tema.
2. Udfyld Navn. Vælg noget du kan genkende om tre måneder, fx "Test af købsknap".
3. Vil du starte fra en eksisterende fil, markerer du den i Eller kopier fra eget tema (valgfrit). Listen viser de temamapper, du eller din udvikler selv har lagt op, og mail-filer er markeret med (e-mail).
4. Klik Opret. Du lander med det samme på temaets filliste.

Feltet Kopier fra tema (valgfrit) lige over står tomt for alle shops i dag, og det er ikke noget, du gør forkert. Har du ikke selv lagt temafiler op, opretter du bare temaet tomt og tilføjer filerne bagefter.

Fillisten i temaet

Fillisten hedder Templates. Øverst kan du rette temaets Navn, og derunder ligger tabellen over filerne:

• Filnavn er det afgørende felt. Filen overskriver den fil i dit tema, der hedder præcis det samme, fx add_to_basket.html. Skriver du et navn, dit tema ikke bruger, sker der ingenting.
• Navn er din egen etiket, fx "Original" eller "Version B". Den ses kun i admin.
• Låst viser, om filen er låst fast som den version, alle skal se. Mere om den i afsnittet om split-test.
• Ændret er dato og klokkeslæt for sidste gemte ændring.
• Blyant-ikonet yderst til højre åbner filen til redigering, og fluebenet yderst til venstre bruges af kopier- og slet-knapperne nedenunder.

Knapperne nederst: Gem gemmer navnet og går tilbage til oversigten. Opret ny fil i temaet åbner siden til en ny fil. Kopier de valgte filer laver en kopi af hver markeret fil, med samme filnavn og navn som originalen. Slet de valgte filer sletter de markerede efter et "Sikker?". Brug dette tema aktiverer temaet og vises kun, når det ikke allerede er i brug. Slet hele temaet fjerner temaet og alle dets filer.

En vigtig detalje: fluebenene bruges af flere knapper. Har du sat flueben ved en fil og klikker Gem eller Brug dette tema, bliver filen også kopieret. Fjern derfor fluebenene, når du er færdig med at kopiere, ellers vokser listen med dubletter.

Husk, at et tema ikke gør noget, før du har klikket Brug dette tema. Det er den klassiske fejl. Der skal stå Ja i kolonnen I brug. Der kan kun være ét aktivt tema ad gangen, og det gamle bliver liggende, så du kan skifte tilbage.

Opret og redigér en fil

Siden Opret ny fil i tema har felterne Filnavn og Navn samt de samme to kopier-lister som ved oprettelsen af temaet. Lader du Filnavn stå tomt, bliver filen oprettet som noname.html med navnet "No name".

Selve redigeringen foregår på siden Rediger template, hvor du retter Filnavn, Navn, og det store HTML-felt. Gem gemmer og går tilbage til fillisten, Gem og rediger videre bliver på siden, og Slet fjerner filen efter en bekræftelse.

Der er ingen fortryd og ingen versionshistorik. Når du gemmer, er den gamle udgave væk, så kopier indholdet over i en tekstfil, inden du retter. Ændringen slår igennem med det samme. Kan du ikke se den, så prøv en hård genindlæsning med Cmd+Shift+R eller Ctrl+Shift+R. På en live shop kan færdige sider desuden ligge gemt i op til fire timer.

Split-test: to versioner af den samme fil

Det er her, siden for alvor tjener sig hjem. Lægger du to eller flere filer med samme filnavn ind i samme tema, fordeler shoppen de besøgende mellem dem. Valget huskes i en uge, så den enkelte ikke ser knappen skifte undervejs.

1. Find den fil, der indeholder det du vil teste. Er det teksten på købsknappen, er det typisk add_to_basket.html.
2. Læg originalen ind i temaet, og døb den "Original".
3. Sæt flueben ved den, klik Kopier de valgte filer, og døb kopien "Version B".
4. Åbn Version B, ret den ene ting du vil teste, og gem. Retter du flere ting, ved du ikke, hvad der virkede.
5. Klik Brug dette tema, og lad testen køre, til du har nok ordrer til at turde konkludere noget.

Kolonnen Låst er den version, alle skal se, uanset fordelingen. I den nuværende admin er der ikke noget felt til at slå den til, og gemmer du en fil, sættes den til Nej. Vil du stoppe en test og beholde vinderen, sletter du derfor blot taberen.

Har du få besøgende, tager det lang tid at få et resultat du kan stole på, og så er tiden bedre brugt på at skaffe trafik. Den gemte udgave af siderne kan desuden gøre fordelingen mindre præcis. Mere i guiden til split-test i Shoporama.

Til dig der er teknisk

Filerne er Smarty-skabeloner, ikke ren HTML. Hos Shoporama skrives Smarty med spids parentes uden om de krøllede:

<{$product->getName()}>

<{if $product->getPrice()}>
    <p><{$product->getPrice()}> kr.</p>
<{/if}>

Hver <{if}> skal have en <{/if}>. Glemmer du én, får du typisk en fejlside på hele shoppen. Variabler og metoder er beskrevet i Variabler i et Shoporama-tema. Tre forskelle på de to Smarty-udgaver er værd at kende:

• Filerne ligger forskelligt. I et Smarty 2-tema ligger skabelonerne løst i temamappen, fx invoice.html. I et Smarty 4-tema ligger de i undermapper, fx templates/mails/invoice.html.
• Smarty 4 er strengere. Derfor står der bogstaveligt "fungerer muligvis ikke med gamle templates" i dropdownen. Gamle skabeloner kan indeholde skrivemåder, der skal rettes først.
• Databasefiler findes kun i Smarty 2. Temaer-siden lader sine filer gå forud for temaets rigtige filer. Den mekanisme findes ikke i Smarty 4, hvor alle nye funktioner bygges.

Ofte stillede spørgsmål

Jeg kan slet ikke finde Temaer i min menu. Hvor er den?

Så kører din shop Smarty 4, og punktet bliver bevidst skjult. Tjek det under Konto, Webshop, Generelt i feltet Smarty version. Skal du rette i temaets filer, bruger du i stedet Butik, Design, Kodeeditor.

Sletter jeg mit rigtige design, hvis jeg sletter et tema her?

Nej. Et tema her indeholder kun de enkeltfiler, du selv har lagt ind. Sletter du det, bruger shoppen igen de tilsvarende filer fra dit almindelige tema, og selve designet er urørt.

Hvorfor er listen "Kopier fra tema (valgfrit)" tom?

Den boks viser ikke længere noget indhold, så spring den over. Har du selv fået lagt temafiler op, finder du dem i boksen nedenunder, "Eller kopier fra eget tema (valgfrit)".

Jeg fik pludselig to helt ens filer i listen. Hvad skete der?

Fluebenene bruges af flere knapper. Står der flueben ved en fil, og du klikker Gem eller Brug dette tema, bliver filen kopieret, præcis som hvis du havde klikket Kopier de valgte filer. Slet dubletten, og fjern fluebenene.

Kan jeg fortryde en ændring dagen efter?

Nej, der gemmes ingen tidligere versioner. Kopier altid indholdet over i en tekstfil, før du retter. Er skaden sket uden en kopi, sletter du filen fra temaet, så bruger shoppen igen originalen.

Overlever mine rettelser en opdatering af temaet?

Ja. Filerne ligger ikke i temamappen, så de bliver ikke overskrevet, når temaets filer lægges op igen. Til gengæld kan de gøre skade, hvis det nye tema har ændret filen grundlæggende, så tjek dem efter en større opdatering.

Kan jeg rulle den samme rettelse ud i alle mine webshops på én gang?

Nej. Temaer og filer hører til den shop, du har valgt i admin, så det skal gentages i hver shop. Har du mange shops på samme tema, er det mere holdbart at få rettelsen ind i selve temaet.

Jeg tester min split-test, men ser altid den samme version. Er den i stykker?

Sandsynligvis ikke. Dit valg af version huskes i en uge, så du ser den samme, indtil du rydder cookies eller åbner shoppen i et privat vindue.

Jeg har rettet en fil, men der sker ingenting ude i shoppen. Hvad nu?

Tjek i den rækkefølge: står der Ja i kolonnen I brug, er filnavnet stavet præcis som filen i dit tema, og har du prøvet en hård genindlæsning? Er du stadig i tvivl, så skriv til support@shoporama.dk med navnet på filen.