What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Can I rewrite "Distance" and "Duration" (chance language) in Driving distance widget?

    Asked by 00anna123 on March 18, 2016 at 02:01 PM

    Hi,

     

    I need rewrite  text Distance and Duration to czech language in Driving distance widget, is it possible? If not, is it possible to remove or hide it? 

     

    Together with this widget I want use widget Form calculation, because I need count price per distance between two town (price taxi drive from A to B). https://form.jotformeu.com/60764493795370

     

    Thank you for your help

    duration distance widget driving distance
  • Profile Image
    JotForm Support

    Answered by Boris on March 18, 2016 at 02:48 PM

    We do not have an option for translating this text directly, but we can achieve it by using a small bit of custom CSS in that widget:

    #ddResult tr:nth-of-type(3) > th { font-size: 0px; }
    #ddResult tr:nth-of-type(3) > th:before { font-size: 11pt; content: "Text for distance"; }
    #ddResult tr:nth-of-type(4) > th { font-size: 0px; }
    #ddResult tr:nth-of-type(4) > th:before { font-size: 11pt; content: "Text for duration"; }

    Where you can change the text marked in red into your desired translation.

    You can add this CSS to the widget by clicking on its wand-shaped icon, switching to its Custom CSS tab, and pasting the code there:

    The form will end up looking like this:

    If you need any further assistance, please let us know.

  • Profile Image

    Answered by 00anna123 on March 21, 2016 at 04:15 AM

    Thank you , this is what I needed. 

    And is it possible "translate" by Custom CSS red button Change too? 

    Thanks again.

  • Profile Image
    JotForm Support

    Answered by Boris on March 21, 2016 at 06:07 AM

    You are most welcome. When it comes to translating the red "Change" button with CSS, I'm afraid that it is not possible - the button is a HTML element called input, and input HTML elements cannot have text added to them through CSS.

    I could manage a workaround by actually hiding the text on the input element, and adding a "translated" text to another element. Then, we can try and position this other element to be on top of the input field, to make it appear that the button is translated. However, I'm not sure how well this workaround would work across all the different browsers and devices that are in use today.

    In case you are interested in this workaround, here is the custom CSS code:

    #buttonChange { font-size: 0px; height: 10pt; }

    #ddResult tr:nth-of-type(5) > td:before {
    font-size: 11pt;
    content: "Promeni";
    position: absolute;
    pointer-events: none;
    color: white;
    margin-top: 2pt;
    margin-left: 50px;
    }

    You can try adding it to your form and testing in the browsers that your intended audience will use, to see if it will work in a satisfactory way for you.

    You can enter your own text in the CSS code for "content", in the place marked in red. You can also position this created text to be correctly centered by adjusting the value for margin-top and margin-left, also marked in red in the above code.

    This is how it appears on my end:

    I hope this helps.

  • Profile Image

    Answered by 00anna123 on March 22, 2016 at 05:50 AM

    Hi again,

    I tried CSS and everything looks OK.

    Well done! Thank you very much.

    Have a nice day!