How to translate button captions in modern Forms, from English to another language

Please follow this article if you would like to translate text from English to another language. In this example the text will be translated from English to French.

1.  In "New" or "Edit" item mode, click on the cog wheel, in the right corner and choose "JS Script editor" option.

This will open the Script editor popup:


2. Copy and paste the attached Java script into script editor. 

 Java script


Use the link above or Copy and paste the below script into script editor. Please replace the highlighted portion of the script with your own button caption text. For example you can change the captions to another language such as German, French or Spanish.

//#region Change 'Save' button caption  
// Change 'Save' button caption     

kwizcom.ModernUILibrary.FormPage.OnReady("change-button-caption", function (form) {
   if (form.context.pageType === 4) return;//only work on new/edit item form    
   document.querySelector("[data-icon-name='Save']").parentNode.querySelector("span[class*='ms-Button-label']").innerHTML = "sauvegarder";
   document.querySelector("[data-icon-name='SaveAs']").parentNode.querySelector("span[class*='ms-Button-label']").innerHTML = "appliquer";
   document.querySelector("[data-icon-name='Cancel']").parentNode.querySelector("span[class*='ms-Button-label']").innerHTML = "Annuler";
   document.querySelector("[data-icon-name='Link']").parentNode.querySelector("span[class*='ms-Button-label']").innerHTML = "lien";  
     save: { text: "sauvegarder" },
     apply: { text: "appliquer" },
     close: { text: "Annuler" }
   document.querySelector("label[class*='kw-formTitle']").innerHTML = document.querySelector("label[class*='kw-formTitle']").innerHTML.replace("New Item", "nouvel élément");
   document.querySelector("label[for^='AttachmentsFieldControl']").innerHTML = "Pièces jointes";
   document.querySelector("div[title='Add Attachment']").querySelector("div[class*='ms-Button-label']").innerHTML = "ajouter une pièce jointe";
   document.querySelector("").querySelectorAll("div").forEach((function(x){if(x.innerHTML == "You created this item") x.innerHTML = "Vous avez créé cet élément";}));
//#endregion Change 'Save' button caption 

Here is use case with an example;

I would like to change the top and bottom button captions from English to French. 

Using the above script, you will notice that the script changes the top and bottom button caption text from English to French.