Konfigurasjon og tilpasning med Delaware-tema

Delaware er Shoporamas mest brukte tema. Det er moderne, responsivt og bygget på Tailwind CSS, slik at det fungerer utmerket både på datamaskiner og mobiltelefoner. Nesten alt når det gjelder utseende og funksjonalitet kan tilpasses fra «Design» i administrasjonspanelet uten å skrive kode. Denne veiledningen går gjennom de viktigste innstillingene.

Hvor finner du innstillingene

Nesten alt styres fra Konto → Nettbutikk → Tema → Innstillinger. Feltene er gruppert i seksjoner som Generelt, Selskap, Tema, Merker, Produkt, Kasse, Integrasjoner og Egendefinert kode. Hvert felt har en kort beskrivelse på selve siden, slik at du ofte ikke trenger å slå opp her i veiledningen.

Logo, farger og merker

Under Tema kan du:

• Legge inn URL til logo og favikon (last opp selve filen under Tema → Filer og kopier URL-en)
• Velge primærfarge og handlingsfarge som heksakode, f.eks. #1a73e8
• Skrive en alt-tekst til logoen (viktig for tilgjengelighet og SEO)

Under «Merker» kan du tilpasse fargene på de små merkene som vises på produktene, f.eks. «Tilbud», «Nyhet», «Snart på lager » og «Mengderabatt».

Menyer i bunntekst

Delaware har plass til tre menyer i bunnteksten. Slik legger du dem til:

1. Gå til Innhold → Menyer
2. Opprett en ny meny og gi den en av disse taggene: footer_menu_1, footer_menu_2 eller footer_menu_3
3. Legg til menypunktene du vil vise
4. Menynavnet blir automatisk overskriften i bunnteksten

Megameny

En megameny er en stor nedtrekksmeny med flere kolonner, som vanligvis brukes som hovednavigasjon, slik at kundene raskt kan finne frem i et stort utvalg.

I Delaware aktiveres megamenyen av CSS-klassen megamenu (nettopp denne strengen — ikke mega_menu og uten mellomrom). Klassen angis i feltet Klasse på det enkelte menypunktet i hovednavigasjonen — ikke på selve menyen. Du finner feltet under Innhold → Menyer → rediger et menyelement.

Selve strukturen krever tre nivåer: hovednavigasjonen inneholder et menypunkt med klassen «megamenu», som peker til en megameny-beholder; beholderen har ett menypunkt per kolonne, som peker til en kolonnemeny; og det første punktet i kolonnemenyen blir kolonneoverskrift (resten blir lenker). Hvis du setter klassen «show_image» på det første menypunktet i en kolonne, og det er en kategori, et produkt eller en landingsside, vises objektets bilde som et blikkfang øverst i kolonnen.

Betalings- og fraktikoner i bunnteksten

Du trenger ikke å laste opp bilder av betalingskort eller fraktselskaper. Delaware har innebygde SVG-ikoner, og du velger dem fra to felt under «General».

Feltet «Betalingsmetoder» (path: payment_methods) er en kommaseparert liste, f.eks.:

dankort,visa,mastercard,maestro,mobilepay,applepay,googlepay

Disse navnene er innebygd som ikoner i Delaware:

• dankort, visa, mastercard, maestro
• mobilepay, applepay, googlepay, paypal
• klarna, viabill, anyday, bankoverføring, faktura, ean

Skriv navnene med små bokstaver, uten mellomrom mellom kommaene. Et navn som ikke finnes som innebygd ikon, hoppes ganske enkelt over uten feilmelding.

Feltet «Fraktmetoder» (path: shipping_methods) fungerer på samme måte, f.eks.:

gls,postnord,ups,burd

Trustpilot-integrasjon

Delaware bruker Trustpilots offisielle widgets. Hver widget krever sin egen Template ID, som du kopierer fra Trustpilots Business-portal. Feltene ligger under «Integrations»:

1. Aktiver «Enable Trustpilot»
2. Skriv inn Trustpilot Business-ID-en din (path: trustpilot_business_id) – dette er nettbutikkens unike ID hos Trustpilot
3. Fyll ut Template ID for de widgetene du faktisk vil vise:

