PickBazar Documentation
WelcomeHow It WorksGetting StartedFeaturesAvailable ScriptsCustomizationStyles and AssetsUtilities
Back-End Integration
Deployment
Update
SEO and Analytics
API
WalletSocial LoginOTP (Mobile Number Verification)PaymentTranslationMultilingualStep 1: Enable Multilingual FeatureStep 2: How to add new language in admin?Step 3: How to add new language in shop?Step 3: How to translate static content for admin?Step 4: How to translate static content for shop?Step 5: How to translate content?Step 6: How to add custom or solved broken font issue?MultiVendorNew PageExport ImportFAQSupportVersions

Multilingual

If your business or site doesn't require multiple languages, then we don't recommend enabling the multilanguage feature. It'll increase the complexity of maintaining all the language simultaneously. Only enable it if you know what multilanguage is and your business or site needs that feature.

Step 1: Enable Multilingual Feature

API:

At first open api -> .env and make true of ``

TRANSLATION_ENABLED=true

EnableAPIMultilang.png

Admin

For admin,

update admin -> rest -> .env and update,

NEXT_PUBLIC_ENABLE_MULTI_LANG=true

And add available language to NEXT_PUBLIC_AVAILABLE_LANGUAGES with a comma separator.

For example, at your site, you want to support three languages, one is English, and the rest of the two will be german and Arabic. Then NEXT_PUBLIC_AVAILABLE_LANGUAGES will be like this,

NEXT_PUBLIC_AVAILABLE_LANGUAGES=en,de,ar

EnableAdminMultilang.png

For graphql .env will be at admin -> graphql -> .env

Shop

For shop, similarly,

update shop -> .env and update,

NEXT_PUBLIC_ENABLE_MULTI_LANG=true

And add available language to NEXT_PUBLIC_AVAILABLE_LANGUAGES with a comma separator.

For example, at your site, you want to support three languages, one is English, and the rest of the two will be german and Arabic. Then NEXT_PUBLIC_AVAILABLE_LANGUAGES will be like this,

NEXT_PUBLIC_AVAILABLE_LANGUAGES=en,de,ar

EnableShopMultilang.png

After that, if you already host your site on server then make sure you redeploy the API and rebuild the frontend,

https://pickbazar-doc.vercel.app/faq#how-to-rebuild-the-project

Step 2: How to add new language in admin?

add-new-lang-admin-1.png add-new-lang-admin-2.png File Location

admin\rest\public\locales\sg\banner.json

add-new-lang-admin-3.png

File Location

admin\rest\src\utils\locals.tsx

add-new-lang-admin-4.png

File Location

admin\rest\src\components\icons\flags\

add-new-lang-admin-5.png

Step 3: How to add new language in shop?

add-new-lang-shop-1.png add-new-lang-shop-2.png File Location

shop\public\locales\sg\banner.json

add-new-lang-shop-3.png

File Location

shop\src\lib\locals.tsx

add-new-lang-shop-4.png

File Location

shop\src\components\icons\flags\

add-new-lang-shop-5.png

Step 3: How to translate static content for admin?

File Location

admin\rest\public\locales\de\common.json

static-content-1.png

Step 4: How to translate static content for shop?

File Location

shop\rest\public\locales\de\common.json

static-content-1.png

Step 5: How to translate content?

Now after successfully configuring the Multilingual follow this procedure to translate your existing content to another one.

Data Type

Now before starting the translation, you've to understand about dependent and non-dependent data at pickbazar.

At pickbazar, some data are required to create another data, and it's called dependent data, and the independent data is called non-dependent data.

For example,

To create product types, categories, tags, author, manufacture, attributes, etc are required.

And for coupons or settings, no prior data is required.

Now, to translate a product, you must have to translate types, categories, tags, authors, manufacturers, and attributes at first. Without that, when you translate a product, you can't add your categories or types as those data are not translated yet.

To simplify the process, we made a serial for you. Just follow this serial, and it'll make the process relatively easy.

1. Settings
2. Order Status
3. Group
4. Author
5. Manufacturer
6. Tags
7. Categories
8. Attributes
9. Products

Translate Settings

If you want to translate the settings,

just go to your admin -> settings

It'll open default language settings.

DefaultLanguageSettings

Then change the language from the navbar, and the settings page will be redirected,

ChangeSettingsLanguage

Then update the text of the settings page and click save.

Translate Order Status

To translate the order status,

  1. Go to the order status page from the admin
  2. Then click Three Dot and Create translate, TranslateOrderStatus.png
  3. Then translate the text and click Save. TranslateOrderStatus2.png

Similarly, translate all the order status.

Translate Group, Author, Manufacturer, Tags, Categories:

Follow order status procedure to translate Group, Author, Manufacturer, Tags, and Categories.

Translate Products

Translate Simple Products:

Similarly, just edit three dots and translate the product.

But during the translation, don't change the SKU. SKU for a product has to be similar for all languages. We calculate the quantity based on that field.

SKUTranslate.png

Translate Variable Product:

For variable products, you must have to translate attributes first. Without attributes, you can't get an attribute list during the translation.

Click on Three Dots to translate the item.

But for the variable product, you must create the variation for translation again.

Translate Attributes

attributes-1.png attributes-2.png

Translate Groups

groups-1.png groups-2.png

Translate Variable Products

variable-product-1.png variable-product-2.png variable-product-3.png variable-product-4.png

Make sure translated variable product variation value same like as default language example (attribute name, attribute value, price, sale price, quantity and SKU).

variable-product-5.png variable-product-6.png

Step 6: How to add custom or solved broken font issue?

how-to-add-custom-font-1.png

File Location

api\config\pdf.php
'font_path' => base_path('resources/fonts/'),
'font_data' => [
'example' => [
'R' => 'example.ttf', // regular font
'B' => 'example.ttf', // optional: bold font
'I' => 'example.ttf', // optional: italic font
'BI' => 'example.ttf', // optional: bold-italic font
'useOTL' => 0xFF,
'useKashida' => 75,
]
],

how-to-add-custom-font-2.png

File Location

api\resources\fonts\

how-to-add-custom-font-3.png

File Location

api\packages\marvel\stubs\resources\views\pdf\order-invoice.blade.php
api\resources\views\pdf\order-invoice.blade.php
@if($language === "ex")
<style type="text/css">
body {
font-family: Arial, sans-serif, example;
}
</style>
@endif

how-to-add-custom-font-4.png

how-to-add-custom-font-5.png

If you are facing above the issue just replace these code.

File Location

api\config\pdf.php
'font_path' => base_path('resources/fonts/'),
'font_data' => [
'example' => [
'R' => 'example.ttf', // regular font
'B' => 'example.ttf', // optional: bold font
'I' => 'example.ttf', // optional: italic font
'BI' => 'example.ttf', // optional: bold-italic font
// 'useOTL' => 0xFF,
'useKashida' => 75,
]
],

If you face any issues with Multilingual, or you've any suggestions to improve the Multilingual feature, then please open a ticket at (https://redqsupport.ticksy.com/)[https://redqsupport.ticksy.com/]