Jump to content

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

Recommended Posts

Hello, I need to translate that words into Spanish or delete them, I tried to hide them with some CSS but I think that they don't have any class or at least I couldn't find it.Thanks in advance and excuse my English!

Link to comment
  • 1 year later...
  • Replies 38
  • Views 33.8k
  • Created
  • Last Reply

I’m not a developer, but this works for me. You need to inject code, though:

  1. Go to the page where your form is located.
  2. Open the Settings.
  3. Click the Advanced tab.
  4. Place the following code in the Page Header Code Injection area:
    
    
    <script>function addLoadEvent(func) { var oldonload = window.onload;if (typeof window.onload != 'function') {window.onload = func;} else {window.onload = function() {  if (oldonload) {    oldonload();  }  func();}}} addLoadEvent(function() {sqsFirstName = document.getElementsByClassName("caption")[0].innerHTML;myFirstName = sqsFirstName.replace("First Name", "Nombre");document.getElementsByClassName("caption")[0].innerHTML = myFirstName; sqsLastName = document.getElementsByClassName("caption")[1].innerHTML;myLastName = sqsLastName.replace("Last Name", "Apellidos");document.getElementsByClassName("caption")[1].innerHTML = myLastName;});</script>

Notes:

You need to replace YOURTAGFORFIRSTNAME and YOURTAGFORLASTNAME with your own text.

Since the script will only run “after” the page has been loaded, there will be a short period of time when you will be able to see the old tags, but they will be replaced immediately with the new ones.

Hope this saves time to other people. It’s been a nightmare.

Cheers.

Link to comment

WOW! -- THANK YOU SO MUCH !!!!! It worked like a charm. I substituted the Spanish for Prénom and Nom in French. At first I had copy pasted into WORD to transfer to a second profile on my computer, and that did not work, so I copy pasted into NOTEPAD, saved it, switched profiles, and copy pasted from NOTEPAD into the Code injection area.

I seem to remember other pages that have "un-editable" areas, and will try to modify this script to adapt those.

Thanks again !!!! - Cragg

Link to comment

The first block of code formatting was getting swallowed up by the list that proceeds it. It must be a bug in the Markdown parser.

There’s a couple of workarounds. Manually enter the list tags (<ol><li>Item 1</li>…) – as I did with your answer.

Downside: Lots of markup!

Alternatively, start a newline at the end of the list, then another, add a non-breaking space ( ), two spaces and another newline. Now you can add a formatted code.

Downside: There’s now a big gap between the end of the list and the code.

The name is an Anglicised form of the Greek Korvetti — I like to think there’s a little bit of the ancient Hellenic drive in me.

Link to comment

I’ve come up with a much better option. This replaces all the different values (at least the ones I’m aware of) in your language. The example is in Spanish, but you can change it for any other values. Put this code in your code injection area (Footer) and link to jQuery. That’s all you need. Hope it helps.


<script>
function addLoadEvent(func) {
 var oldonload = window.onload;
 if (typeof window.onload != 'function') {
   window.onload = func;
 } else {
   window.onload = function() {
     if (oldonload) {
       oldonload();
     }
     func();
   }
 }
}

addLoadEvent(function() {

 $('.caption').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/First Name/ig, "Nombre"));
   }
 });

 $('.caption').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/Last Name/ig, "Apellidos"));
   }
 });

 $('.pagination').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/Newer/ig, "Más recientes"));
   }
 });

 $('.pagination').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/Older/ig, "Más antiguas"));
   }
 });

 $('.tags-cats').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/tags/ig, "etiquetas"));
   }
 });

 $('.excerpt').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/Read More/ig, "Leer más"));
   }
 });

 $('.sqs-comment-link.sqs-disqus-comment-link').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/Comment/ig, "Comentario"));
   }
 });

 $('.post-meta.author-date').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/January/ig, "Enero"));
   }
 });
 $('.post-meta.author-date').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/February/ig, "Febrero"));
   }
 });
 $('.post-meta.author-date').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/March/ig, "Marzo"));
   }
 });
 $('.post-meta.author-date').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/April/ig, "Abril"));
   }
 });
 $('.post-meta.author-date').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/May/ig, "Mayo"));
   }
 });
 $('.post-meta.author-date').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/June/ig, "Junio"));
   }
 });
 $('.post-meta.author-date').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/July/ig, "Julio"));
   }
 });
 $('.post-meta.author-date').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/August/ig, "Agosto"));
   }
 });
 $('.post-meta.author-date').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/September/ig, "Septiembre"));
   }
 });
 $('.post-meta.author-date').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/October/ig, "Octubre"));
   }
 });
 $('.post-meta.author-date').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/November/ig, "Noviembre"));
   }
 });
 $('.post-meta.author-date').each(function(i, el) {
   if($(el).html() != "" ) {
     $(el).html($(el).html().replace(/December/ig, "Diciembre"));
   }
 });

 $('.icon-comments').attr('title', 'Comentarios');

 $('.icon-share').attr('title', 'Compartir');

 $('.search-input.hover-effect').attr('placeholder', 'Buscar');

});
</script>




Link to comment

Thank you. Been busy so had no time to reply.

Not being a programmer, I don’t know why this is better, since the Last Name First Name were corrected with your first solution, HOWEVER. this appears to be attacking the second area where I need to change the un-changeable, and that’s on a BLOG page where the publish date appears.

I tried using your first solution, and instead of using “caption” I used “published” and invented sqsdate and mydate instead of names. I used 0,1,2. It works on the first date only. Problem is in French I need to change May 1 2014 to “le 1 mai 2014” Does new code fix?

This is how the entry for the 2nd date looks like after I tried modifying your first code from the Last/FirstName:


sqsDate1 = document.getElementsByClassName("published")[1].innerHTML;
   myDate1 = sqsDate1.replace("August 7, 2014", "le 7 aout, 2014");
   document.getElementsByClassName("published")[1].innerHTML = myDate1;

IT WORKED, but only on first entry (the [0])

I thought that I could just keep adding a [1] [2] [3] etc. each time I published.

Does your new code address this? (By now it must be obvious that I am not a programmer!)

Thanks

Link to comment
  • 2 months later...

I noticed if i click the “x” to exit the form and then reopen it, that text changes back to English. If I refresh the page and try to open the form it’s back in my language. And if i repeat and click the “x” again to exit the form and then open it again it’s back to English.

So this is a temporary solution, but I don’t see it as a problem since the form is opened once and then it’s filled and sent.

But I would love a permanent solution, so that if you click x to exit the form and then open it again the words wouldn’t change back to original.

Thanks!
Luka

Link to comment

I don’t know if this will help you, because I don’t do the commerce thing.

After I changed the Last Name First Name in the Contact Form, I then realized that I ran into the same problem in a survey form, I needed to translate the Agree/Disagree choices.

Not being a coder, @groundcontact’s answer from August 24 was too complex, so I played with the August 19 answer and changed the LastName/First Name as I had done in my Contact Form, pasting the code to handle the response translations.

By looking for the ClassName in the page source, I then changed it to the class name I had found for the survey, and also changed the numbers in each “paragraph”.Notice that each class name starts in numbering from 0 and then continues on, when you move onto the next class name, you start re-numbering from 0, for example (classes and numbers are bolded):


sqsFirstName = document.getElementsByClassName("caption")[0].innerHTML;[ … ]document.getElementsByClassName("caption")[0].innerHTML = myFirstName; sqsLastName = document.getElementsByClassName("caption")[1].innerHTML;[ … ]document.getElementsByClassName("caption")[1].innerHTML = myLastName; [ We are now targeting a different class, "option",  so the numbering begins from "0" ]sqsRadio = document.getElementsByClassName("option")[0].innerHTML;[ … ]document.getElementsByClassName("option")[0].innerHTML = myRadio;

The result worked like a charm, hope it works for you.

  1. Go to the page where your form is located.
  2. Open the Settings > Advanced tab.
  3. Paste the following code in the Page Header Code Injection area:

<script>
function addLoadEvent(func) {
 var oldonload = window.onload;
 if (typeof window.onload != 'function') {
   window.onload = func;
 } else {
   window.onload = function() {
     if (oldonload) {
       oldonload();
     }
     func();
   }
 }
} 
addLoadEvent(function() {  
 sqsFirstName = document.getElementsByClassName("caption")[0].innerHTML;
 myFirstName = sqsFirstName.replace("First Name", "Prénom");
 document.getElementsByClassName("caption")[0].innerHTML = myFirstName;

 sqsLastName = document.getElementsByClassName("caption")[1].innerHTML;
 myLastName = sqsLastName.replace("Last Name", "Nom");
 document.getElementsByClassName("caption")[1].innerHTML = myLastName;

 sqsRadio = document.getElementsByClassName("option")[0].innerHTML;
 myRadio = sqsRadio.replace("Strongly Disagree", "Fortement Désaccord");
 document.getElementsByClassName("option")[0].innerHTML = myRadio;

 sqsRadio = document.getElementsByClassName("option")[1].innerHTML;
 myRadio = sqsRadio.replace("Disagree", "Désaccord");
 document.getElementsByClassName("option")[1].innerHTML = myRadio;

 sqsRadio = document.getElementsByClassName("option")[2].innerHTML;
 myRadio = sqsRadio.replace("Neutral", "Neutre");
 document.getElementsByClassName("option")[2].innerHTML = myRadio;

 sqsRadio = document.getElementsByClassName("option")[3].innerHTML;
 myRadio = sqsRadio.replace("Agree", "d'Accord");
 document.getElementsByClassName("option")[3].innerHTML = myRadio;

 sqsRadio = document.getElementsByClassName("option")[4].innerHTML;
 myRadio = sqsRadio.replace("Strongly Agree", "Fortement d'Accord");
 document.getElementsByClassName("option")[4].innerHTML = myRadio;  
});
</script>

Link to comment

@Cragg, I’ve put the <script> tags back in, formatted the code in your answer and added detail of where to add it. To format code, just highlight the lines of code and use the 5th button in the toolbar:

Use the source

The name is an Anglicised form of the Greek Korvetti — I like to think there’s a little bit of the ancient Hellenic drive in me.

Link to comment
  • 4 months later...

Hello,

Thanks for all this help for the contact form:)

I still find a problem to translate the text that appears when all the fields have not been filled,for example:"Your form has encountered a problem. Please scroll down to review.""Adresse Email is required.""Sujet is required.""Message is required."

If someone has an answer.... :)Thanks a lot:)Stella

Link to comment
  • 1 month later...
  • 2 weeks later...
  • 1 month later...
  • 4 weeks later...
  • 2 weeks later...
  • 4 weeks later...

HiI have been able to get your (Cragg's) script working on my form for first name and second, but now would ideally like to use similar code on my events page.

How do you find out the ClassName of an object? When I inspect the page in chrome I do not see the same class names that you have used for first and last name! 'field first-name' vs 'sqsFirstName'. I'm probably looking at the wrong thing!

Specifcally on my events page I would like to change the displayed date as well as the linked text to 'view event' and 'map'.

Thanks :)

Link to comment
  • 1 month later...
  • 1 month later...

Archived

This topic is now archived and is closed to further replies.

Guest
This topic is now closed to further replies.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.