ਦਸਤਾਵੇਜ਼: ਉन्नਤ ਵਰਤੋਂ

ਉੱਨਤ ਵਰਤੋਂ

Punjabi

ਸੱਜੇ ਤੋਂ ਖੱਬੇ ਭਾਸ਼ਾਵਾਂ ਦਾ ਸੰਭਾਲ

TacoTranslate ਤੁਹਾਡੇ React ਐਪਲੀਕੇਸ਼ਨਾਂ ਵਿੱਚ ਅਰਬੀ ਅਤੇ ਹਿਬਰੂ ਵਰਗੀਆਂ ਸੱਜੇ ਤੋਂ ਖੱਬੇ (RTL) ਭਾਸ਼ਾਵਾਂ ਨੂੰ ਸਹਿਯੋਗ ਦੇਣਾ ਆਸਾਨ ਬਣਾਉਂਦਾ ਹੈ। RTL ਭਾਸ਼ਾਵਾਂ ਦੀ ਸਹੀ ਸੰਭਾਲ ਇਹ ਯਕੀਨੀ ਬਣਾਉਂਦੀ ਹੈ ਕਿ ਤੁਹਾਡਾ ਸਮੱਗਰੀ ਉਹਨਾਂ ਉਪਭੋਗਤਿਆਂ ਲਈ ਸਹੀ ਤਰ੍ਹਾਂ ਦਿਖਾਈ ਦੇਵੇ ਜੋ ਸੱਜੇ ਤੋਂ ਖੱਬੇ ਪੜ੍ਹਦੇ ਹਨ।

import {useTacoTranslate} from 'tacotranslate/react';

function Document() {
	const {locale, isRightToLeft} = useTacoTranslate();

	return (
		<html lang={locale} dir={isRightToLeft ? 'rtl' : 'ltr'}>
			<body>
				// ...
			</body>
		</html>
	);
}

ਤੁਸੀਂ ਵਰਤੀ ਜਾ ਰਹੀ ਭਾਸ਼ਾ ਨੂੰ React ਦੇ ਬਾਹਰ ਜਾਂਚਣ ਲਈ ਦਿੱਤਾ ਗਿਆ isRightToLeftLocaleCode ਫੰਕਸ਼ਨ ਵੀ ਵਰਤ ਸਕਦੇ ਹੋ।

import {isRightToLeftLocaleCode} from 'tacotranslate';

function foo(locale = 'es') {
	const direction = isRightToLeftLocaleCode(locale) ? 'rtl' : 'ltr';
	// ...
}

ਅਨੁਵਾਦ ਨੂੰ ਅਯੋਗ ਕਰਨਾ

ਇੱਕ ਸਤਰ ਦੇ ਖਾਸ ਹਿੱਸਿਆਂ ਲਈ ਅਨੁਵਾਦ ਨੂੰ ਅਣਚਾਲੂ ਕਰਨ ਜਾਂ ਕੁਝ ਖੰਡਾਂ ਨੂੰ ਜਿਵੇਂ ਹਨ ਤਿਵੇਂ ਰੱਖਣ ਲਈ, ਤੁਸੀਂ ਤ੍ਰਿਪਲ ਵਰਗੇ ਕੋਠੜੀਆਂ triple square brackets ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹੋ। ਇਹ ਫੀਚਰ ਨਾਮਾਂ, ਤਕਨੀਕੀ ਸ਼ਬਦਾਵਲੀ, ਜਾਂ ਹੋਰ ਕਿਸੇ ਵੀ ਸਮੱਗਰੀ ਜੋ ਅਨੁਵਾਦ ਨਹੀਂ ਹੋਣੀ ਚਾਹੀਦੀ, ਦੀ ਮੂਲ ਫਾਰਮੈਟ ਨੂੰ ਬਰਕਰਾਰ ਰੱਖਣ ਲਈ ਲਾਭਦਾਇਕ ਹੈ।

import {Translate} from 'tacotranslate/react';

function Component() {
	return (
		<Translate string="Hello, [[[TacoTranslate]]]!" />
	);
}

ਇਸ ਉਦਾਹਰਨ ਵਿੱਚ, ਸ਼ਬਦ “TacoTranslate” ਅਨੁਵਾਦ ਵਿੱਚ ਬਿਨਾਂ ਬਦਲੇ ਰਹੇਗਾ।

ਕਈ TacoTranslate ਪ੍ਰਦਾਤਾ

ਅਸੀਂ ਤੁਹਾਡੇ ਐਪ ਵਿੱਚ ਕਈ TacoTranslate ਪ੍ਰਦਾਤਾਵਾਂ ਨੂੰ ਵਰਤਣ ਦੀ ਬਹੁਤ ਸਿਫਾਰਿਸ਼ ਕਰਦੇ ਹਾਂ। ਇਹ ਤੁਹਾਡੇ ਅਨੁਵਾਦਾਂ ਅਤੇ ਸਤਰਾਂ ਨੂੰ ਵੱਖ-ਵੱਖ ਮੂਲਾਂ, ਜਿਵੇਂ ਕਿ ਤੁਹਾਡਾ ਹੈਡਰ, ਫੁੱਟਰ ਜਾਂ ਵਿਸ਼ੇਸ਼ ਭਾਗਾਂ ਵਿੱਚ ਸੰਗਠਿਤ ਕਰਨ ਲਈ ਲਾਭਦਾਇਕ ਹੈ।

