{"id":2888,"date":"2021-06-23T06:56:52","date_gmt":"2021-06-23T06:56:52","guid":{"rendered":"https:\/\/elementor.com\/academy\/?p=2888"},"modified":"2023-02-21T10:54:44","modified_gmt":"2023-02-21T10:54:44","slug":"how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro","status":"publish","type":"post","link":"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/","title":{"rendered":"How to Create an Inline Contact Form"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"2888\" class=\"elementor elementor-2888\" data-elementor-post-type=\"post\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-48ab9565 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"48ab9565\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-66d10f5b\" data-id=\"66d10f5b\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-13fa5473 elementor-widget elementor-widget-video\" data-id=\"13fa5473\" data-element_type=\"widget\" data-settings=\"{&quot;youtube_url&quot;:&quot;https:\\\/\\\/www.youtube.com\\\/watch?v=Yqkxq9i7r9w&quot;,&quot;video_type&quot;:&quot;youtube&quot;,&quot;controls&quot;:&quot;yes&quot;}\" data-widget_type=\"video.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-wrapper elementor-open-inline\">\n\t\t\t<div class=\"elementor-video\"><\/div>\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-9757202 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"9757202\" data-element_type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-44640f48\" data-id=\"44640f48\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-2535994 elementor-tabs-view-horizontal elementor-widget elementor-widget-tabs\" data-id=\"2535994\" data-element_type=\"widget\" data-widget_type=\"tabs.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-tabs\">\n\t\t\t<div class=\"elementor-tabs-wrapper\" role=\"tablist\" >\n\t\t\t\t\t\t\t\t\t<div id=\"elementor-tab-title-3901\" class=\"elementor-tab-title elementor-tab-desktop-title\" aria-selected=\"true\" data-tab=\"1\" role=\"tab\" tabindex=\"0\" aria-controls=\"elementor-tab-content-3901\" aria-expanded=\"false\">Overview<\/div>\n\t\t\t\t\t\t\t\t\t<div id=\"elementor-tab-title-3902\" class=\"elementor-tab-title elementor-tab-desktop-title\" aria-selected=\"false\" data-tab=\"2\" role=\"tab\" tabindex=\"-1\" aria-controls=\"elementor-tab-content-3902\" aria-expanded=\"false\">Transcript<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t\t<div class=\"elementor-tabs-content-wrapper\" role=\"tablist\" aria-orientation=\"vertical\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-tab-title elementor-tab-mobile-title\" aria-selected=\"true\" data-tab=\"1\" role=\"tab\" tabindex=\"0\" aria-controls=\"elementor-tab-content-3901\" aria-expanded=\"false\">Overview<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-3901\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"1\" role=\"tabpanel\" aria-labelledby=\"elementor-tab-title-3901\" tabindex=\"0\" hidden=\"false\"><p>In this tutorial we show you how easy it is to create an inline form in WordPress using Elementor Page Builder Pro.<\/p><\/div>\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-tab-title elementor-tab-mobile-title\" aria-selected=\"false\" data-tab=\"2\" role=\"tab\" tabindex=\"-1\" aria-controls=\"elementor-tab-content-3902\" aria-expanded=\"false\">Transcript<\/div>\n\t\t\t\t\t<div id=\"elementor-tab-content-3902\" class=\"elementor-tab-content elementor-clearfix\" data-tab=\"2\" role=\"tabpanel\" aria-labelledby=\"elementor-tab-title-3902\" tabindex=\"0\" hidden=\"hidden\"><p>hi and welcome to elementals how to face<br \/>question comes from tank yes how do you<br \/>create an inline form in Elementor in<br \/>elemental is very easy to create inline<br \/>forms without the need to you CSS code<br \/>now if we look inside the form widget<br \/>this is how we see the form now in order<br \/>to make it an inline form let&#8217;s click on<br \/>the widget now once we are in the widget<br \/>we have the option to make the form an<br \/>inline form by going to the column width<br \/>in field and setting it to 25% now you<br \/>can set the second field to 25% and<br \/>third field to 25% let&#8217;s go to submit<br \/>button and also set it to 25% now as you<br \/>can see it&#8217;s not so straight so let&#8217;s go<br \/>and click on form fields let&#8217;s go to<br \/>labels and click on hide so now we have<br \/>an inline form now if you wish to change<br \/>the gaps between the fields you can go<br \/>to style and set the column gap to be<br \/>bigger or smaller I hope you enjoyed our<br \/>video the more videos and tutorials<br \/>please subscribe to our youtube channel<br \/><br \/><\/p><\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Overview Transcript Overview In this tutorial we show you how easy it is to create an inline form in WordPress using Elementor Page Builder Pro. Transcript hi and welcome to elementals how to face question comes from tank yes how do you create an inline form in Elementor in elemental is very easy to create [&hellip;]<\/p>\n","protected":false},"author":8,"featured_media":4100,"comment_status":"closed","ping_status":"open","sticky":false,"template":"elementor_theme","format":"standard","meta":{"footnotes":""},"categories":[6],"tags":[41],"class_list":["post-2888","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-forms","tag-guides-tutorials"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>How to Create an Inline Contact Form - Academy<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Create an Inline Contact Form - Academy\" \/>\n<meta property=\"og:description\" content=\"Overview Transcript Overview In this tutorial we show you how easy it is to create an inline form in WordPress using Elementor Page Builder Pro. Transcript hi and welcome to elementals how to face question comes from tank yes how do you create an inline form in Elementor in elemental is very easy to create [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/\" \/>\n<meta property=\"og:site_name\" content=\"Academy\" \/>\n<meta property=\"article:published_time\" content=\"2021-06-23T06:56:52+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-02-21T10:54:44+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Inline-Contact-Form-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1920\" \/>\n\t<meta property=\"og:image:height\" content=\"1080\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Hodaya\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Hodaya\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Create an Inline Contact Form - Academy","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/","og_locale":"en_US","og_type":"article","og_title":"How to Create an Inline Contact Form - Academy","og_description":"Overview Transcript Overview In this tutorial we show you how easy it is to create an inline form in WordPress using Elementor Page Builder Pro. Transcript hi and welcome to elementals how to face question comes from tank yes how do you create an inline form in Elementor in elemental is very easy to create [&hellip;]","og_url":"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/","og_site_name":"Academy","article_published_time":"2021-06-23T06:56:52+00:00","article_modified_time":"2023-02-21T10:54:44+00:00","og_image":[{"width":1920,"height":1080,"url":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Inline-Contact-Form-1.jpg","type":"image\/jpeg"}],"author":"Hodaya","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Hodaya","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/#article","isPartOf":{"@id":"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/"},"author":{"name":"Hodaya","@id":"https:\/\/elementor.com\/academy\/#\/schema\/person\/ff9f2661f3df53ae5842a9ad15853d1c"},"headline":"How to Create an Inline Contact Form","datePublished":"2021-06-23T06:56:52+00:00","dateModified":"2023-02-21T10:54:44+00:00","mainEntityOfPage":{"@id":"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/"},"wordCount":242,"publisher":{"@id":"https:\/\/elementor.com\/academy\/#organization"},"image":{"@id":"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Inline-Contact-Form-1.jpg","keywords":["Guides and Tutorials"],"articleSection":["Forms"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/","url":"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/","name":"How to Create an Inline Contact Form - Academy","isPartOf":{"@id":"https:\/\/elementor.com\/academy\/#website"},"primaryImageOfPage":{"@id":"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/#primaryimage"},"image":{"@id":"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Inline-Contact-Form-1.jpg","datePublished":"2021-06-23T06:56:52+00:00","dateModified":"2023-02-21T10:54:44+00:00","breadcrumb":{"@id":"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/#primaryimage","url":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Inline-Contact-Form-1.jpg","contentUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Inline-Contact-Form-1.jpg","width":1920,"height":1080},{"@type":"BreadcrumbList","@id":"https:\/\/elementor.com\/academy\/how-to-create-an-inline-contact-form-in-wordpress-using-elementor-pro\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Elementor","item":"https:\/\/elementor.com\/"},{"@type":"ListItem","position":2,"name":"Academy","item":"https:\/\/elementor.com\/academy\/"},{"@type":"ListItem","position":3,"name":"Forms","item":"https:\/\/elementor.com\/academy\/forms\/"},{"@type":"ListItem","position":4,"name":"How to Create an Inline Contact Form"}]},{"@type":"WebSite","@id":"https:\/\/elementor.com\/academy\/#website","url":"https:\/\/elementor.com\/academy\/","name":"Elementor Academy","description":"Page Builder for WordPress","publisher":{"@id":"https:\/\/elementor.com\/academy\/#organization"},"alternateName":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/02\/Elementor-Logo.png","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/elementor.com\/academy\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/elementor.com\/academy\/#organization","name":"Elementor Academy","alternateName":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/02\/Elementor-Logo.png","url":"https:\/\/elementor.com\/academy\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/academy\/#\/schema\/logo\/image\/","url":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/11\/e-logo.svg","contentUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2022\/11\/e-logo.svg","width":490,"height":85,"caption":"Elementor Academy"},"image":{"@id":"https:\/\/elementor.com\/academy\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/elementor.com\/academy\/#\/schema\/person\/ff9f2661f3df53ae5842a9ad15853d1c","name":"Hodaya","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/academy\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/324f2d5cff44331b747d766f10e31793b1e29ad4f98f129d409760191f88ccc5?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/324f2d5cff44331b747d766f10e31793b1e29ad4f98f129d409760191f88ccc5?s=96&d=mm&r=g","caption":"Hodaya"},"url":"https:\/\/elementor.com\/academy\/author\/hodaya\/"}]}},"_links":{"self":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts\/2888","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/comments?post=2888"}],"version-history":[{"count":1,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts\/2888\/revisions"}],"predecessor-version":[{"id":9407,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts\/2888\/revisions\/9407"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/media\/4100"}],"wp:attachment":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/media?parent=2888"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/categories?post=2888"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/tags?post=2888"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}