Translate sign up form

Ask the community
1

Hello, I have created a sign up form and translated the texts, however I don’t see the option to translate the “I have agree to the {terms} & {privacy policy}” and the “or” between the sign up and sign in button>

How could I translate them? I’m on the free plan.

Here’s a screenshot of the form
obraz

1 Like
2

Here is an example in French:


<!-- Signup -->
<script>
document.addEventListener("DOMContentLoaded", function() { 
    $('.terms span').eq(1).text('J’ai lu et j’accepte');
    $('.terms span').eq(2).text('ou');
    $('.terms span').css('font-size','13px');
    $('.terms a').css('font-size','13px');
});
</script>
1 Like
3

Yeah I can’t use that, custom scripts are only on the paid plans. I said I use the free one.

4

Here is my outcome using that code:

The styles and checkbox are broken

image

5

@acjnas share the link without the code I will check and suggest alternative might be the code needs tweaks

6

Thank you Arthur for considering updating the current snippet.

Here is the link I was trying the code (without the code as requested.)

https://joie680.softr.app/signup

7

@acjnas changed the original here can you pls check ?

8

Nice ! it is working as expected. Many many thanx

image

9

I just want to add something that might be important:

If you have more than one signup block, the code will only work on the block you have listed first on your softr app. So try to place these blocks accordingly for the code to work.

10

I will edit to make it block specific

2 Likes
11

@acjnas you would simply add #blockname to each selector like shown below

to

2 Likes
12

Awesome. I will try it!

Thanx.

1 Like
13

thanks a lot for that codes @artur
Do you know if there’s a way to ad a 3rd link to that text?

Like: I accept “link to page1”, “link to page2” and “link to page3” ?

That would be awesome.
Thanks a lot in advance
Julian

14

Hey @Jackson, currently we do not have an option of adding the 3rd link to that text, but I will add your message to our feature requests list to consider when planning further app Improvements!

15

Thanks to @aramayis from softr, here is a code to replace the error message “Please make sure there are no empty required fields.” in french, to add to the previous code :muscle:

$('.error-message.required-errors').text("Veuillez vous assurer qu'il n'y a pas de champs obligatoires vides.");

1 Like
16

Furthermore, it is necessary to modify the error message in case the password does not meet the required criteria, this is the code :

$('.validation-message').text('Le mot de passe doit contenir au moins 6 caractères');

:sunflower:

2 Likes
17

Hello,

Since I updated the Sign Up block, this stopped working, the text is en english again.
What could I do to make it work again?

thanks!

18

@MarsTech we will get back to you soon

19

Hey all,

Here is the updated code for the Signup form (react version)

Please make sure to change the hrID with your block ID. You will find it at the top of the block settings.

<script>
    window.addEventListener('block-loaded-{hrId}', () => {
       var label = document.querySelector("label[for='terms_and_privacy']");
       var paragraph = label.querySelector('p');
       var childElements = paragraph.children;
       
       var paragraph1 = childElements[0];
       var paragraph2 = childElements[1];
       
       paragraph1.firstChild.textContent = 'I AGREE TO THE';
       var linkElement1 = paragraph1.querySelector('a');
       linkElement1.textContent = 'TERMS';
       
       paragraph2.firstChild.textContent = 'AND';
       var linkElement2 = paragraph2.querySelector('a');
       linkElement2.textContent = 'PRIVACY POLICY';
    });
</script>
20

Thanks a lot!

I cannot find the way to make it work. What is the part I should translate?
I’ve tried changing where it says ‘I AGREE TO THE’ to the text in spanish but the change is not reflecting in the form.

regards