Gør dit tema klar til flere sprog og lande

Med Lande kan en Shoporama-shop sælge i flere lande fra samme admin, med landets sprog, valuta og egen adresse. Shoporama klarer det meste selv: varer, kategorier og sider vises oversat, priserne regnes om, og links, hreflang og sitemaps får landets adresse. Men et tema har ofte tekster, valuta og talformat skrevet direkte i koden, og dem kan Shoporama ikke oversætte for dig.

Artiklen er til udviklere og bureauer, der har bygget et eget tema til en shop. Den tager dig trin for trin fra en eksisterende shop til et land, der er klar til at blive aktiveret. Hvordan shopejeren opretter og indstiller landene, står i Sælg i flere lande med Lande, og hvordan teksterne oversættes, står i Oversæt din webshop.

Shoporamas egne temaer Montana, MontanaB2B, Delaware, DelawareDK, California, Washington, Alaska2 og Alaska er allerede gjort klar til lande. Massachusetts-temaerne er ikke. Bruger shoppen et af de klare temaer uden egne ændringer, skal du ikke gøre noget af det her.

Før du går i gang

• Opret landet under Webshop → Lande, før du går i gang med temaet. Så bliver temaets tekster oversat, mens du arbejder, og du kan se landet undervejs. Leveringslandet skal findes under Levering → Lande først, for det er dér, moms og fragt til landet sættes op.
• Et nyt land er ikke aktivt. Kunderne kan ikke se det, så du kan arbejde på temaet og teste landet i ro og mag.
• Kører landet på et eget tema, skal det være på prismodellen Pro. Det gælder også, når landet bruger shoppens eget tema. Flex kan ikke vælges, når landet bruger et eget tema.
• Kun brugere med fuld adgang kan oprette, rette og aktivere lande.
• Landene ligger enten på en sti på shoppens domæne (fx dinshop.dk/se) eller på eget domæne (fx dinshop.se). Temaet skal ikke vide hvilket. Adresserne klarer Shoporama.

Det klarer Shoporama uden ændringer i temaet

• Links. Alle links i den færdige HTML (href, action og formaction på fx a, form, link og button), og:url og adresser i JSON-LD får landets adresse. Det gælder også links, du har skrevet direkte, som /basket eller https://dinshop.dk/kontakt. Billeder, CSS, JavaScript, filer og feeds røres ikke, og viderestillinger fra serveren bliver i landet.
• Ajax. Kald fra en side i landet, fx til /ajax, får landet med, fordi Shoporama ser, hvilken side der kaldte.
• Sprog og SEO i head. får sidens sprog, og:locale bliver landets (fx sv_SE), hvis temaet har det tag, og der indsættes hreflang-links til alle sprogversioner af siden og x-default til hovedlandet. En side, der endnu ikke er oversat, vises på dansk, får noindex i landet og er ikke med i hreflang eller landets sitemap.
• Indhold. Varer, kategorier, landingssider, sider, blogindlæg, menuer, filtre, fragt- og betalingsmetoder, lande, kundefelter og temaindstillingernes tekstfelter vises på landets sprog gennem de metoder, temaet bruger i dag, fx $product->getName() og $product->getUrl(). Adresserne er også oversat. Mangler en oversættelse, vises den danske tekst.
• Priser. Varepriserne fra temaets objekter (pris, tilbudspris, varianter, kampagner, mængderabat og fragt) er allerede landets: omregnet med kursen og med landets prisjustering, moms og afrunding.
• Valuta. $webshop->getCurrency() giver landets valuta, når landet sælger i sin egen.
• Datoer. Ugedage og månedsnavne fra date_format (%A og %B) kommer på landets sprog.
• Kassen. Kun landets fragt- og betalingsmetoder kommer med i fx $webshop->getShippings() og $webshop->getPaymentGateways(), og serveren afviser leveringslande, landet ikke leverer til.
• Mails. Ordremails dannes i ordrens land. Tekster, valuta, talformat og links i mailen følger derfor ordrens land på samme måde som på siderne, når mailskabelonerne er gjort klar som resten af temaet.
• Cache. Shoppens sidecache og fragmenter i <{cache}> gemmes pr. land, så en dansk menu ikke bliver vist i det svenske land.