• Trustpilot Template ID Carousel (trustpilot_template_id_carousel) – stort karusellelement, vanligvis på forsiden og i kassen
• Trustpilot Template ID Micro Star (trustpilot_template_id_micro_star) – kompakte stjerner i toppmenyen og i begynnelsen av kassen
• Trustpilot-mal-ID Micro Review Count (trustpilot_template_id_micro_reviewcount) – liten tekst-widget med antall anmeldelser i bunnteksten
• Trustpilot Template ID Micro Trustscore (trustpilot_template_id_micro_trustscore) samlet poengsum i toppteksten og i sidefeltet i kassen
• Trustpilot-mal-ID Product Mini (trustpilot_template_id_product_mini) stjerner under produktnavnet på produktsiden
• Trustpilot Template ID Product Reviews (trustpilot_template_id_product_reviews) fullstendig liste over anmeldelser på produktsiden
• Trustpilot Template ID Starter (trustpilot_template_id_starter) brukes hvis du ennå ikke har fått noen anmeldelser

Instagram, Facebook og andre sosiale medier-lenker

Delaware viser små ikoner i bunnteksten som lenker til profilene dine på sosiale medier. Du fyller inn URL-ene under Company:

• Instagram-URL (bane: instagram_url)
• Facebook-URL (facebook_url)
• YouTube-URL (youtube_url)
• Google-URL (google_url)

Skriv inn hele URL-en, f.eks. https://www.instagram.com/dinprofil/. Hvis du lar feltet stå tomt, vises ikke ikonet.

Verdiforslag (USPer)

Du kan vise opptil fire verdiforslag, vanligvis under toppteksten eller i bunnteksten. Det kan for eksempel være «Gratis frakt over 500 kr.», «30 dagers returrett» eller «Rask levering». Sett dem opp under «Verdiforslag», der hvert USP har felt for tekst, beskrivelse, ikon og eventuelt lenke.

Forsiden og Sidedesigner

Forsiden bygges via Sidedesigner, hvor du kan legge til seksjoner som hero-bannere, produktkaruseller, bildegallerier, tekst og bloggfeeder. Du drar og slipper seksjoner og redigerer innholdet uten å røre koden.

Funksjonene på produktsiden

Under «Product» kan du slå en rekke funksjoner på og av:

• Andre kjøpte også, Lignende produkter, Relaterte produkter – alle med autofyll fra samme kategori
• Ønskeliste, både enkel (nettleserbasert) og fullstendig (krever innlogging)
• Faner for produktattributter, frakt, retur, betaling og spørsmål
• «På lager»-merke, melding om restordre, kampanjemelding
• Bildegalleri med miniatyrbilder og lightbox
• Vaskeanvisning og størrelsesguide
• Omnibus-prisvisning av laveste pris de siste 30 dagene på tilbudsvarer

Tilpasninger av kassen

Seksjonene «Kasse: Generelt», «Kasse: Handlekurv», «Kasse: Adresse» og «Kasse: Godkjenn» styrer hver fase av kassen. Her kan du blant annet aktivere/deaktivere innlogging, gavekort, Apple Pay/MobilePay hurtigkassa, nyhetsbrevregistrering, tilleggssalg samt velge om du henvender deg til privatpersoner (B2C), bedrifter (B2B) og/eller offentlige kunder (B2G/EAN).

Site Notice (banner øverst)

Vil du informere om en kampanje, stengning på helligdager eller en generell melding? Aktiver «Site Notice» og skriv en tekst, eventuelt med en lukkeknapp. Du kan ha ulik tekst på datamaskin og mobil og velge hvor mange dager banneret skal forbli lukket når kunden klikker det bort.

Andre integrasjoner

Under «Integrasjoner» kan du i tillegg til Trustpilot også aktivere:

• Pricerunner ved å legge inn konto-ID-en din
• E-mærket ved å legge inn URL-en til din E-mærket-side
• Viabill for delbetaling (krever Viabill-butikk-ID)
• AnyDay for delbetaling (krever AnyDay-pristoken)
• Clerk.io for intelligent søk og produktanbefalinger (krever API-nøkkel)