ਤੁਸੀਂ ਇਥੇ ਉਤਪੱਤੀਆਂ ਦੇ ਵਰਤੋਂ ਬਾਰੇ ਹੋਰ ਪੜ੍ਹ ਸਕਦੇ ਹੋ।

TacoTranslate ਪ੍ਰਦਾਤਾ ਕਿਸੇ ਵੀ ਮਾਪੇ ਪ੍ਰਦਾਤਾ ਤੋਂ ਸੈਟਿੰਗਸ ਵਾਰਸਾ ਵਜੋਂ ਲੈਂਦੇ ਹਨ, ਇਸ ਲਈ ਤੁਹਾਨੂੰ ਹੋਰ ਕਿਸੇ ਵੀ ਸੈਟਿੰਗਸ ਨੂੰ ਦੁਹਰਾਉਣ ਦੀ ਜ਼ਰੂਰਤ ਨਹੀਂ ਪਵੇਗੀ।

import createTacoTranslateClient from 'tacotranslate';
import {TacoTranslate} from 'tacotranslate/react';

const tacoTranslateClient = createTacoTranslateClient({apiKey: 'YOUR_API_KEY'});

function Header() {
	return (
		<TacoTranslate origin="header">
			// ...
		</TacoTranslate>
	);
}

function Menu() {
	return (
		<TacoTranslate origin="menu">
			// ...
		</TacoTranslate>
	);
}

export default function App() {
	return (
		<TacoTranslate client={tacoTranslateClient} origin="page" locale="es">
			<Header />
			<Menu />
		</TacoTranslate>
	);
}

ਮੂਲ ਜਾਂ ਲੋਕੇਲ ਨੂੰ ਅਧਿਕਾਰਿਤ ਕਰਨਾ

ਕਈ TacoTranslate ਪ੍ਰਦਾਤਿਆਂ ਦੀ ਵਰਤੋਂ ਤੋਂ ਇਲਾਵਾ, ਤੁਸੀਂ Translate ਕੰਪੋਨੈਂਟ ਅਤੇ useTranslation ਹੂਕ ਪੱਧਰਾਂ 'ਤੇ ਮੂਲ ਅਤੇ ਭੂਮਿਕਾ ਦੋਹਾਂ ਨੂੰ ਵਧੀ ਸੈੱਟ ਕਰ ਸਕਦੇ ਹੋ।

import {Translate, useTranslation} from 'tacotranslate/react';

function Greeting() {
	const spanishHello = useTranslation('Hello!', {locale: 'es'});

	return (
		<>
			{spanishHello}
			<Translate string="What’s up?" origin="greeting" />
		</>
	);
}

ਲੋਡਿੰਗ ਨੂੰ ਸੰਭਾਲਣਾ

ਜਦੋਂ ਕਲਾਇੰਟ ਪਾਸੇ ਭਾਸ਼ਾਵਾਂ ਬਦਲੀਆਂ ਜਾਂਦੀਆਂ ਹਨ, ਤਰਜਮਿਆਂ ਨੂੰ ਲੈ ਕੇ ਆਉਣ ਵਿੱਚ ਉਪਭੋਗਤਾ ਦੇ ਕਨੈਕਸ਼ਨ ਦੇ ਅਨੁਸਾਰ ਕੁਝ ਸਮਾਂ ਲੱਗ ਸਕਦਾ ਹੈ। ਤੁਸੀਂ ਬਦਲਾਅ ਦੌਰਾਨ ਵਿਜ਼ੂਅਲ ਫੀਡਬੈਕ ਪ੍ਰਦਾਨ ਕਰਕੇ ਉਪਭੋਗਤਾ ਦੇ ਤਜਰਬੇ ਨੂੰ ਸੁਧਾਰਨ ਲਈ ਇੱਕ ਲੋਡਿੰਗ ਇੰਡਿਕੇਟਰ ਦਿਖਾ ਸਕਦੇ ਹੋ।

import {useTacoTranslate} from 'tacotranslate/react';

function Component() {
	const {isLoading} = useTacoTranslate();

	return (
		isLoading ? 'Translations are loading...' : null
	);
}

ਬਹੁਵਚਨ ਬਿੰਦੂ