Det skal temaet selv klare

• Tekster skrevet direkte i HTML eller JavaScript forbliver danske (trin 1).
• Lande viser advarslen "Tjek temaet før du aktiverer et land", indtil temaet skriver, at det er klar (trin 2).
• "kr." eller "DKK" skrevet direkte bliver stående, og faste tusind- og decimaltegn giver dansk talformat (trin 3).
• Beløb fra ordrer vist med $webshop->getCurrency() kan få forkert valuta, fx i ordrehistorikken, hvor kunden kan have ordrer fra flere lande (trin 3).
• Der er ingen sprogvælger (trin 4).
• Listen over leveringslande viser alle shoppens lande, og en kunde, der vælger et land, landet ikke leverer til, sendes tilbage til adressesiden uden forklaring (trin 5).
• Adresser, som JavaScript selv bygger og går til, får ikke landets sti (trin 3).
• Hreflang-links, temaet selv skriver, bliver stående ved siden af dem, Shoporama indsætter. Fjern dem.

Trin 1: Læg alle tekster i <{t}>

Alt, kunden kan læse, skal stå i <{t}>...<{/t}> eller som "..."|t. Husk også attributter som placeholder, title og aria-label, fejlbeskeder, kassen, returcenteret og mailskabelonerne. Ordremails sendes på ordrens sprog, så deres tekster skal oversættes ligesom siderne.

<{t}>Din kurv<{/t}>

<{t}>Læg i kurv<{/t}>

<{include file="components/alert.html" text="Din profil er blevet opdateret."|t}>

Brug pladsholdere, ikke variabler, i teksten

Teksten mellem tags er nøglen til oversættelsen. Står der en Smarty-variabel inde i teksten, bliver hver værdi sin egen tekst, og den kan ikke oversættes på forhånd. Send i stedet værdien med som parameter, og brug den som {x} i teksten. Pladsholderne bevares, når teksten oversættes.

<{if $customer}>
    <{* Forkert: hvert pointtal bliver en ny tekst *}>
    <{t}>Du har <{$customer->getActivePoints()}> aktive point.<{/t}>

    <{* Rigtigt *}>
    <{t x=$customer->getActivePoints()|number_format:0:$webshop->getDecimalSeparator():$webshop->getThousandSeparator()}>Du har {x} aktive point.<{/t}>
<{/if}>

• Ændrer du en tekst i temaet, også bare et mellemrum eller et linjeskift inde i teksten, bliver den en ny tekst, der skal oversættes igen. Mellemrum før og efter teksten tæller ikke. Skriv derfor hver tekst på én linje.
• En oversættelse må kun indeholde de HTML-tags, den danske tekst har. Hold gerne markup uden for <{t}>.
• Tekster i JavaScript-filer kan ikke oversættes. Læg dem i HTML'en, fx i et data-attribut: data-added-text="<{"Lagt i kurven"|t|escape}>".

Hvor teksterne bliver oversat

Shoporama læser temaets .html-filer igennem og opretter teksterne i <{t}> og "..."|t, så de kan oversættes, før en kunde har set dem. Det sker, når et land aktiveres, når Webshop → Oversættelser åbnes, og når den automatiske oversættelse kører. Tekster med en variabel inde i selve teksten kan ikke læses ind på forhånd.

Er automatisk oversættelse slået til (det er standard), oversættes temaets tekster først, inden for få minutter, også for lande, der ikke er aktive endnu. Du eller shopejeren kan rette dem under Webshop → Oversættelser → Temaets tekster, og det, en person retter, bliver ikke overskrevet. Shoppens egne tekster under Design → Tekster er stadig hovedlandets, og det er dem, oversættelserne tager udgangspunkt i.

Trin 2: Skriv i theme_settings.json, at temaet er klar

