Articles in this section
Category / Section

How to localize React PDF?

11 mins read
Essential JS 2 PDF Viewer


The Syncfusion PDF Viewer in React is a modern enterprise UI toolkit that has been built from the ground up to be lightweight, responsive, modular, and touch-friendly. It is also available in other frameworks such as JavaScript, Angular, ASP.NET MVC, and ASP.NET Core.

Refer to the following UG link for getting started with the React PDF Viewer: Documentation

You can create the PDF Viewer web service project using the following KB link and provide that project URL to the serviceUrl property of the PDF Viewer.

https://www.syncfusion.com/kb/10346/how-to-create-pdf-viewer-web-service-application-in-asp-net-core

Localization in PDF Viewer


The text contents provided in the PDF Viewer can be localized using the collection of localized strings for different cultures. By default, the PDF Viewer is localized in “en-US”. A different locale value can be specified using the locale API available in the PDF Viewer.

Refer to the following code to localize the PDF Viewer in French culture:

App.js

import React from 'react';
import './App.css';
import { PdfViewerComponent, Toolbar, Magnification, Navigation, LinkAnnotation, BookmarkView, ThumbnailView, Print, TextSelection, Annotation, TextSearch, Inject } from '@syncfusion/ej2-react-pdfviewer';
import { L10n } from '@syncfusion/ej2-base';