ਵੱਖ-ਵੱਖ ਭਾਸ਼ਾਵਾਂ ਵਿੱਚ ਬਹੁਵਚਨਤਾ ਨੂੰ ਸੰਭਾਲਣ ਅਤੇ ਗਿਣਤੀ ਅਧਾਰਿਤ ਲੇਬਲਾਂ ਨੂੰ ਸਹੀ ਤਰੀਕੇ ਨਾਲ ਦਰਸਾਉਣ ਲਈ, ਇਸ ਨੂੰ ਸਭ ਤੋਂ ਵਧੀਆ ਅਭਿਆਸ ਮੰਨਿਆ ਜਾਂਦਾ ਹੈ:

import {Translate, useLocale} from 'tacotranslate/react';

function PhotoCount() {
	const locale = useLocale();
	const count = 1;

	return count === 0 ? (
		<Translate string="You have no photos." />
	) : count === 1 ? (
		<Translate string="You have 1 photo." />
	) : (
		<Translate
			string="You have {{count}} photos."
			variables={{count: count.toLocaleString(locale)}}
		/>
	);
}

ਕਈ ਭాషਾਵਾਂ

ਇੱਕੋ ਐਪਲੀਕੇਸ਼ਨ ਵਿੱਚ ਇਕੱਠੇ ਕਈ ਭਾਸ਼ਾਵਾਂ ਦਾ ਸਮਰਥਨ ਕਰਨ ਲਈ, ਤੁਸੀਂ ਵੱਖ-ਵੱਖ locale ਮੁੱਲਾਂ ਨਾਲ ਕਈ TacoTranslate ਪ੍ਰਦਾਤਾਵਾਂ ਦੀ ਵਰਤੋਂ ਕਰ ਸਕਦੇ ਹੋ, ਜਿਵੇਂ ਹੇਠਾਂ ਦਿਖਾਇਆ ਗਿਆ ਹੈ:

ਤੁਸੀਂ locale ਨੂੰ ਕੰਪੋਨੈਂਟ ਜਾਂ ਹੂਕ ਸਤਰ ਤੇ ਵੀ ਓਵਰਰਾਈਡ ਕਰ ਸਕਦੇ ਹੋ।

import createTacoTranslateClient from 'tacotranslate';
import {TacoTranslate, Translate} from 'tacotranslate/react';

const tacoTranslateClient = createTacoTranslateClient({apiKey: 'YOUR_API_KEY'});

function Spanish() {
	return (
		<TacoTranslate locale="es">
			<Translate string="Hello, world in Spanish!" />
		</TacoTranslate>
	);
}

function Norwegian() {
	return (
		<TacoTranslate locale="no">
			<Translate string="Hello, world in Norwegian!" />
		</TacoTranslate>
	);
}

export default function App() {
	return (
		<TacoTranslate client={tacoTranslateClient} origin="page" locale="es">
			<Spanish />
			<Norwegian />
		</TacoTranslate>
	);
}

ਟ੍ਰਾਂਸਲੇਸ਼ਨ ID ਦੀ ਵਰਤੋਂ ਕਰਨਾ

ਤੁਸੀਂ Translate ਕੰਪੋਨੇਟ ਵਿੱਚ ਵੱਖ-ਵੱਖ ਅਨੁਵਾਦਾਂ ਜਾਂ ਅਰਥਾਂ ਨੂੰ ਸੰਭਾਲਣ ਲਈ id ਸ਼ਾਮਲ ਕਰ ਸਕਦੇ ਹੋ। ਇਹ ਖਾਸ ਕਰਕੇ ਉਸ ਸਮੇਂ ਲਾਭਦਾਇਕ ਹੁੰਦਾ ਹੈ ਜਦੋਂ ਇੱਕੋ ਹੀ ਲਫ਼ਜ਼ ਦਾ ਅਨੁਵਾਦ ਸੰਦਰਭ ਅਨੁਸਾਰ ਵੱਖਰਾ ਹੋਵੇ। ਵਿਲੱਖਣ IDs ਦੇ ਕੇ, ਤੁਸੀਂ ਇਹ ਯਕੀਨੀ ਬਣਾਉਂਦੇ ਹੋ ਕਿ ਹਰ ਲਫ਼ਜ਼ ਦਾ ਉਚਿਤ ਅਰਥ ਅਨੁਸਾਰ ਸਹੀ ਤਰੀਕੇ ਨਾਲ ਅਨੁਵਾਦ ਕੀਤਾ ਜਾਵੇ।

import {Translate} from 'tacotranslate/react';

function Header() {
	return (
		<Translate id="header" string="Login" />
	);
}

function Footer() {
	return (
		<Translate id="footer" string="Login" />
	);
}

ਉਦਾਹਰਨ ਵਜੋਂ, ਹੇਡਰ ਲੌਗਇਨ ਦਾ ਅਨੁਵਾਦ ਸਪੇਨੀ ਵਿੱਚ “Iniciar sesión” ਹੋ ਸਕਦਾ ਹੈ, ਅਤੇ ਫੁਟਰ ਲੌਗਇਨ ਦਾ ਅਨੁਵਾਦ “Acceder” ਹੋ ਸਕਦਾ ਹੈ।

ਸਰੋਤ ਤਰੀਕੇ