To nøgler i theme_settings.json i roden af temaet fortæller Shoporama, hvordan temaet håndterer sprog. De står på øverste niveau, ved siden af info og settings:

{
    "info": "Mit tema",
    "countries": true,
    "text_language": "da",
    "settings": [
        ...
    ]
}

"countries" ændrer ikke, hvordan butikken virker. Det er temaets løfte til shopejeren, så sæt den først til true, når temaet består tjeklisten nederst i artiklen.

Skriver du temaets tekster på engelsk, som Delaware gør, så sæt "text_language": "en". Så viser et engelsk land temaets egen engelske tekst, også når shoppen har rettet teksten til dansk under Design → Tekster. En engelsk oversættelse under Oversættelser går stadig forud. Brug samme sprogkode som landet, fx en, de, sv eller nb for norsk.

Temaindstillingernes tekster

Felter i settings af typen string, text og wysiwyg kan oversættes under Webshop → Oversættelser → Temaindstillinger, og temaet får den oversatte værdi uden ændringer. Felter med navne som url, link_1, email, phone, color eller usp1_icon regnes ikke for tekst, og det samme gælder grupper som design, integrations og custom_code. Giv derfor felter med links, koder og farver sådan et navn, så de ikke bliver sendt til oversættelse.

Trin 3: Vis beløb i landets valuta og talformat

Priser i butikken

Priserne fra temaets objekter er allerede omregnet, så temaet skal aldrig selv regne med en kurs. Det skal bare vise valutaen og formatere tallet rigtigt:

<{$currency = $webshop->getCurrency()}>
<{$decimal = $webshop->getDecimalSeparator()}>
<{$thousand = $webshop->getThousandSeparator()}>

<{$product->getPrice()|number_format:2:$decimal:$thousand}> <{$currency|escape}>

Viser temaet i dag en fast valutatekst som "kr.", så brug $webshop->getCountryCurrency(). Den giver landets valuta, når kunden handler i et land med sin egen valuta, og er tom ellers:

<{$currency = "kr."}>
<{if $webshop->getCountryCurrency()}><{$currency = $webshop->getCountryCurrency()}><{/if}>

Beløb fra ordrer

En ordre er i valutaen fra det land, den blev købt i. Brug derfor $order->getCurrency() overalt, hvor der vises beløb fra en ordre: takkesiden, ordresiden, ordrehistorikken, returcenteret, ordremails og den printede faktura. I ordrehistorikken skal hver ordre have sin egen valuta, for kunden kan have handlet i flere lande.

<{if $order}><{$currency = $order->getCurrency()}><{/if}>

<{foreach $my_orders as $my_order}>
    <{$my_order->getTotalPrice()|number_format:2:$webshop->getDecimalSeparator():$webshop->getThousandSeparator()}>
    <{$my_order->getCurrency()|escape}>
<{/foreach}>

Talformat

getDecimalSeparator() og getThousandSeparator() giver talformatet for det land, siden eller mailen vises i. På hovedlandet returnerer de det, du giver dem som argument (standard komma og punktum), så temaets nuværende format bliver ved med at gælde dér. Formatet følger landet, ikke sproget:

JavaScript

• Formaterer dit JavaScript priser, så hent tegnene fra HTML'en. Montana lægger dem på body: data-decimal="<{$webshop->getDecimalSeparator(",")|escape}>" og data-thousand="<{$webshop->getThousandSeparator(".")|escape}>".
• $webshop->getLocale() giver sprog og land som fx en-GB i et land og da-DK på en dansk hovedshop. Brug den til Intl og widgets.
• Adresser, som JavaScript selv bygger og går til (fx location.href = "/basket"), får ikke landets sti. Læs i stedet adressen fra et link i HTML'en, for det har Shoporama allerede rettet.

Trin 4: Tilføj en sprogvælger

$webshop->getCountrySites() giver hovedlandet og de aktive lande, hver med et link til den side, kunden står på, i det land. Listen er tom, når der er færre end to versioner af shoppen, så vælgeren vises først, når mindst ét land er aktivt. Eksemplet er Montanas vælger i footeren (components/country-selector.html) uden styling:

<{$country_sites = $webshop->getCountrySites()}>
<{if $country_sites}>
    
<{/if}>

Eksemplerne i artiklen er skrevet til Smarty 4. På Smarty 2 skrives tildelinger med assign og løkker med foreach from, så her hedder de to linjer<{assign var="country_sites" value=$webshop->getCountrySites()}> og <{foreach from=$country_sites item="country_site"}>, som i Alaskas country-selector.html.

• hreflang på linket er nødvendigt. Uden det flytter Shoporama linket ind i det land, kunden står i, ligesom alle andre links. Et link med hreflang eller data-country-keep bliver ikke rørt.
• Brug url, ikke address. Ligger landet på et andet domæne, går url via en skifteside, der tager kurven med. address er landets egen adresse til siden.
• Felterne: label (sprogets navn på sproget selv, fx Svenska eller Suomi, med landekoden, hvis to lande har samme sprog), language (fx sv), hreflang (fx sv-SE), code (fx SE), country (landets navn), current (siden, kunden står på), main (hovedlandet) og translated (om siden er oversat til sproget).
• Montana har også en vælger i headeren (components/country-switch.html), der er skjult på små skærme, hvor sprogene står i mobilmenuen.

Trin 5: Vis kun landets leveringslande i kassen

Et land kan begrænse, hvor varerne leveres til. Kun leveringsadressen begrænses. Fakturaadressen må ligge i alle shoppens lande, så kunder fra hele EU kan handle. Brug derfor to lister:

• Fakturaadressens land (order_country_id): $webshop->getCountries(), alle shoppens lande.
• Leveringsadressens land (del_country_id): $webshop->getDeliveryCountries(), kun de lande, landet leverer til. På hovedlandet er det alle shoppens lande, så du kan bruge den overalt, også i fx en fragtberegner i kurven.

Udfylder kunden ikke en leveringsadresse, er fakturalandet også leveringsland. Leverer landet ikke dertil, sender Shoporama kunden tilbage til /address?delivery_country=1. Vis en besked, og vis felterne til leveringsadressen, så kunden kan vælge et andet land:

<{if $get.delivery_country}>
    
<{t}>Vi leverer ikke til det valgte land. Vælg en leveringsadresse i et af de lande, vi leverer til.<{/t}>
<{/if}>


    <{t}>Vælg land<{/t}>
    <{foreach $webshop->getDeliveryCountries() as $country}>
        getCountryId()}> selected<{/if}>><{$country->getName()|escape}>
    <{/foreach}>

Brug $get og ikke $smarty.get, som er blokeret i butikkens skabeloner. Beskeden er den samme, som Shoporamas egne temaer viser.

Trin 6: Test landet, før det aktiveres

En admin, der kan rette shoppen, kan se et land, der ikke er aktivt. Alle andre får en fejlside, eller sendes til hovedlandet, når landet har eget domæne. Sådan gør du:

1. Log ind i admin, og klik på øjet Vis webshop i toppen. Så er du også logget ind i butikken.
2. Åbn landets adresse, fx https://dinshop.dk/se/. Siderne får noindex, så de ikke kommer i søgemaskinerne, mens du tester.
3. Gå butikken igennem: forside, kategori, vare, søgning, kurv, kassen og kundekontoen. Se efter danske tekster, valuta, talformat, og om du bliver i landet, når du klikker rundt.
4. Åbn /se/address?delivery_country=1 for at se beskeden om leveringsland.
5. Se sidens kilde: og eventuelt og:locale skal være landets, og der må ikke være hreflang-links fra temaet selv.
6. Er alt i orden, så sæt "countries": true i theme_settings.json, og bed shopejeren aktivere landet med kontakten Aktiv under Webshop → Lande.

Ligger landene på eget domæne, skal landets domæne pege på Shoporama og have SSL (shopejeren skriver domænet og bestiller gratis SSL på landets side), og du skal være logget ind på det domæne for at se landet, før det er aktivt.

