In-Context Setup

Oversigt

Crowdins I-Kontekst fungerer vha. én linje JavaScript-uddrag og pseudosprogpakken. Den opretter en pseudosprogpakke baseret på lokaliseringsfilerne uploadet til projektet, der senere integreres i applikationen som et ekstra lokaliseringssprog.

Integrerede pseudosprog indeholder særlige identifikatorer i stedet for originalteksterne. Dvs., at når en app indstilles til det pågældende sprog, konverteres alle etiketter til særlige identifikatorer. Javascript finder og erstatter disse identifikatorer med redigerbare etiketter. Web-appens I-Kontekst siden vil derfor ligne applikationen med den eneste forskel, at oversættelige strenge nu er redigerbare.

I-Kontekst visning

Oversættelser foretages direkte i appen uden behov for at åbne Redigeringsværktøjet. En forenklet version af Redigeringsværktøjet vises med al funktionalitet (TM, maskinoversættelse, godkendelse/stemmeindstilling, kommentarer, udtryk) tilgængelig. Det er derfor lettere at foretage og revidere oversættelser, da oversættere kan se dem i en reel kontekst.

I-Kontekst Redigeringsværktøj

Quick Demo

Integration

Der er to almindelige metoder til integration af Crowdins I-Kontekst i din applikation:

  • Aftestnings- eller oversættelsesmiljø
    Er der ingen planer om at invitere slutbrugere til at hjælpe med oversættelse eller at bruge en “oversættelsestilstand”, vil produktionsapplikationsintegration af I-Kontekst i et aftestningsmiljø eller et dedikerede oversættelsesapp-miljø ville være en god løsning.

  • Produktionsmiljø
    I-Kontekst kræver ingen kodeændringer i applikationen, så den kan bruges selv i produktion. Hvordan det aktiveres, og hvilket brugersegment, der kan bruge det, afgør man selv. De mest almindelige anvendelsesscenarier er flg.:

    • Et spejlingswebsted kan oprettes, hvilket er en komplet kopi af applikationen, men under en anden URL (i stedet for f.eks. crowdin.com kunne det være translate.crowdin.com), hvor oversættere foretager oversættelser, som var det den faktiske applikation.
    • I-Kontekst kan også tilføjes som et ekstra sprog. Når oversættere åbner applikationen, vælger de dette ekstra sprog fra listen, hvilket så åbner I-Kontekst versionen.

Følg integrationsopsætningsguiden i Crowdin-projektet for at opsætte I-Kontekst. Guiden kan findes i venstre panel i projektet under Værktøjer > I-Kontekst.

I-Kontekst fane In-Context Tab

Bemærk: Ved brug af CSP, vær sikker på at føje flg. regler til politikken: Til indlæsning af I-Kontekst ressource filer, til CORS-forespørgsler til <organization_domain>. rowdin.com

Når integrationen er oprettet, og applikationen er genopfrisket, bør invitationsdialogen og Crowdin-indlogningsfeltet blive vist.

Indlogningsvindue

Adding String URLs to Context

When integrating In-Context for your website, you can add an optional script that can collect and add URLs to the context section of each string used on the website.

As a result, translators can click the URL for a particular string and be redirected to the website page where this string is used and get additional context for accurate translation.

To add string URLs to context, follow these steps:

  1. Copy the following JavaScript snippet and paste it right after the primary In-Context JavaScript snippet (which could be found in your Crowdin project’s Tools tab) at the <head> section on every page with localizable text.

     <script type="text/javascript">
       var _jipt = [];
       _jipt.push(['project', 'your_project_identifier']);
       _jipt.push(['preload_texts', false]);
       _jipt.push(['edit_strings_context', function(context) {
         var separator = "\n";
         var lineStart = "* ";
         var contextParts = context.split(separator);
         var linkCount = 0;

         for(var i in contextParts) {
           var line = contextParts[i];
           if(lineStart + window.location.href === line) {
             return context;
           }

           if(line.indexOf(lineStart) === 0) {
             linkCount++;
           }

           if(line === 'And more...') {
             return context;
           }
         }

         if(linkCount < 5) {
           return context + separator + lineStart + window.location.href;
         }

         return context + separator + 'And more...';
       }]);
     </script>

    Once finished, each website’s page you’d like to translate via In-Context should contain two JavaScript snippets:

    • Primary JavaScript snippet that launches the In-Context feature.
    • Additional JavaScript snippet that collects and adds URLs to the source string context.

  2. After adding JavaScript snippets, you should open each website page where In-Context is integrated. That will allow the additional JavaScript snippet to collect and add string URLs to your Crowdin project.

When you add a new page to your website, upload the related source files to your Crowdin project. Afterward, repeat the steps above to collect and add URLs for strings from the new page.

