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

    Embedding Jotform on Wordpress.com site always results in a hyperlink instead of an embedded form

    Asked by FairbanksArts on December 29, 2015 at 02:16 AM

    Hello, I have created a jotform and tried embedding it on my Wordpress.com site based on the instructions provided by Jotform. When I try to embed my form it only shows the link after publishing my page and not the form itself. I have looked from other devices and it still only shows the link. 

     

    I have looked at the forum on this issue and seen that others have experienced the same problem although I was not able to troubleshoot the problem based on the answers provided. 

     

    Thank you very much.

    Screenshot
  • Profile Image
    JotForm Support

    Answered by BJoanna on December 29, 2015 at 06:30 AM

    Inside of this guide find out how to Embed Form to Wordpress.com:

    http://www.jotform.com/help/299-How-to-Embed-Form-to-Wordpress-com 

    And inside of this guide you can find how to add form to Wordpress.org version:

    http://www.jotform.com/help/4-Adding-Forms-to-Wordpress-org-version 

    If this dose not help you can try to embed your form with iFrame code. Inside of this guide you can find out how to get iFrame code of your form: http://www.jotform.com/help/148-Getting-the-Form-iFrame-Code 

    You can also check this guide: http://www.jotform.com/help/324-A-Guide-To-Forms-For-WordPress-JotForm-Users

    Hope this will help. Let us know if you need further assistance. 

  • Profile Image

    Answered by FairbanksArts on December 29, 2015 at 01:10 PM

    Hello, I have tried each one of the things you suggested and they all yield the same result that only the link shows up on the form, I would appreciate further guidance on this.

  • Profile Image
    JotForm Support

    Answered by BJoanna on December 29, 2015 at 01:36 PM

    When you were embedding your form to WordPress have you probably paste Jotform URL to Visual Tab. You need to add URL of your form to Text tab. 

    Hope this will help. Let us know if you need further assistance. 

  • Profile Image

    Answered by FairbanksArts on December 29, 2015 at 01:38 PM

    Every single time I attempted pasting the jotform links I was in the HTML tab and not in the visual tab.

  • Profile Image

    Answered by FairbanksArts on December 29, 2015 at 02:02 PM

    I would appreciate any help I can get in getting this functional today.

     

    Thanks very much!

  • Profile Image
    JotForm Support

    Answered by BJoanna on December 29, 2015 at 02:11 PM

    I do not have WordPress.com to test this, but I have tried on my WordPress.org  account and I was not able to replicate mentioned issue. I have embedded my form with Script code and form is shown on my test page.

    Here is my test page http://authenticity-zest-532.qsandbox.com/?page_id=31 Code is 000.

    You can also try to add your code between embed tags.

    [embed]https://www.jotform.us/form/53615473491156?[/embed]

     

    If this does not help, please try again with iFrame code and leave iFrame code, so that we can inspect you website. 

    http://www.jotform.com/help/148-Getting-the-Form-iFrame-Code

  • Profile Image

    Answered by FairbanksArts on December 29, 2015 at 02:18 PM

    I already tried using the embed tags before contacting support. I have left the iframe code up (and public, so please help with this quickly) for you to inspect. 

    http://fairbanksarts.org/membership/

  • Profile Image
    JotForm Support

    Answered by david on December 29, 2015 at 03:17 PM

    When I checked your embed code, it looks like you were trying to not only add a link to the form, but then also add the iframe code:

    <a target="_blank" href="https://form.jotform.com/53615473491156" rel="nofollow">https://form.jotform.com/53615473491156</a>  window.handleIFrameMessage = function(e) { var args = e.data.split(&#8220;:&#8221;); var iframe = document.getElementById(&#8220;JotFormIFrame&#8221;); if (!iframe) return; switch (args[0]) { case &#8220;scrollIntoView&#8221;: iframe.scrollIntoView(); break; case &#8220;setHeight&#8221;: iframe.style.height = args[1] + &#8220;px&#8221;; break; case &#8220;collapseErrorPage&#8221;: if (iframe.clientHeight &gt; window.innerHeight) { iframe.style.height = window.innerHeight + &#8220;px&#8221;; } break; case &#8220;reloadPage&#8221;: window.location.reload(); break; } var isJotForm = (e.origin.indexOf(&#8220;jotform&#8221;) &gt; -1) ? true : false; if(isJotForm &amp;&amp; &#8220;contentWindow&#8221; in iframe &amp;&amp; &#8220;postMessage&#8221; in iframe.contentWindow) { var urls = {&#8220;docurl&#8221;:encodeURIComponent(document.URL),&#8221;referrer&#8221;:encodeURIComponent(document.referrer)}; iframe.contentWindow.postMessage(JSON.stringify({&#8220;type&#8221;:&#8221;urls&#8221;,&#8221;value&#8221;:urls}), &#8220;*&#8221;); } }; if (window.addEventListener) { window.addEventListener(&#8220;message&#8221;, handleIFrameMessage, false); } else if (window.attachEvent) { window.attachEvent(&#8220;onmessage&#8221;, handleIFrameMessage); } if(window.location.href &amp;&amp; window.location.href.indexOf(&#8220;?&#8221;) &gt; -1) { var ifr = document.getElementById(&#8220;JotFormIFrame&#8221;); var get = window.location.href.substr(window.location.href.indexOf(&#8220;?&#8221;) + 1); if(ifr &amp;&amp; get.length &gt; 0) { var src = ifr.src; src = src.indexOf(&#8220;?&#8221;) &gt; -1 ? src + &#8220;&amp;&#8221; + get : src + &#8220;?&#8221; + get; ifr.src = src; } }

    The iframe portion of the code also looks to be missing some pieces.

    Remove all the code already added and replace it with the following:

    <iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotform.com/53615473491156" frameborder="0" style="width:100%; height:539px; border:none;" scrolling="no"> </iframe> <script type="text/javascript"> window.handleIFrameMessage = function(e) { var args = e.data.split(":"); var iframe = document.getElementById("JotFormIFrame"); if (!iframe) return; switch (args[0]) { case "scrollIntoView": iframe.scrollIntoView(); break; case "setHeight": iframe.style.height = args[1] + "px"; break; case "collapseErrorPage": if (iframe.clientHeight > window.innerHeight) { iframe.style.height = window.innerHeight + "px"; } break; case "reloadPage": window.location.reload(); break; } var isJotForm = (e.origin.indexOf("jotform") > -1) ? true : false; if(isJotForm && "contentWindow" in iframe && "postMessage" in iframe.contentWindow) { var urls = {"docurl":encodeURIComponent(document.URL),"referrer":encodeURIComponent(document.referrer)}; iframe.contentWindow.postMessage(JSON.stringify({"type":"urls","value":urls}), "*"); } }; if (window.addEventListener) { window.addEventListener("message", handleIFrameMessage, false); } else if (window.attachEvent) { window.attachEvent("onmessage", handleIFrameMessage); } if(window.location.href && window.location.href.indexOf("?") > -1) { var ifr = document.getElementById("JotFormIFrame"); var get = window.location.href.substr(window.location.href.indexOf("?") + 1); if(ifr && get.length > 0) { var src = ifr.src; src = src.indexOf("?") > -1 ? src + "&" + get : src + "?" + get; ifr.src = src; } } </script>

    That should be the proper iframe code.

  • Profile Image

    Answered by FairbanksArts on December 29, 2015 at 03:27 PM

    Hi David,

     

    Thanks for the response. I've copied and pasted the iframe code exactly as you presented it and it is still not working.  http://fairbanksarts.org/membership/

     

    I only used the iframe code per BJoanna's suggestion. It would be optimal if I could just get the embed code for Wordpress.com to work but every time I have tried it only shows the url link to the form and not to the form itself. 

  • Profile Image
    JotForm Support

    Answered by david on December 29, 2015 at 03:36 PM

    It looks to still be adding the code as a link.  Try the iframe code without the script portion:

    <iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotform.com/53615473491156" frameborder="0" style="width:100%; height:539px; border:none;" scrolling="no"> </iframe>

    If that does not work, would you mind sharing a screenshot of where you are pasting the code?

    http://www.jotform.com/answers/414264-How-to-include-screenshot-image-in-the-support-forum

     

  • Profile Image

    Answered by FairbanksArts on December 29, 2015 at 03:39 PM

    Here is a screenshot of when I pasted the iframe code you sent.

  • Profile Image

    Answered by FairbanksArts on December 29, 2015 at 03:43 PM

    Here are two screenshots showing that I posted the code you just gave me and the resulting updated page just showing the link.

  • Profile Image
    JotForm Support

    Answered by david on December 29, 2015 at 03:52 PM

    It looks like you are pasting the text directly into the body of your page.  Are you using the "Add Page" feature or adding it as a blog post?  Try embedding the form in the same manner as this video:

    https://vimeo.com/145082999

    It may interpreting the code you are adding as link in the post, rather than adding it as code.

  • Profile Image

    Answered by FairbanksArts on December 29, 2015 at 03:59 PM

    I watched this video and followed the instructions before I ever contacted support, but I just went through the steps once more following exactly and here are the screenshots. I appreciate your continued guidance as I would really like to get this operational today.

  • Profile Image
    JotForm Support

    Answered by david on December 29, 2015 at 04:26 PM

    Quite odd, can you try the oEmbed plugin?

    https://wordpress.org/plugins/jotform-oembed/

    That should allow you to embed the form with just the link.

    If you are using a self-hosted Wordpress website then you need to check this guide on How to Add Forms in Wordpress.

    If neither of those work, let us know and we will see what else we can do.

  • Profile Image

    Answered by FairbanksArts on December 29, 2015 at 04:28 PM

    Hi David, that will not work for me since I have wordpress.com and not wordpress.org. No plugins for .com users.

  • Profile Image
    JotForm Support

    Answered by david on December 29, 2015 at 04:40 PM

    I am able to reproduce the issue on my end and I am looking for a solution.  I will update you as soon as I get it figured out.

  • Profile Image

    Answered by FairbanksArts on December 29, 2015 at 05:01 PM

    Thanks very much and I look forward to hearing back from you.

  • Profile Image
    JotForm Support

    Answered by david on December 29, 2015 at 05:23 PM

    I am also unable to embed a form without it being changed to a link:

    I tried the iFrame code, script embed, using embed tags and the direct link, everything was converted to a hyperlink instead of embedding the form.

    I will forward this to our developers to see if they may be able to provide some insight.  You may also want to to contact Wordpress support as it seems our previous methods may not be working as expected.

  • Profile Image

    Answered by FairbanksArts on December 29, 2015 at 05:27 PM

    Thanks very much for the response and passing the issue along- it appears from the forums that many users have experienced this same problem. Jotform is a great resource, so I look forward to using it. I have already contacted WP support and will look forward to hearing from them as well. If they provide any insight, I will post it here.

     

    Thanks again and I look forward to hearing from you.

  • Profile Image

    Answered by FairbanksArts on December 29, 2015 at 06:30 PM

    This is something that I found on the Wordpress.com support page here: https://en.support.wordpress.com/code/

    If you are familiar with HTML, you’ll notice that codes such as embed, frame, iframe, form, input, object, textarea and others are missing from the above list. Those codes are not allowed on WordPress.com for security reasons.

     

    This seems like it would make it difficult for jotform to be integrated with wordpress.com sites, yet some people are able to use them?

  • Profile Image
    JotForm Support

    Answered by EltonCris on December 30, 2015 at 12:15 AM

    Thanks for your reply. Yes, we are aware of that restrictions on wordpress.com since then. We do not recommend using embed codes or iframes on wordpress.com since it is not possible. The only embed code that should work is the wordpress.com embed code wrapped with [embed] shortcode. However, I can conclude that this is not working as of the moment. I think it has something to do with the updates since this was working on my old form here https://jotformtest.wordpress.com/contact-us-3/.

    Unfortunately, there are no updates about this issue as of the moment but rest assured, you will be informed here once this is fixed. 

    Thank you for your patience and cooperation with this.

  • Profile Image
    JotForm Developer

    Answered by ceren on January 06, 2016 at 08:39 AM

    Hello,

    We're sorry for the inconveniences. WordPress.com embed code is fixed now. Please re-embed your form to your website.

    If you have any other questions please let us know.