Character encoding of HTML source code

  • Profile Image
    olivierarthus
    Asked on November 01, 2021 at 01:10 PM

    Hello

    I need to use full HTML source code of my form and run it from my Worpress site. In order to make sure the CSS of my stie does not impact the code generated by Jotform, the Jotform support team asked me to run the HTML code directly from a blank page (at the root of my site). I have done this but it creates an issue with accents.

    1635786552_61801f38bdc7d_

    when I upload the source code into Wodpress editor, it says characters are UTF-8.
    maybe this is wrong?
    I don't know what format Jotform generates and how to fix this?

    Thanks

  • Profile Image
    Basil_A
    Answered on November 01, 2021 at 04:27 PM

    Hi,

    Can you please provide the form in question for us to check the form?

    Can you also provide any plugins that you are using in your WordPress site if any?

    Looking forward to your reply.

  • Profile Image
    olivierarthus
    Answered on November 02, 2021 at 01:07 AM

    sure this is the form: https://eu.jotform.com/build/212574088026355

    No plugin used for this particular page I have posted it directly on a blank page at the root of my site as per this resuest from your team: https://eu.jotform.com/answers/3471047-embedded-html-in-wordpress-sends-different-values-then-jotform-domain-form#24


    thanks

  • Profile Image
    Billy_G
    Answered on November 02, 2021 at 05:20 AM

    Hello,

    I hope you're doing well and thanks for reaching out.

    Can you kindly send us an error of what you're seeing?

    UTF-8 is safe to use within most programming and document language and is by far the most common encoding for the World Wide Web, accounting for over 97% of all web pages so there's no issue in using it.

    We'll be waiting for your response.

  • Profile Image
    olivierarthus
    Answered on November 02, 2021 at 05:57 AM

    Hello

    The error was in my first message, from the screen shot here it is again

    1635846964_61810b34d8d23_

    The text below the box should be like this instead

    1635847012_61810b64b7d40_

    any special character (accents...) will not show properly

    I was not asking if UTF-8 was safe, simplying saying that Worpress recognises the HTML source code generated by Jotform as UTF-8 and I was not sure it was really the case, since it is not working as such

  • Profile Image
    Billy_G
    Answered on November 02, 2021 at 07:51 AM

    Thanks for confirming.

    Upon checking, WordPress may often use the ISO-8859-1 character set which doesn't support some characters. Can you kindly try the solution from this guide?

    We'll be waiting for your response.

  • Profile Image
    olivierarthus
    Answered on November 06, 2021 at 03:23 AM

    Hello

    After fighting with Bluehost support that was telling me it was an issue with the character set of my WP database but that they would not fix it, I decided to hire a developer to do it.
    He did a few things but it only shifted around the issues.
    I finally found this article: https://stackoverflow.com/questions/33808646/accents-in-a-webpage-are-not-working

    So I simply added these line at the top of the HTML source code (generated by Jotform)

    <head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
    </head>


    and it fixed everything.

    To me this means the problem comes from Jotform HTML source code, since modifying it fixes it all.

  • Profile Image
    Sam_G
    Answered on November 06, 2021 at 05:44 AM

    Hello Olivierarthus,

    Thank you for the update.

    The purpose of making changes on form's HTML is to achieve more things on your form than Jotform can, so after modifying you need to embed it to your web domain directly, you can't upload it again on JotForm.


  • Profile Image
    olivierarthus
    Answered on November 06, 2021 at 07:41 AM

    Hello


    I don't think you have understood this thread, there is not intention of uploading the form again into Jotform...
    To make things more clear, this is an important message for your development team:

    • the html code generated by Jotform is not complete, and created for latin character a big problem as they are not recognised by my site (Wordpress)
    • Jotform team told me to solve the issue working on the WP site, which seemed to make sense
    • but in the end the solution should come from the Jotform HTML source code by adding a line to specify the character set used.

    I believe this means a fix is needed as Jorform generates an HTML source code that creates problems, and adding this code fixes it.

    It took me 2 week and some dev costs to find this out.

    Thanks

  • Profile Image
    Patrick_R
    Answered on November 06, 2021 at 08:30 AM

    Hi there,

    Our apologies for the inconvenience. You're absolutely correct, the META tag that you added tells the browser to treat the characters in the document as UTF-8. It is always recommend to add this tag in all your webpages that are multilingual (not just Jotform).

    We provide both form code as well as the full page source code.

    1. If you download the full page source code, you'll see the UTF-8 meta tag already defined in the form file (screenshot attached for your reference).

    2. If you're only downloading the form code, we assume that it is going to be a part of your webpage that would contain other elements too; also, this code is meant to be placed within the BODY tag whereas, META tag goes within the HEAD tag; so technically, we can't include that in this code.

    1636201624_61867498af0a7_

    I hope this information helps. If you have further questions, let us know.

    Thank you!

  • Profile Image
    olivierarthus
    Answered on November 07, 2021 at 02:17 AM

    Hello


    Thank you your answer is perfectly clear, I just wish it had been given to me earlier in this thread... it would have saved me time and effort.
    May I suggest that your team documents better how to use the form source code? This could be useful for others, since both your support team, then Bluehost and then my developer did not identify this issue in the first place (the reason being that when running locally the code all looked fine).

    Also could you explain to me how we can tou theFull page source code on a web site maybe?
    I tried addingthe content into my website but it did not work.

    Thanks


  • Profile Image
    Mike_G
    Answered on November 07, 2021 at 04:46 AM

    I will coordinate with our team that handles our User Guides. I'll inform them about the information you wish to be included in the guide when embedding forms using the Full Source Codes.

    As for your other concern, I'm not quite sure I'm clearly understanding what you would like to happen exactly. It says,

    "Also could you explain to me how we can tou theFull page source code on a web site maybe?

    I tried addingthe content into my website but it did not work."

    We will wait for your response.

  • Profile Image
    olivierarthus
    Answered on November 07, 2021 at 05:11 AM

    thanks
    I was asking for instruction on how to use (sorry for typo) the full source code (HTML + CSS + JS) into my website?
    I know how to post the HTML code, but not really how to do it with JS + CSS folders


    thanks

  • Profile Image
    Collin_S
    Answered on November 07, 2021 at 05:52 AM

    Hi,

    After downloading the full source code you will end up with the HTML file and two folders one names CSS and JS after which you can follow these guides to implement them into the page.

    How to get the full source code:

    https://www.jotform.com/help/104-how-to-get-the-full-source-code-of-your-form/

    How to implement JS and CSS in WordPress:

    https://developer.wordpress.org/themes/basics/including-css-javascript/

    https://rudrastyh.com/wordpress/include-css-and-javascript.html

    Please let us know if this helps or if you require any further assistance.

    Have an amazing day.