Embedding Forms | Embedding forms on a WordPress website - Zoho Forms

Embedding forms on a WordPress website

If you are using WordPress to build your website, you can embed your Zoho Forms form as follows:

Installing Zoho Forms Plugin

        1. In your WordPress site, Navigate to the Plugins tab and then click on Add New Plugin located just below.
        2. Search for Zoho Forms in the search bar and then click on Install Now.
        3. After installing the plugin, click on the Activate button. You can then find Zoho Forms under the Installed Plugins section.

        For WordPress 5.0 and above

          1. In your Zoho Forms account, create a form that suits your requirements.
          2. Make sure that you have installed and activated the Zoho Forms plugin in WordPress as instructed above. 
          3. To add your form to a WordPress page or post, click the + (Block Inserter) icon in the top left corner of your screen. In the search bar, type Zoho Forms and select the block from the search results.
            Add Zoho Forms form to a WordPress page
          4. Once the block is added, the Zoho Forms dialog opens. Under Choose a way to embed your form, select one of the following options and click Next: 

            Choose a way to embed your form
          5. •  Click Access Zoho Forms to choose a form in your Zoho Forms account. 

              1. Select the domain your Zoho account is registered on, and then click Connect. You will be taken to the Zoho sign-in page.

                Choose a Domain

              2. Sign in on the Zoho page, come back to WordPress, and click Refresh to load your forms.



              3. Choose your form from the Choose a form list.

                Choose a form

              4. Use a Permalink to embed your form using its permalink URL, without signing in. After clicking Next, enter your form's permalink URL in the field provided. 


          6. After choosing your form, you can define the width of the form container in px or %. The height adjusts automatically depending on the number of fields in your form. To set a fixed height instead, select Set custom height and enter the height in px.
          7. You can also add parameters to your form's URL to track form submissions or prefill form fields. Click here to learn more about the URL parameters in Zoho Forms.


          8. You can preview your form directly in the WordPress Editor and publish it once the changes are finalized.

          For WordPress 4.9.9 and below

          1. In your Zoho Forms account, create a form that suits your requirements.
          2. Make sure that you have installed and activated the Zoho Forms plugin in WordPress as instructed above.
          3. In your WordPress page editor, click the Zoho Forms icon.

          4. You can either log in to your account and Choose a form or enter your form permalink without logging in to Zoho Forms.
          5. The form width and height can be defined in the editor.
          6. Once done, click Embed to proceed. 

          Embed using Short Code

          Zoho Forms plugins are compatible with both the block editor and the classic editor plugin in WordPress. To embed in third-party editors like Elementor, SeedProd and more, you can make use of shortcode block/widget. 

          1. To add a shortcode block to your Wordpress page, simply click the + (Block Inserter) icon in the top left corner of your screen. In the search bar ,type Shortcode and select the block from the search results.

          2. You can then use the following shortcode format to embed your Zoho Form on your website. 

          [zohoForms src=<Form Permalink URL> width=100% height=600px urlparams="<parameter name>" type=<js/iframe> autoheight=<true/false>]

          For example: 

          Then, the shortcode format would be

          For javascript:

          For URL params:

          Quote[zohoForms src=https://forms.zohopublic.com/zylker/form/ContactUs/formperma/z3bcox1KszUdTSH_z_73b53Rqhas1zWmnyNV14Ih=0  width=100%type=<iframe/js> urlparams="referrername=rebecca&referrersrc=webpage"]
          Note: You can copy the form permalink from the Share tab in your form builder.