function App() {
  L10n.load({
    'fr-FR': {
      'PdfViewer': {
        'PdfViewer': 'Lecteur de PDF',
        'Cancel': 'Annuler',
        'Download file': 'Télécharger le fichier',
        'Download': 'Télécharger',
        'Enter Password': 'Ce document est protégé par mot de passe. Veuillez entrer un mot de passe.',
        'File Corrupted': 'Fichier corrompu',
        'File Corrupted Content': 'Le fichier est corrompu et ne peut pas être ouvert.',
        'Fit Page': 'Adapter à la page',
        'Fit Width': 'Adapter à la largeur',
        'Automatic': 'Automatique',
        'Go To First Page': 'Afficher la première page',
        'Invalid Password': 'Mot de passe invalide. Veuillez réessayer.',
        'Next Page': 'Voir la page suivante',
        'OK': 'D’accord',
        'Open': 'Ouvrir le fichier',
        'Page Number': 'Numéro de page actuel',
        'Previous Page': 'Voir la page précédente',
        'Go To Last Page': 'Afficher la dernière page',
        'Zoom': 'Zoom',
        'Zoom In': 'Zoom avant',
        'Zoom Out': 'Zoom arrière',
        'Page Thumbnails': 'Vignettes de page',
        'Bookmarks': 'Signets',
        'Print': 'Imprimer le fichier',
        'Password Protected': 'Mot de passe requis',
        'Copy': 'Copier',
        'Text Selection': 'Outil de sélection de texte',
        'Panning': 'Déplacement',
        'Text Search': 'Rechercher du texte',
        'Find in document': 'Rechercher dans le document',
        'Match case': 'Respecter la casse',
        'Apply': 'Appliquer',
        'GoToPage': 'Aller à la page',															   
        'No matches': 'Le visualiseur a fini de rechercher dans le document. Aucune autre correspondance trouvée.',
        'No Text Found': 'Aucun texte trouvé',													   
        'Server error': 'Le service Web n’écoute pas. Le visualiseur PDF s’appuie sur le service Web pour toutes ses fonctionnalités. Veuillez démarrer le service Web pour continuer.',
        'Undo': 'Annuler',
        'Redo': 'Rétablir',
        'Annotation': 'Ajouter ou modifier des annotations',
        'Highlight': 'Surligner du texte',
        'Underline': 'Souligner le texte',
        'Strikethrough': 'Barrer le texte',
        'Delete': 'Supprimer l’annotation',
        'Opacity': 'Opacité',
        'Color edit': 'Changer de couleur',
        'Opacity edit': 'Changer l’opacité',
        'Highlight context': 'Mettre en évidence',
        'Underline context': 'Souligner',
        'Strikethrough context': 'Barrer',
        'Open text': 'Ouvrir',
        'First text': 'Première page',
        'Previous text': 'Page précédente',
        'Next text': 'Page suivante',
        'Last text': 'Dernière page',
        'Zoom in text': 'Zoom avant',
        'Zoom out text': 'Zoom arrière',
        'Selection text': 'Sélectionner',
        'Pan text': 'Déplacer',
        'Print text': 'Imprimer',
        'Search text': 'Rechercher',
        'Annotation Edit text': 'Modifier l’annotation',
        'Line Thickness': 'Épaisseur de ligne',
        'Line Properties': 'Propriétés de ligne',
        'Start Arrow': 'Flèche de début',
        'End Arrow': 'Flèche de fin',
        'Line Style': 'Style de ligne',
        'Fill Color': 'Remplir la couleur',
        'Line Color': 'Couleur de ligne',
        'None': 'Aucun',
        'Open Arrow': 'Flèche ouverte',
        'Closed Arrow': 'Flèche fermée',
        'Round Arrow': 'Flèche ronde',
        'Square Arrow': 'Flèche carrée',
        'Diamond Arrow': 'Flèche en diamant',
        'Cut': 'Couper',
        'Paste': 'Coller',
        'Delete Context': 'Supprimer',
        'Properties': 'Propriétés',
        'Add Stamp': 'Ajouter un tampon',
        'Add Shapes': 'Ajouter des formes',
        'Stroke edit': 'Changer la couleur du trait',
        'Change thickness': 'Changer l’épaisseur du trait',
        'Add line': 'Ajouter une ligne',
        'Add arrow': 'Ajouter une flèche',
        'Add rectangle': 'Ajouter un rectangle',
        'Add circle': 'Ajouter un cercle',
        'Add polygon': 'Ajouter un polygone',
        'Add Comments': 'Ajouter des commentaires',
        'Comments': 'Commentaires',
        'No Comments Yet': 'Aucun commentaire pour le moment',
        'Accepted': 'Accepté',
        'Completed': 'Terminé',
        'Cancelled': 'Annulé',
        'Rejected': 'Rejeté',
        'Leader Length': 'Longueur du repère',
        'Scale Ratio': 'Ratio d’échelle',
        'Calibrate': 'Étalonner',
        'Calibrate Distance': 'Étalonner la distance',
        'Calibrate Perimeter': 'Étalonner le périmètre',
        'Calibrate Area': 'Étalonner la zone',
        'Calibrate Radius': 'Étalonner le rayon',
        'Calibrate Volume': 'Étalonner le volume',
        'Depth': 'Profondeur',
        'Closed': 'Fermé',
        'Round': 'Rond',
        'Square': 'Carré',
        'Diamond': 'Diamant',
        'Edit': 'Modifier',
        'Set Status': 'Définir le statut',
        'Post': 'Publier',
        'Page': 'Page',
        'Add a comment': 'Ajouter un commentaire',
        'Add a reply': 'Ajouter une réponse',
        'Import Annotations': 'Importer des annotations',
        'Export Annotations': 'Exporter des annotations',
        'Add': 'Ajouter',
        'Clear': 'Effacer',
        'Bold': 'Gras',
        'Italic': 'Italique',
        'Strikethroughs': 'Barrés',
        'Underlines': 'Soulignés',
        'Superscript': 'Exposant',
        'Subscript': 'Indice',
        'Align left': 'Aligner à gauche',
        'Align right': 'Aligner à droite',
        'Center': 'Centrer',
        'Justify': 'Justifier',
        'Font color': 'Couleur de police',
        'Text Align': 'Alignement du texte',
        'Text Properties': 'Propriétés du texte',
        'Draw Signature': 'Dessiner une signature',
        'Create': 'Créer',
        'Font family': 'Famille de polices',
        'Font size': 'Taille de police',
        'Free Text': 'Texte libre'
      }
    }
  });

  return (
    <div>  
      <PdfViewerComponent id="container" documentPath="PDF_Succinctly.pdf" serviceUrl="https://ej2services.syncfusion.com/production/web-services/api/pdfviewer" locale="fr-FR" style={{ 'height': '640px' }}>
        <Inject services={[Toolbar, Magnification, Navigation, Annotation, LinkAnnotation, BookmarkView, ThumbnailView, Print, TextSelection, TextSearch]}/>
      </PdfViewerComponent>
    </div>
  );
}

export default App;

Sample Link:  https://www.syncfusion.com/downloads/support/directtrac/general/ze/PdfViewer_Localize1930589526


Conclusion

We hope you enjoyed learning about how to localize React PDF.

You can refer to our Angular PDF Viewer's feature tour page to know about its other groundbreaking feature representations. You can also explore our Angular PDF Viewer example to understand how to present and manipulate data.

For current customers, you can check out our Angular components from the License and Downloads page. If you are new to Syncfusion®, you can try our 30-day free trial to check out our Angular PDF Viewer and other Angular components.

If you have any queries or require clarifications, please let us know in the comments below. You can also contact us through our support forumsBoldDesk Support, or feedback portal. We are always happy to assist you!

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please  to leave a comment
Access denied
Access denied