Egne tilpasninger (Custom CSS og JS)

Hvis du trenger å legge til egen CSS eller JavaScript, kan du gjøre det via Custom Code. Aktiver Enable Custom CSS eller Enable Custom JS og sett inn koden din. Dette er den enkleste måten å gjøre små designjusteringer eller legge til eksterne skript uten å endre selve temafilene.

Ofte stilte spørsmål

Hvilken Smarty-versjon kjører Delaware på?

Delaware og DelawareDK kjører på Smarty 4. Det er den nyeste versjonen, og det er også den vi anbefaler for alle nye temaer på Shoporama. Hvis du selv tilpasser malene, kan du derfor bruke nyere Smarty 4-syntaks som <{$foo = 123}> og <{foreach $items as $item}>.

Hva er forskjellen mellom Delaware og DelawareDK?

Funksjonene er helt identiske. Den eneste forskjellen er språket i admin-etikettene på temainnstillingene: Delaware har engelske etiketter (f.eks. «Theme», «Company», «Integrations»), mens DelawareDK har danske. Selve butikkens tekst på forsiden styres uavhengig av dette via butikkens språkinnstilling.

Betalingsikonene mine vises ikke i bunnteksten – hva gikk galt?

Sjekk at feltet «Betalingsmetoder» under «Generelt» er fylt ut med en kommaseparert liste, f.eks. visa, mastercard, mobilepay. Skriv navnene med små bokstaver og bruk kun navn fra listen ovenfor. Et navn som ikke er innebygd som ikon, hoppes over uten feilmelding.

Hvilket Trustpilot-felt skal jeg fylle ut?

Først Trustpilot Business ID (butikkens ID). Deretter én Template ID per widget du vil bruke. Hvis du for eksempel bare vil ha stjerner under produktnavnet, fyller du ut Trustpilot Template ID Product Mini. La de andre Template ID-feltene stå tomme, så vises de ikke.

Kan jeg vise de nyeste Instagram-bildene mine direkte på forsiden?

Ikke som standard. Delaware viser bare en lenke til Instagram-profilen din i bunnteksten. Hvis du vil ha et live bildefeed, kan du legge til en tredjepartsløsning, for eksempel Behold eller Elfsight, som du legger inn via en HTML-blokk i Sidedesigner.

Hvor oppretter jeg bunntekst med firmaadresse og CVR-nummer?

Firmanavn, adresse, by, postnummer, CVR-nummer, telefonnummer og e-postadresse angis under «Company» i temainnstillingene. Disse opplysningene vises automatisk i bunnteksten og brukes også til strukturerte data (Schema.org), slik at Google forstår nettbutikken din bedre.

Støtter Delaware Theme Builder?

Ja. Delaware støttes fullt ut av Theme Builder, slik at du kan justere farger, seksjoner og layout med visuell forhåndsvisning. Feltene i denne veiledningen er nøyaktig de samme som du finner i Theme Builder, bare vist i tabellform.

Hvor godt fungerer Delaware på mobil?

Delaware er bygget med Tailwind CSS og er fullt responsivt. Megamenyen kollapser til en off-canvas-mobilmeny, bilder skaleres automatisk til skjermstørrelsen, og kassen er optimalisert for berøringsskjerm. Du kan også velge egen tekst til «Site Notice» på mobil.

Kan jeg bruke megamenyen og den vanlige menyen samtidig?

Ja. Du kan til og med blande dem i samme hovednavigasjon. Bare menypunktene som har CSS-klassen «megamenu», foldes ut som en stor megameny – punkter uten denne klassen vises som en vanlig nedtrekksmeny. Og du kan fortsatt ha separate menyer for toppen og de tre fotposisjonene.

Skal jeg velge Delaware eller DelawareDK?

Velg DelawareDK hvis teamet ditt jobber på dansk og foretrekker danske admin-etiketter. Velg Delaware hvis du foretrekker engelsk eller jobber med en internasjonal nettbutikk. Hvis du senere bytter mellom dem, går ikke innstillingene dine tapt.

Trenger du hjelp med Delaware? Skriv til oss på support@shoporama.dk.