If some website page’s URL changes, open it in In-Context to refresh the string URLs collected initially.

Valgfrie parametre

Disse parametre kan føjes til _jipt-datasættet i opsætningsuddraget.

Forudindlæsning af tekster

_jipt.push(['preload_texts', true]);

Accelererer dynamisk indholdsvisning i I-Kontekst værktøjet ved at forudindlæse alle kildestrenge. Auto-deaktiveret i store projekter (5.000+ strenge). Gyldigt input er: true, false.

Oversættelsesknap altid synlig

_jipt.push(['touch_optimized', true]);

Indstillingen er som standard aktiveret på touch-skærme og gør oversættelsesknappen ud for hver oversættelige streng permanent synlige i stedet for alene mus-over visning. Gyldigt input er: true, false.

Før Commit Callback

_jipt.push(['before_commit', function(source, translation, context, language_code) { return status_obj; }]);

Funktion til forslagsvalidering, inden det comittes.

Parametre
sourceKildetekst
translationOversættelsestekst
contextKildestrengskontekst
language_codeTarget language code (language codes)
Returværdier
status_obj Objekt. status_obj.status kan være "ok", "fejl" eller "korrigeret". I tilfælde af fejl, indeholder status_obj.message fejlbeskrivelsen. Når status er "korrigeret", indeholder status_obj.korrektion den korrigerede oversættelse

Før DOM Insert Callback

_jipt.push(['before_dom_insert', function(text, node, attribute) { return 'text'; }]);

Funktion til at transformere strengen, før den indsættes i DOM.

Parametre
textString til indsættelse
node
valgfri		DOM-element, hvori teksten skal indsættes. Kan udelades, hvis teksten ikke har et målelement (tekst i browserens pop-up'er)
attribut
valgfri		DOM-elementattribut, såfremt teksten er en del af attributten
Returværdier
textString til indsættelse
falseReturnerer funktionen false, opdateres DOM ikke

Luk I-Konteksts Overlay Callback

_jipt.push(['escape', function() { window.location.href = "http://app_domain.com"; }]);

Hvis defineret, kan brugerne lukke I-Kontekst overlejringen, hvis de ikke ønsker at oversætte. Implementér denne funktion på din side. Afhængigt af I-Kontekst-integrationsmetoden, skal den ændre appens sprog eller omdirigere fra oversættelsesmiljøet til produktionsappen.

Luk Login-vindue

Adding Screenshots via In-Context

This feature allows you to take a screenshot of the opened website page, upload it to the Crowdin project and automatically tag all strings used on the page.

Note: This feature is available to project members with manager permissions (or higher).

Read more about Screenshots.

Add Screenshot

Troubleshooting and FAQ

  • Error: Crowdin In-Context was unable to identify translatable texts (Nothing to translate)

    This error may occur if some strings have been updated in the Crowdin project, but these texts are missing on your website. In this case, download the latest version of the pseudo-language from your project in Tools > In-Context and update the pseudo-language on your website.

  • Can I use In-Context with the Reactjs app?

    In-Context is technology-independent. Users can configure it according to the regular instructions, simply using a <script> tag.

  • Can I use In-Context if multiple packages compose one application in production?

    It doesn’t matter how many packages and repositories are involved. You can connect multiple repositories within one Crowdin project. If they relate to the same web app, it should work seamlessly.

  • Limitation to use In-Context in only one Crowdin project

    As long as the texts that are displayed on the website page come from one Crowdin project, In-Context will handle them just fine. The key point is that the texts on your website must be in the regular DOM, not in the shadow DOM.

  • Ability of extracting In-Context strings from Shadow DOM

    This is technically impossible. The Shadow DOM is invisible to our scripts. It can only be manipulated by the code that created the Shadow DOM.

  • Ability to configure so that the source file updates are automatically added into the pseudo-language package and then into the website

    This can be done using the Crowdin API. Use the Get Project API method to extract the inContextPseudoLanguage object, which contains the language code of the pseudo-language. With this language code, you can build the pseudo-language separately, download it, and integrate it into your website. All other methods are regular - upload/update the file, get the list of target languages with the Get Project API method, and build the target languages. Alternatively, you can also build and download the entire Crowdin project archive at once, which will include the pseudo-language.

  • Recently added new source strings on the website displayed as “unrecognized text”

    The “Unrecognized text” label is displayed on the website if in the Crowdin project strings have been deleted or string keys have been changed in the source files, but the same strings are still present in the pseudo-language that is integrated into the website. To fix this, you just need to update the source files in the Crowdin project again, download the pseudo-language, and update it on the website.

Var denne artikel nyttig?