Defnyddio TacoTranslate
Cyfieithu llinynnau
Ar hyn o bryd mae tair ffordd o gyfieithu llinynnau: y cydran Translate
, y hook useTranslation
, neu'r offeryn translateEntries
.
Defnyddio'r cydran Translate
.
Yn allbwn cyfieithiadau o fewn elfen span
, ac mae'n cefnogi arddangos HTML.
import {Translate} from 'tacotranslate/react';
function Page() {
return <Translate string="Hello, world!" />;
}
Gallwch newid math yr elfen trwy ddefnyddio, er enghraifft, as="p"
ar y cydran.
Gan ddefnyddio'r useTranslation
hook.
Mae'n dychwelyd cyfieithiadau fel llinyn plaen. Defnyddiol, er enghraifft, mewn tagiau meta
.
import {useEffect} from 'react';
import {useTranslation} from 'tacotranslate/react';
function Page() {
const helloWorld = useTranslation('Hello, world!');
useEffect(() => {
alert(helloWorld);
}, [helloWorld]);
return (
<title>{useTranslation('My page title')}</title>
);
}
Defnyddio'r offeryn translateEntries
.
Cyfieithwch llinynnau ar ochr y gweinydd. Rhoi hwb i'ch delweddau OpenGraph.
import {createEntry, translateEntries} from 'tacotranslate';
async function generateMetadata(locale = 'es') {
const title = createEntry({string: 'Hello, world!'});
const description = createEntry({string: 'TacoTranslate on the server'});
const translations = await translateEntries(
tacoTranslate,
{origin: 'opengraph', locale},
[title, description]
);
return {
title: translations(title),
description: translations(description)
};
}
Sut y caiff llinynnau eu cyfieithu
Pan fydd llinynnau yn cyrraedd ein gweinyddion, rydym yn eu dilysu ac yn eu cadw yn gyntaf, ac yna'n dychwelyd cyfieithiad peiriant ar unwaith. Er bod cyfieithiadau peiriant yn gyffredinol o ansawdd is na'n cyfieithiadau AI, maent yn darparu ymateb cychwynnol cyflym.
Ar yr un pryd, rydym yn cychwyn swydd gyfieithu yn y cefndir i gynhyrchu cyfieithiad AI o ansawdd uchel ac arloesol ar gyfer eich llinyn. Unwaith y bydd y cyfieithiad AI yn barod, bydd yn disodli'r cyfieithiad peiriant a bydd yn cael ei anfon bob tro y byddwch yn gofyn am gyfieithiadau ar gyfer eich llinynnau.
Os ydych wedi cyfieithu llinyn â llaw, mae'r cyfieithiadau hynny'n cael blaenoriaeth ac fe'u dyfernir yn eu lle.
Defnyddio tarddiadau
Mae prosiectau TacoTranslate yn cynnwys yr hyn yr ydym yn ei alw'n tarddiadau. Ystyriwch hwy fel pwyntiau mynediad, ffolderi neu grwpiau ar gyfer eich llinynnau a'ch cyfieithiadau.
import {TacoTranslate} from 'tacotranslate/react';
function Menu() {
return (
<TacoTranslate origin="application-menu">
// ...
</TacoTranslate>
);
}
Mae tarddiadau yn eich galluogi i wahanu llinynnau mewn cynwysyddion ystyrlon. Er enghraifft, gallwch gael un tarddiad ar gyfer dogfennaeth ac un arall ar gyfer eich tudalen farchnata.
Er mwyn cael rheolaeth fwy manwl, gallech sefydlu tarddiadau ar lefel y cydran.
Er mwyn cyflawni hyn, ystyriwch defnyddio sawl darparwr TacoTranslate yn eich prosiect.
Sylwch y gall yr un llinyn gael cyfieithiadau gwahanol mewn tarddiadau gwahanol.
Yn y pen draw, mae'n dibynnu arnoch chi a'ch anghenion sut i rannu llinynnau rhwng tarddiadau. Fodd bynnag, nodwch y gall cael nifer fawr o linynnau mewn un tarddiad gynyddu amseroedd llwytho.
Trin newidynnau
Dylech bob amser ddefnyddio newidynnau ar gyfer cynnwys deinamig, megis enwau defnyddwyr, dyddiadau, cyfeiriadau e-bost a mwy.
Mae newidynnau mewn llinynnau yn cael eu datgan gan ddefnyddio cromfachau dwbl, fel {{variable}}
.
import {Translate} from 'tacotranslate/react';
function Greeting() {
const name = 'Juan';
return <Translate string="Hello, {{name}}!" variables={{name}} />;
}
import {useTranslation} from 'tacotranslate/react';
function useGreeting() {
const name = 'Juan';
return useTranslation('Hello, {{name}}!', {variables: {name}});
}
Rheoli cynnwys HTML
Yn ddiofyn, mae'r cydran Translate
yn cefnogi ac yn arddangos cynnwys HTML. Fodd bynnag, gallwch ddewis peidio â defnyddio'r ymddygiad hwn trwy osod useDangerouslySetInnerHTML
i false
.
Argymhellir yn gryf diffodd rendro HTML wrth gyfieithu cynnwys nad yw'n ddibynadwy, megis cynnwys a gynhyrchwyd gan ddefnyddwyr.
Caiff pob allbwn ei lanhau bob amser gan sanitize-html cyn ei arddangos.
import {Translate} from 'tacotranslate/react';
function Page() {
return (
<Translate
string={`
Welcome to <strong>my</strong> website.
I’m using <a href="{{url}}">TacoTranslate</a> to translate text.
`}
variables={{url: 'https://tacotranslate.com'}}
useDangerouslySetInnerHTML={false}
/>
);
}
Bydd yr enghraifft uchod yn cael ei arddangos fel testun plaen.