Tjekliste

• Alle synlige tekster står i <{t}> eller "..."|t, også i attributter, kassen, fejlbeskeder, returcenteret og mails.
• Ingen variabler inde i <{t}>. Værdier sendes med som pladsholdere.
• Ingen "kr." eller "DKK" skrevet direkte. Butikken bruger $webshop->getCurrency() eller getCountryCurrency().
• Beløb fra ordrer bruger $order->getCurrency(): takkeside, ordreside, ordrehistorik, returcenter, mails og faktura.
• Alle number_format bruger getDecimalSeparator() og getThousandSeparator().
• JavaScript henter tekster, talformat og adresser fra HTML'en og locale fra getLocale().
• Sprogvælgeren bruger getCountrySites() med url, hreflang og lang på linkene.
• Leveringslandet vælges fra getDeliveryCountries(), og beskeden vises ved $get.delivery_country.
• Temaets egne hreflang-links er fjernet.
• "countries": true og eventuelt "text_language" står i theme_settings.json.
• Landet er gennemgået som admin, før det blev aktiveret.

Ofte stillede spørgsmål

Min shop bruger et af Shoporamas temaer. Skal jeg gøre noget?

Nej, ikke hvis temaet er Montana, MontanaB2B, Delaware, DelawareDK, California, Washington, Alaska2 eller Alaska, og du ikke har lavet egne ændringer. Når du har tilføjet et land, viser Webshop → Lande en advarsel, hvis temaet ikke er klar.

Mit tema er en kopi af Montana. Er det klar til lande?

Kun hvis kopien er lavet efter, at Montana fik Lande. En ældre kopi mangler sprogvælgeren, leveringslandene og nøglen "countries" i theme_settings.json. Sammenlign med den nyeste Montana, og flyt ændringerne over, eller gå trinene i artiklen igennem.

Skal jeg lave en kopi af temaet til hvert sprog?

Nej. Det samme tema kan bruges i alle lande, og teksterne oversættes pr. sprog. Shopejeren kan vælge et eget tema pr. land under Webshop → Lande, men et land med eget tema skal være på Pro.

Hvorfor står en tekst stadig på dansk i landet?

Enten står den ikke i <{t}>, den har en variabel inde i teksten, eller den er ikke oversat endnu. Den automatiske oversættelse tager typisk få minutter, men holder pause resten af måneden, når kvoten på 2.000.000 tegn pr. sprog er brugt. Du kan altid rette teksten selv under Webshop → Oversættelser → Temaets tekster.

Hvorfor vises min sprogvælger ikke?

getCountrySites() er tom, indtil shoppen har mindst to versioner: hovedlandet og et aktivt land. Lande, der ikke er aktive, kommer ikke med, heller ikke når du ser dem som admin.

Hvad gør jeg med de hreflang-tags, temaet har i dag?

Fjern dem. Shoporama indsætter selv hreflang til alle aktive lande og x-default til hovedlandet, men fjerner ikke dem, temaet skriver. Står begge dele, får siden dobbelte og måske modstridende hreflang-links. Læs mere i Hreflang og alternate-tags for flersprogede webshops.

Jeg vil linke til hovedlandet fra en side i landet. Hvordan undgår jeg, at linket bliver flyttet?

Sæt data-country-keep eller et hreflang-attribut på linket. Så lader Shoporama adressen stå, som du har skrevet den.

Skal temaet regne priserne om til landets valuta?

Nej. Priserne fra temaets objekter er allerede i landets valuta, med landets kurs, prisjustering, moms og afrunding. Regner temaet selv om, bliver beløbet forkert. Beløb fra en ordre er i ordrens valuta, så vis dem med $order->getCurrency().

Kan jeg levere oversættelserne med temaet i en langs-mappe?

Kun til shoppens eget sprog. Filerne i langs/ udfylder Design → Tekster, når temaet aktiveres. Landenes sprog oversættes under Webshop → Oversættelser: automatisk, i hånden, med eksport og import af CSV, eller via REST API'ets oversættelser.