How can I change or delete the captions "First Name" and "Last Name" in forms?

This topic was originally posted here in 2013: 

I had the same issue with translating from English to French on the contact form on my bilingual site. The original custom code workarounds that were provided worked for me last year, but at some point afterwards the form reverted back to English. Squarespace help confirmed the only way to "fix" this is through custom code. Would anyone know of any new or revised code I can inject to make this work? I want "first name" to read "prénom" and "last name" to read "nom". Thank you! 

You can use CSS to translate text. Need link to form.

You can also JavaScript/CSS to remove caption. Need link to form.

Hello @tuanphan,

How can I do this? with CSS only? and only for the English form?

I have used this from Paul2009, but it didn't work.

<script>  
  if (document.querySelector("#name-yui_3_17_2_1_1559593002966_3555")) {
    document.querySelector('.field.first-name .caption .caption-text').innerText = 'First name';
    document.querySelector('.field.last-name .caption .caption-text').innerText = 'Last name'; 
  }
</script>

in the PAGE HEADER CODE INJECTION of a certain page in order to only change it there, but nothing happened. Then I went on and put it onto the global footer code injection and then it change BUT unfortunately for all pages. I would like to have it only on my English contanct form.

Do you know how I can accomplish that? I am working on stelviopartners.com

Thank you very much, cris

2 hours ago, Xbal said:

Hello @tuanphan,

How can I do this? with CSS only? and only for the English form?

I have used this from Paul2009, but it didn't work.

<script>  
  if (document.querySelector("#name-yui_3_17_2_1_1559593002966_3555")) {
    document.querySelector('.field.first-name .caption .caption-text').innerText = 'First name';
    document.querySelector('.field.last-name .caption .caption-text').innerText = 'Last name'; 
  }
</script>

in the PAGE HEADER CODE INJECTION of a certain page in order to only change it there, but nothing happened. Then I went on and put it onto the global footer code injection and then it change BUT unfortunately for all pages. I would like to have it only on my English contanct form.

Do you know how I can accomplish that? I am working on stelviopartners.com

Thank you very much, cris

Where is the page's form

On 6/2/2021 at 6:49 PM, Xbal said:

Hello @tuanphan,

How can I do this? with CSS only? and only for the English form?

I have used this from Paul2009, but it didn't work.

<script>  
  if (document.querySelector("#name-yui_3_17_2_1_1559593002966_3555")) {
    document.querySelector('.field.first-name .caption .caption-text').innerText = 'First name';
    document.querySelector('.field.last-name .caption .caption-text').innerText = 'Last name'; 
  }
</script>

in the PAGE HEADER CODE INJECTION of a certain page in order to only change it there, but nothing happened. Then I went on and put it onto the global footer code injection and then it change BUT unfortunately for all pages. I would like to have it only on my English contanct form.

Do you know how I can accomplish that? I am working on stelviopartners.com

Thank you very much, cris

It looks like you solved?

Thanks with your help!

On 6/2/2021 at 4:20 PM, bangank36 said:

Where is the page's form

https://www.stelviopartners.com/contact-us