{"id":101831,"date":"2020-04-07T12:46:07","date_gmt":"2020-04-07T17:46:07","guid":{"rendered":"https:\/\/wpengine.com\/?post_type=resource&#038;p=101831"},"modified":"2022-02-02T14:03:59","modified_gmt":"2022-02-02T20:03:59","slug":"typeform-integration-wordpress","status":"publish","type":"resource","link":"https:\/\/wpengine.com\/case-studies\/resources\/typeform-integration-wordpress\/","title":{"rendered":"How to Embed TypeForms in WordPress"},"content":{"rendered":"\n<p>Most WordPress websites need at least one kind of form. Whether it\u2019s to support a survey, quiz, feedback submission, contact page, or contest, form creation is an integral aspect of site building.&nbsp;<\/p>\n\n\n\n<p>If you don\u2019t know how to add a form to your WordPress site, don\u2019t worry. Typeform is a piece of software that specializes in helping you build forms stylishly. No matter what you need to create, <a href=\"https:\/\/www.typeform.com\/\">Typeform<\/a> can get you there.&nbsp;<\/p>\n\n\n\n<p>In this article, we\u2019ll first discuss why you may want to use Typeform. Then we\u2019ll go over how you can install the plugin and use it to create new content. Let\u2019s dive right in!<\/p>\n\n\n\n\n\n<h2 class=\"wp-block-heading\">Why Use <a href=\"https:\/\/www.typeform.com\/\">Typeform<\/a>?<\/h2>\n\n\n\n<p>Do you want to create an easier way for clients to submit payments? Or would you like to build a personality quiz, or a contact form so users can leave feedback? Either way, <a href=\"https:\/\/www.typeform.com\/\">Typeform<\/a> may be the solution you need:<\/p>\n\n\n\n<p>As a WordPress website owner, you probably want to know more about the people who visit your pages. Through Typeform, you can encourage greater user engagement, and glean valuable data that lets you better optimize your website and its content.<\/p>\n\n\n\n<p>Let\u2019s take a closer look at some of the reasons your WordPress site might benefit from Typeform:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>A persona survey could encourage <a href=\"https:\/\/www.typeform.com\/blog\/guides\/lead-generation\/build-funnel-from-the-bottom\/\">lead generation<\/a>, by enabling you to better understand your audience or customers.<\/li><li>Having a \u2018get in touch\u2019 contact form can nurture stronger relationships with visitors and customers.<\/li><li>You can offer entertainment through quizzes and the like, improving engagement.<\/li><\/ul>\n\n\n\n<p>Of course, poorly-designed forms won\u2019t do your website any good. That\u2019s why you need the right kind of tool, one that provides the flexibility and features you\u2019ll require to create conversational WordPress forms.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">The Typeform WordPress Plugin<\/h2>\n\n\n\n<p>So, why opt for the Typeform plugin in particular? While there are many excellent solutions for creating forms in WordPress, this specific plugin does have some advantages.<\/p>\n\n\n\n<p>Chiefly, it enables you to create more \u2018conversational\u2019 forms. These are interactive and guide the user through a series of steps, rather than simply providing a bunch of forms on a single page. The experience is not unlike <a href=\"https:\/\/wpengine.com\/resources\/build-wordpress-chatbot\/\">using a chatbot<\/a>, and can be clearer and more engaging for visitors.<\/p>\n\n\n\n<p>Fortunately, this feature doesn\u2019t come at the expense of simplicity. In fact, the Typeform plugin makes embedding forms on your site an intuitive process. Next up, we\u2019ll take a look at how that process works.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">How to Install the Typeform WordPress Plugin<\/h3>\n\n\n\n<p>Your first step will be to <a href=\"https:\/\/wordpress.org\/plugins\/typeform\/\">download the plugin<\/a> from <em>WordPress.org<\/em> or the developer\u2019s website. This will provide you with a <em>.zip<\/em> file, which you can upload by going to <em>Plugins > Add New<\/em> in your WordPress dashboard. Then, select the <em>Upload Plugin<\/em> button.<\/p>\n\n\n\n<p>After installing and activating the plugin, visit any post or page (and make sure you\u2019re <a href=\"https:\/\/wpengine.com\/resources\/wordpress-gutenberg-editor\/\">using the Block Editor<\/a>). A new <em>Add Typeform <\/em>option will appear when you click on a block in the editor.<\/p>\n\n\n\n<p>In the next section, we\u2019ll see how you can use this option to add forms to your website.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Add an Existing Typeform to WordPress<\/h3>\n\n\n\n<p>If you\u2019ve already created a form via Typeform (for example, through the developer\u2019s website), you may simply want to embed it on your WordPress site. To do so, follow these three steps.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Step 1: Log In<\/h4>\n\n\n\n<p>First, click on the <em>Typeform<\/em> button while editing a post or page. You\u2019ll be prompted to log in to your Typeform account.<\/p>\n\n\n\n<p>This will result in a login popup appearing. Your next step will be to select your form.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Step 2: Choose Your Form<\/h4>\n\n\n\n<p>Once you\u2019re logged in, you&#8217;ll see which forms are available to embed. These are accessible via a drop-down menu next to <em>My Typeforms<\/em>.&nbsp;<\/p>\n\n\n\n<p>You\u2019ll have the option to sort through whatever forms you\u2019ve created. After selecting one, you can pick a delivery method.&nbsp;<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Step 3: Decide Between Standard and Popup Delivery<\/h4>\n\n\n\n<p>You can choose for your form to be standard, which will load it directly onto the page. Or you can set it to be a popup that users will need to click on. Either option can be a great choice, and the best one for you will depend on the type of form you\u2019re creating.<\/p>\n\n\n\n<p>After making this final selection, you\u2019re all set! All that\u2019s left for you to do is to publish the post or page. Then, your new form will be available to visitors on the front end of your website.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Create a New Typeform Contact Form<\/h3>\n\n\n\n<p>Of course, you may also want to create a new form from scratch. Whether that\u2019s because an existing Typeform doesn\u2019t fulfil your needs, or because you haven\u2019t created one yet, getting started is a quick and painless process.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Step 1: Switch the Plugin\u2019s Mode<\/h4>\n\n\n\n<p>First, you\u2019ll need to visit the Typeform plugin menu in your dashboard. Then select <em>View Typeform<\/em> in the top right-hand corner of the plugin\u2019s interface.<\/p>\n\n\n\n<p>Doing so will switch the plugin\u2019s mode, and enable you to start building a new form.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Step 2: Start the Form Creation Process<\/h4>\n\n\n\n<p>Next, click on the <em>Start <\/em>button to answer one of Typeform\u2019s example questions.<\/p>\n\n\n\n<p>It\u2019s a quick step, and then you can start building your form by selecting<em> Create a typeform. <\/em>This will take you through a short questionnaire that will lead you to your Typeform workspace.<\/p>\n\n\n\n<p>Once you\u2019ve gone through Typeform\u2019s questions, you\u2019re ready to get to work.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Step 3: Select Your New Typeform and Template<\/h4>\n\n\n\n<p>In the workspace, you\u2019ll see the option to create a <em>New typeform<\/em>.<\/p>\n\n\n\n<p>As a free user, you\u2019ll get access to three typeforms. Other options are available only through the plugin\u2019s premium version.<\/p>\n\n\n\n<p>After selecting a typeform, you\u2019ll be taken to <a href=\"https:\/\/www.typeform.com\/templates\/\">the template gallery<\/a>.<\/p>\n\n\n\n<p>You can select a template here to get the ball rolling quickly. Alternatively, you can build a new form from scratch.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Step 4: Create Your Form<\/h4>\n\n\n\n<p>At this point, you\u2019re ready to start building your new form. As an example, let\u2019s scroll down the left-hand menu and check out the contact form template on the <em>Quick-Start<\/em> page.<\/p>\n\n\n\n<p>When you choose a template, Typeform will present a preview of what it will look like. This preview can be edited, enabling you to customize your form\u2019s appearance and functionality.<\/p>\n\n\n\n<p>After that, it\u2019s just a matter of building your <a href=\"https:\/\/wpengine.com\/resources\/best-wordpress-contact-form-plugins\/\">new contact form<\/a> (or whatever type of form you\u2019re looking to create). Once it\u2019s finished, you can publish the form, and follow the steps detailed above for adding an existing Typeform to your WordPress site.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Learn More With WP Engine<\/h2>\n\n\n\n<p>Engaging visitors to your website and helping them get in touch easily can help you build a stronger audience fast. Of course, to keep those visitors happy, you\u2019ll also need to provide them with an excellent site-wide experience.<\/p>\n\n\n\n<p>That\u2019s why at WP Engine, we point the way towards the <a href=\"https:\/\/developer.wordpress.org\/\">best resources<\/a> for website builders and developers alike. What\u2019s more, we help our users create an incredible digital experience for their customers. <a href=\"https:\/\/wpengine.com\/plans\/\">Check out our plans<\/a> to get started today!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Most WordPress websites need at least one kind of form. Whether it\u2019s to support a survey, quiz, feedback submission, contact page, or contest, form creation is an integral aspect of site building.&nbsp; If you don\u2019t know how to add a form to your WordPress site, don\u2019t worry. Typeform is a piece of software that specializes<span class=\"tile__ellipses\">&hellip;<\/span><span class=\"tile__ellipses--animated\"><\/span><\/p>\n","protected":false},"author":177,"featured_media":0,"template":"","resource-topic":[904],"resource-role":[895,896,906,897,903,899],"resource-type":[916],"class_list":["post-101831","resource","type-resource","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.9 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>A Guide to Conversational Typeforms in WordPress | WP Engine\u00ae<\/title>\n<meta name=\"description\" content=\"Make your site conversational with typeform-style forms in WordPress. Learn how to integrate typeform with Wordpress or use a typeform plugin with WP Engine.\" \/>\n<meta name=\"robots\" content=\"noindex, follow\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"A Guide to Conversational Typeforms in WordPress | WP Engine\u00ae\" \/>\n<meta property=\"og:description\" content=\"Make your site conversational with typeform-style forms in WordPress. Learn how to integrate typeform with Wordpress or use a typeform plugin with WP Engine.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/wpengine.com\/case-studies\/resources\/typeform-integration-wordpress\/\" \/>\n<meta property=\"og:site_name\" content=\"WP Engine\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/wpengine\" \/>\n<meta property=\"article:modified_time\" content=\"2022-02-02T20:03:59+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/wpengine.com\/case-studies\/wp-content\/uploads\/2024\/05\/WPE-IMG-Thumbnail-1200x630-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"630\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@wpengine\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/wpengine.com\/case-studies\/resources\/typeform-integration-wordpress\/\",\"url\":\"https:\/\/wpengine.com\/case-studies\/resources\/typeform-integration-wordpress\/\",\"name\":\"A Guide to Conversational Typeforms in WordPress | WP Engine\u00ae\",\"isPartOf\":{\"@id\":\"https:\/\/wpengine.com\/case-studies\/#website\"},\"datePublished\":\"2020-04-07T17:46:07+00:00\",\"dateModified\":\"2022-02-02T20:03:59+00:00\",\"description\":\"Make your site conversational with typeform-style forms in WordPress. Learn how to integrate typeform with Wordpress or use a typeform plugin with WP Engine.\",\"breadcrumb\":{\"@id\":\"https:\/\/wpengine.com\/case-studies\/resources\/typeform-integration-wordpress\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/wpengine.com\/case-studies\/resources\/typeform-integration-wordpress\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/wpengine.com\/case-studies\/resources\/typeform-integration-wordpress\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/wpengine.com\/case-studies\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Resources\",\"item\":\"https:\/\/wpengine.com\/case-studies\/resources\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"How to Embed TypeForms in WordPress\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/wpengine.com\/case-studies\/#website\",\"url\":\"https:\/\/wpengine.com\/case-studies\/\",\"name\":\"WP Engine\",\"description\":\"Managed Hosting for WordPress\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/wpengine.com\/case-studies\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/wpengine.com\/case-studies\/#\/schema\/person\/aba73ed4c15eda43b5fd78844ec31fad\",\"name\":\"Samantha Rodriguez\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/wpengine.com\/case-studies\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/933722cf8761e0c08fbced6085998032df460c5ecfa2481d9cd16f569f3da2c1?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/933722cf8761e0c08fbced6085998032df460c5ecfa2481d9cd16f569f3da2c1?s=96&d=mm&r=g\",\"caption\":\"Samantha Rodriguez\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"A Guide to Conversational Typeforms in WordPress | WP Engine\u00ae","description":"Make your site conversational with typeform-style forms in WordPress. Learn how to integrate typeform with Wordpress or use a typeform plugin with WP Engine.","robots":{"index":"noindex","follow":"follow"},"og_locale":"en_US","og_type":"article","og_title":"A Guide to Conversational Typeforms in WordPress | WP Engine\u00ae","og_description":"Make your site conversational with typeform-style forms in WordPress. Learn how to integrate typeform with Wordpress or use a typeform plugin with WP Engine.","og_url":"https:\/\/wpengine.com\/case-studies\/resources\/typeform-integration-wordpress\/","og_site_name":"WP Engine","article_publisher":"https:\/\/www.facebook.com\/wpengine","article_modified_time":"2022-02-02T20:03:59+00:00","og_image":[{"width":1200,"height":630,"url":"https:\/\/wpengine.com\/case-studies\/wp-content\/uploads\/2024\/05\/WPE-IMG-Thumbnail-1200x630-1.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_site":"@wpengine","twitter_misc":{"Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/wpengine.com\/case-studies\/resources\/typeform-integration-wordpress\/","url":"https:\/\/wpengine.com\/case-studies\/resources\/typeform-integration-wordpress\/","name":"A Guide to Conversational Typeforms in WordPress | WP Engine\u00ae","isPartOf":{"@id":"https:\/\/wpengine.com\/case-studies\/#website"},"datePublished":"2020-04-07T17:46:07+00:00","dateModified":"2022-02-02T20:03:59+00:00","description":"Make your site conversational with typeform-style forms in WordPress. Learn how to integrate typeform with Wordpress or use a typeform plugin with WP Engine.","breadcrumb":{"@id":"https:\/\/wpengine.com\/case-studies\/resources\/typeform-integration-wordpress\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/wpengine.com\/case-studies\/resources\/typeform-integration-wordpress\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/wpengine.com\/case-studies\/resources\/typeform-integration-wordpress\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/wpengine.com\/case-studies\/"},{"@type":"ListItem","position":2,"name":"Resources","item":"https:\/\/wpengine.com\/case-studies\/resources\/"},{"@type":"ListItem","position":3,"name":"How to Embed TypeForms in WordPress"}]},{"@type":"WebSite","@id":"https:\/\/wpengine.com\/case-studies\/#website","url":"https:\/\/wpengine.com\/case-studies\/","name":"WP Engine","description":"Managed Hosting for WordPress","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/wpengine.com\/case-studies\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/wpengine.com\/case-studies\/#\/schema\/person\/aba73ed4c15eda43b5fd78844ec31fad","name":"Samantha Rodriguez","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/wpengine.com\/case-studies\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/933722cf8761e0c08fbced6085998032df460c5ecfa2481d9cd16f569f3da2c1?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/933722cf8761e0c08fbced6085998032df460c5ecfa2481d9cd16f569f3da2c1?s=96&d=mm&r=g","caption":"Samantha Rodriguez"}}]}},"acf":[],"grid_image_url":"https:\/\/wpengine.com\/case-studies\/wp-content\/uploads\/2020\/04\/shutterstock_1382655365.jpg","media-type":{"term_id":916,"name":"Article","slug":"article"},"role":"<strong>Roles:<\/strong> Agency, Developer, Entrepreneur, Freelancer, Marketer, Site Owner","topic":"<strong>Topics:<\/strong> Marketing","_links":{"self":[{"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/resource\/101831","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/resource"}],"about":[{"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/types\/resource"}],"author":[{"embeddable":true,"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/users\/177"}],"wp:attachment":[{"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/media?parent=101831"}],"wp:term":[{"taxonomy":"resource-topic","embeddable":true,"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/resource-topic?post=101831"},{"taxonomy":"resource-role","embeddable":true,"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/resource-role?post=101831"},{"taxonomy":"resource-type","embeddable":true,"href":"https:\/\/wpengine.com\/case-studies\/wp-json\/wp\/v2\/resource-type?post=101831"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}