How to embed form on Wordpress

  • timsteinlein
    Gefragt am 2. März 2024 um 09:49

    Hallo Jotform Team,


    ich habe eine Form (https://eu.jotform.com/build/240433323504343/publish/embed) aus einer Vorlage gebaut, die ich gerne in meinem Wordpress einbinden möchte.

    Das einbinden klappt, aber die form wird nicht korrekt angezeigt:

    1. in Wordpress hat die form einen schwarzen Rand - wie kann ich den entfernen? in Wordpress gibt es keine Option
    2. die Form wird nur teilweise dargestellt - man muss scrollen. Wie kann ich es einstellen, dass die ganze Form angezeigt wird?

    im Anhang sind 2 screenshots, einmal das original in Jorform und die Ansicht in Wordpress.

    vielen Dank für den Input - wenn das korrekt funktioniert, werde ich mit dem paid abo starten.

    danke und viele Grüße,


    Tim


    Jotform Thread 12492323 Screenshot
  • Elbert_A Jotform Support
    Geantwortet am 2. März 2024 um 11:55

    Hi Tim,

    Thanks for reaching out to Jotform Support. Unfortunately, our German Support agents are busy helping other Jotform users at the moment. I'll try to help you in English using Google Translate, but you can reply in whichever language you feel comfortable using. Or, if you'd rather have support in German, let us know and we can have them do that. But, keep in mind that you'd have to wait until they're available again.

    Now, let me help you with your question. I’m really sorry that this is happening. Could you try embedding the form using the word press code? Let me show you how:

    1. In Form Builder, in the orange navigation bar at the top of the screen, click on Publish.
    2. Click on Embed on the left side of the screen, and select WordPress.
    3. Select Copy Code.

    How to embed form on Wordpress Image 1 Screenshot 20

    Give it a try and let us know if you need any help.

  • timsteinlein
    Geantwortet am 2. März 2024 um 16:15
    Hi, Thanks - I already did that.But only a part of the form is shown (why?)And then, there is a black frame around the form that should not be there.Pls check the screenshots I added earlier for reference.ThanksTimVon meinem iPhone gesendetAm 02.03.2024 um 17:55 schrieb Jotform <noreply@jotform.com>:




    ...
  • Rhina Jotform Support
    Geantwortet am 2. März 2024 um 18:37

    Hi Tim,

    Thanks for getting back to us. Please try embedding your form using the Wordpress plugin. You can check out the guide here on how to add your plugin and embed your form to Wordpress. If the issue still persists, please try embedding the form using the iFrame code instead. Let me show you how:

    • In Form Builder, in the orange navigation bar at the top of the page, click on Publish.
    • In the menu on the left side of the page, click on iFrame.
    • Now, click on the embed option you want to use, and copy the code.

    If the black frame still appears after using iFrame, you can also inject the following css code to your form:

    .form-all {
    box-shadow: none !important;
    }

    Let me show you how:

    1. In Form Builder, click on the Paint Roller icon on the right side of the page to open Form Designer.
    2. In the Form Designer menu, click on the Styles tab, scroll down and paste the code into the Inject CSS Code box.

    Give it a try and let us know how it goes.

  • timsteinlein
    Geantwortet am 3. März 2024 um 16:45

    hi Rhina,

    thanks - that worked !

    I have added the css and used the iframe.

    and I have installed the WP plugin.

    in jotform, there is a shadow around the form which makes it look like it´s hovering above the page which I really like.

    unfortunately, this is gone now.

    how can I make that shadow appear again?

    thanks,

    Tim