{"id":3155,"date":"2021-06-23T11:52:33","date_gmt":"2021-06-23T11:52:33","guid":{"rendered":"https:\/\/elementor.com\/academy\/?p=3155"},"modified":"2023-04-23T11:19:25","modified_gmt":"2023-04-23T11:19:25","slug":"getting-started-with-elementor-course","status":"publish","type":"post","link":"https:\/\/elementor.com\/academy\/getting-started-with-elementor-course\/","title":{"rendered":"Build a Landing Page With Elementor Course"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"3155\" class=\"elementor elementor-3155\" data-elementor-post-type=\"post\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-4897af4c elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"4897af4c\" data-element_type=\"section\">\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-6ba6f825\" data-id=\"6ba6f825\" data-element_type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\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-40dbc187 elementor-layout-start e-tabs-view-vertical elementor-widget elementor-widget-video-playlist\" data-id=\"40dbc187\" data-element_type=\"widget\" data-settings=\"{&quot;playlist_title&quot;:&quot;Playlist&quot;,&quot;tabs&quot;:[{&quot;title&quot;:&quot;Getting Started With Elementor: Create a Landing Page Step-by-Step&quot;,&quot;youtube_url&quot;:&quot;https:\\\/\\\/youtu.be\\\/bZPWe0VRj28?list=PLZyp9H25CboEjxaR503MFVlwtiBat9Dq4&quot;,&quot;duration&quot;:&quot;1:37&quot;,&quot;thumbnail&quot;:{&quot;url&quot;:&quot;&quot;,&quot;id&quot;:&quot;&quot;,&quot;size&quot;:&quot;&quot;},&quot;_id&quot;:&quot;08f9296&quot;,&quot;inner_tab_is_content_visible&quot;:&quot;show&quot;,&quot;inner_tab_content_2&quot;:&quot;&lt;p&gt;hi-oh I&#039;m zve a web designer and lead&lt;br \\\/&gt;educator here at elemental today we&#039;ll&lt;br \\\/&gt;create a professional landing page from&lt;br \\\/&gt;start to finish without touching a&lt;br \\\/&gt;single line of code it will be easy to&lt;br \\\/&gt;follow and most importantly we&#039;ll do it&lt;br \\\/&gt;all with elemental this tutorial will&lt;br \\\/&gt;give you a basic breakdown of elemental&lt;br \\\/&gt;and show you how to design build and&lt;br \\\/&gt;publish landing pages for your own&lt;br \\\/&gt;business or customers just like the one&lt;br \\\/&gt;you see here a landing page is a page on&lt;br \\\/&gt;your site visitors arrive on via some&lt;br \\\/&gt;kind of advertising such as a Facebook&lt;br \\\/&gt;ad or Google search the page is designed&lt;br \\\/&gt;with a specific purpose to convert&lt;br \\\/&gt;visitors into leads by taking a specific&lt;br \\\/&gt;action so let&#039;s see how that translates&lt;br \\\/&gt;to our design the visitor will see the&lt;br \\\/&gt;hero section first so here we need to&lt;br \\\/&gt;grab their attention from the get-go&lt;br \\\/&gt;there&#039;s a video running in the&lt;br \\\/&gt;background and a bold title presenting&lt;br \\\/&gt;the product the button is a clear&lt;br \\\/&gt;call-to-action that is set to scroll&lt;br \\\/&gt;down to the second section when visitors&lt;br \\\/&gt;click on it here they see a selection of&lt;br \\\/&gt;flowers with prices and can directly&lt;br \\\/&gt;call the flower shop to inquire and&lt;br \\\/&gt;place an order by clicking on the button&lt;br \\\/&gt;mostly we have a contact as section with&lt;br \\\/&gt;some texts and social icons to find out&lt;br \\\/&gt;more about the flower shop okay great so&lt;br \\\/&gt;now that we know what we&#039;re going to&lt;br \\\/&gt;build let&#039;s jump in and make a start&lt;\\\/p&gt;&quot;,&quot;inner_tab_content_1&quot;:&quot;&lt;p&gt;Welcome to the Elementor Getting Started Course.&lt;br \\\/&gt;In this short video series, you&#039;ll learn the basics of using Elementor.&lt;br \\\/&gt;We will cover all you need to know to streamline your workflow and easily create landing pages using the power of Elementor.&lt;\\\/p&gt;&lt;p&gt;Things you&#039;ll learn in this course:&lt;br \\\/&gt;\\u2713 Overview of Elementor&lt;br \\\/&gt;\\u2713 Building a Landing Page step-by-step&lt;br \\\/&gt;\\u2713 Responsive design with Elementor&lt;br \\\/&gt;\\u2713 Save your work as a template to reuse across your site&lt;br \\\/&gt;\\u2713 Publish your pages&lt;br \\\/&gt;\\u2713 And much more!&lt;\\\/p&gt;&quot;,&quot;type&quot;:&quot;youtube&quot;,&quot;vimeo_url&quot;:null,&quot;is_external_url&quot;:null,&quot;hosted_url&quot;:null,&quot;external_url&quot;:null,&quot;section_html_tag&quot;:null,&quot;video_html_tag&quot;:&quot;h4&quot;},{&quot;title&quot;:&quot;Lesson 2: Start Working With Elementor&quot;,&quot;youtube_url&quot;:&quot;https:\\\/\\\/youtu.be\\\/yS02SxCbC_0?list=PLZyp9H25CboEjxaR503MFVlwtiBat9Dq4&quot;,&quot;duration&quot;:&quot;4:12&quot;,&quot;thumbnail&quot;:{&quot;url&quot;:&quot;&quot;,&quot;id&quot;:&quot;&quot;,&quot;size&quot;:&quot;&quot;},&quot;inner_tab_is_content_visible&quot;:&quot;show&quot;,&quot;inner_tab_content_2&quot;:&quot;&lt;p&gt;to start working with elemental you need&lt;br \\\/&gt;to create your first page so from the&lt;br \\\/&gt;wordpress dashboard and the pages click&lt;br \\\/&gt;add new&lt;br \\\/&gt;and give it an M then click Edit with&lt;br \\\/&gt;elemental to start with a clean page go&lt;br \\\/&gt;to the bottom panel and click the page&lt;br \\\/&gt;Settings icon&lt;br \\\/&gt;and a page layout choose canvas this is&lt;br \\\/&gt;the easiest way to create a full blank&lt;br \\\/&gt;page without a header and a footer&lt;br \\\/&gt;exactly what we need for our landing&lt;br \\\/&gt;page&lt;br \\\/&gt;let&#039;s get familiar with the elemental&lt;br \\\/&gt;interface on the right side is the&lt;br \\\/&gt;editing area of the page this is where&lt;br \\\/&gt;you can add and edit elements that form&lt;br \\\/&gt;the layout of your page on the left side&lt;br \\\/&gt;is the elemental panel here are creative&lt;br \\\/&gt;tools called widgets you use widgets to&lt;br \\\/&gt;add elements to your page like headings&lt;br \\\/&gt;or a text editor images and videos and&lt;br \\\/&gt;much more you can always access this&lt;br \\\/&gt;area by clicking on the widgets icon&lt;br \\\/&gt;here on the top right&lt;br \\\/&gt;on the top left you have a hamburger&lt;br \\\/&gt;menu where you have more options like&lt;br \\\/&gt;setting default colors and fonts which&lt;br \\\/&gt;saves a lot of time when designing your&lt;br \\\/&gt;page I&#039;ve gone ahead and set the&lt;br \\\/&gt;headlines index in text to sindelle with&lt;br \\\/&gt;the weight of 200&lt;br \\\/&gt;the body text asset to Montserrat&lt;br \\\/&gt;with the weight of 300&lt;br \\\/&gt;just don&#039;t forget to apply your changes&lt;br \\\/&gt;back in the hamburger menu you can also&lt;br \\\/&gt;click view page to see your live website&lt;br \\\/&gt;or exit to dashboard to go back to your&lt;br \\\/&gt;WordPress dashboard&lt;br \\\/&gt;at the bottom is another panel with more&lt;br \\\/&gt;key features such as page settings where&lt;br \\\/&gt;you can give the pager name&lt;br \\\/&gt;and choose a page layout like we did&lt;br \\\/&gt;before here is the Navigator which helps&lt;br \\\/&gt;you get a clear and organized view of&lt;br \\\/&gt;your page currently it&#039;s empty because&lt;br \\\/&gt;we haven&#039;t added any content yet we&#039;ll&lt;br \\\/&gt;use it later here we can see our edit&lt;br \\\/&gt;history to view recent changes&lt;br \\\/&gt;and next to it is the responsive menu&lt;br \\\/&gt;for switching between screen modes&lt;br \\\/&gt;we can preview our changes and when&lt;br \\\/&gt;ready to go live simply hit the publish&lt;br \\\/&gt;button&lt;br \\\/&gt;there are others save options as well&lt;br \\\/&gt;which I&#039;ll talk about later okay great&lt;br \\\/&gt;now let&#039;s take a closer look at how&lt;br \\\/&gt;pages are built there are two ways you&lt;br \\\/&gt;can start let&#039;s begin with the library&lt;br \\\/&gt;here you can preview elementals pre-made&lt;br \\\/&gt;blocks and pages as well as your own&lt;br \\\/&gt;templates&lt;br \\\/&gt;and insert them into your page I&#039;ll go&lt;br \\\/&gt;ahead and insert this block so you can&lt;br \\\/&gt;see&lt;br \\\/&gt;elemento uses three main building blocks&lt;br \\\/&gt;sections columns and widgets sections&lt;br \\\/&gt;are the largest and can be identified by&lt;br \\\/&gt;their blue border like you see here&lt;br \\\/&gt;inside them are columns in this case&lt;br \\\/&gt;there&#039;s one you can identify them by the&lt;br \\\/&gt;black dashed border these columns house&lt;br \\\/&gt;widgets such as the texts and batten you&lt;br \\\/&gt;see her you control the section column&lt;br \\\/&gt;and widgets with the handle to edit them&lt;br \\\/&gt;simply right-click the handle where you&lt;br \\\/&gt;can edit duplicate delete and much more&lt;br \\\/&gt;the blue line indicates where it will be&lt;br \\\/&gt;positioned when you let go you can move&lt;br \\\/&gt;them around by simply dragging and&lt;br \\\/&gt;dropping them sections columns and&lt;br \\\/&gt;widgets have three tabs in the panel on&lt;br \\\/&gt;the Left&lt;br \\\/&gt;sections and columns have layout style&lt;br \\\/&gt;and advanced tabs&lt;br \\\/&gt;whereas widgets have content style and&lt;br \\\/&gt;advanced tabs soon we&#039;ll see how these&lt;br \\\/&gt;settings are used to create a landing&lt;br \\\/&gt;page but first I&#039;ll go ahead and delete&lt;br \\\/&gt;this section because we will create our&lt;br \\\/&gt;landing page from scratch&lt;br \\\/&gt;another way to add sections is by&lt;br \\\/&gt;pressing the plus icon over here then&lt;br \\\/&gt;simply choose one of these preset&lt;br \\\/&gt;structures which we can tweak to our&lt;br \\\/&gt;liking on the go so let&#039;s dive in and&lt;br \\\/&gt;start building a landing page&lt;br \\\/&gt;you&lt;\\\/p&gt;&quot;,&quot;inner_tab_content_1&quot;:&quot;&lt;p&gt;Welcome to the Elementor Getting Started Course.&lt;br \\\/&gt;In this short video series, you&#039;ll learn the basics of using Elementor.&lt;br \\\/&gt;We will cover all you need to know to streamline your workflow and easily create landing pages using the power of Elementor.&lt;\\\/p&gt;&lt;p&gt;Things you&#039;ll learn in this course:&lt;br \\\/&gt;\\u2713 Overview of Elementor&lt;br \\\/&gt;\\u2713 Building a Landing Page step-by-step&lt;br \\\/&gt;\\u2713 Responsive design with Elementor&lt;br \\\/&gt;\\u2713 Save your work as a template to reuse across your site&lt;br \\\/&gt;\\u2713 Publish your pages&lt;br \\\/&gt;\\u2713 And much more!&lt;\\\/p&gt;&quot;,&quot;_id&quot;:&quot;b9957f4&quot;,&quot;type&quot;:&quot;youtube&quot;,&quot;vimeo_url&quot;:null,&quot;is_external_url&quot;:null,&quot;hosted_url&quot;:null,&quot;external_url&quot;:null,&quot;section_html_tag&quot;:null,&quot;video_html_tag&quot;:&quot;h4&quot;},{&quot;title&quot;:&quot;Lesson 3: Building Your Landing Page With Elementor&quot;,&quot;youtube_url&quot;:&quot;https:\\\/\\\/youtu.be\\\/fxqIa7QYR-E?list=PLZyp9H25CboEjxaR503MFVlwtiBat9Dq4&quot;,&quot;duration&quot;:&quot;10:35&quot;,&quot;thumbnail&quot;:{&quot;url&quot;:&quot;&quot;,&quot;id&quot;:&quot;&quot;,&quot;size&quot;:&quot;&quot;},&quot;inner_tab_is_content_visible&quot;:&quot;show&quot;,&quot;inner_tab_content_2&quot;:&quot;&lt;p&gt;in the previous lesson we learned how to&lt;br \\\/&gt;get up and running with elemental in&lt;br \\\/&gt;this lesson we&#039;ll start building our&lt;br \\\/&gt;page I&#039;ll add a section with one column&lt;br \\\/&gt;of 100 VH&lt;br \\\/&gt;this way the section will always take up&lt;br \\\/&gt;at least a hundred percent of the&lt;br \\\/&gt;viewports heart no matter the amount of&lt;br \\\/&gt;content in it I&#039;ll set the content width&lt;br \\\/&gt;to 800 pixels over here and in style we&lt;br \\\/&gt;can give our section a background there&lt;br \\\/&gt;are a couple of types you can open the&lt;br \\\/&gt;media library by clicking on the plus&lt;br \\\/&gt;over here as you can see it&#039;s empty we&lt;br \\\/&gt;can drag in an image file as well as&lt;br \\\/&gt;other media I want a video to play in&lt;br \\\/&gt;the background so I&#039;ll go ahead and drag&lt;br \\\/&gt;in a video file and then I&#039;ll copy this&lt;br \\\/&gt;link over here&lt;br \\\/&gt;now close the library and change the&lt;br \\\/&gt;background type to video we can either&lt;br \\\/&gt;add a YouTube or Vimeo link or simply&lt;br \\\/&gt;paste the link to the video file we just&lt;br \\\/&gt;uploaded to a media library&lt;br \\\/&gt;I&#039;ll go ahead and set it to play on&lt;br \\\/&gt;mobile as well&lt;br \\\/&gt;next I&#039;ll give it a classic background&lt;br \\\/&gt;overlay&lt;br \\\/&gt;you can either use the color picker&lt;br \\\/&gt;or piss the color-code over here I&#039;ll go&lt;br \\\/&gt;for this nice purple color if you want&lt;br \\\/&gt;to reuse this color simply click the&lt;br \\\/&gt;plus icon and it will be added to your&lt;br \\\/&gt;color palette automatically next I&#039;ll&lt;br \\\/&gt;set the opacity to zero point seven and&lt;br \\\/&gt;I&#039;ll darken it a bit by using the blend&lt;br \\\/&gt;mode option okay great&lt;br \\\/&gt;next I&#039;ll drag in a text editor widgets&lt;br \\\/&gt;and change the text&lt;br \\\/&gt;in style our line into the center and&lt;br \\\/&gt;change the color to white&lt;br \\\/&gt;in typography the default font family&lt;br \\\/&gt;montserrat we set before is&lt;br \\\/&gt;automatically applied here I&#039;ll change&lt;br \\\/&gt;the size to 15 pixels weight to 200&lt;br \\\/&gt;and set transform to uppercase I also&lt;br \\\/&gt;set the letter spacing to 7 so it&lt;br \\\/&gt;spreads out nicely&lt;br \\\/&gt;then drag in a heading widgets and&lt;br \\\/&gt;change the text&lt;br \\\/&gt;align it to the sensor as well&lt;br \\\/&gt;and InStyle set the color to white&lt;br \\\/&gt;in topography the fun family&#039;s in zoo we&lt;br \\\/&gt;said before as default is automatically&lt;br \\\/&gt;applied here as well I set the size to&lt;br \\\/&gt;70 pixels and transformed to uppercase&lt;br \\\/&gt;next drag in another text editor widgets&lt;br \\\/&gt;and change the text&lt;br \\\/&gt;before align it to the center and change&lt;br \\\/&gt;the color to white&lt;br \\\/&gt;then set the line height to 2 a.m.&lt;br \\\/&gt;in advanced and link the padding values&lt;br \\\/&gt;so you can set them individually and&lt;br \\\/&gt;change the unit to percentage and give a&lt;br \\\/&gt;20% padding to the left and right okay&lt;br \\\/&gt;great&lt;br \\\/&gt;looking good we&#039;re almost done with our&lt;br \\\/&gt;first section time to drag in the baton&lt;br \\\/&gt;widget&lt;br \\\/&gt;I&#039;ll change the text and align to the&lt;br \\\/&gt;center&lt;br \\\/&gt;here I&#039;ll add a link that sets it to&lt;br \\\/&gt;scroll down to the second section on&lt;br \\\/&gt;this page which we need to build first&lt;br \\\/&gt;so I&#039;ll show you how to do that soon&lt;br \\\/&gt;I&#039;ll set its size to large&lt;br \\\/&gt;and in style topography I&#039;ll set the&lt;br \\\/&gt;transform to uppercase&lt;br \\\/&gt;next I&#039;ll give it this dog text color&lt;br \\\/&gt;and change the background color to white&lt;br \\\/&gt;on hover I&#039;ll change the text color to&lt;br \\\/&gt;white&lt;br \\\/&gt;crank color to this pink red&lt;br \\\/&gt;I&#039;ll save this color so I can reuse it&lt;br \\\/&gt;later let&#039;s add a hover animation as&lt;br \\\/&gt;well I&#039;ll set it to flood&lt;br \\\/&gt;lastly I&#039;ll set the border-radius to&lt;br \\\/&gt;zero so the button becomes a rectangle&lt;br \\\/&gt;let&#039;s check out what we have so far I&#039;ll&lt;br \\\/&gt;go ahead and press preview over here as&lt;br \\\/&gt;you can see the page opens in a new tab&lt;br \\\/&gt;cool&lt;br \\\/&gt;okay gret let&#039;s move on to the second&lt;br \\\/&gt;section I&#039;ll add a section with one&lt;br \\\/&gt;column&lt;br \\\/&gt;and give it a minimum height of 100 VH&lt;br \\\/&gt;in style&lt;br \\\/&gt;I&#039;ll give it this dog background-color&lt;br \\\/&gt;and save it as well now in order to&lt;br \\\/&gt;speed up our design process let&#039;s go&lt;br \\\/&gt;back to our first section and copy this&lt;br \\\/&gt;text editor widget&lt;br \\\/&gt;paste it in the column&lt;br \\\/&gt;and change the text&lt;br \\\/&gt;next I&#039;ll do the same for the heading&lt;br \\\/&gt;back in the first section&lt;br \\\/&gt;I&#039;ll copy it&lt;br \\\/&gt;and paste it over here&lt;br \\\/&gt;then change the text&lt;br \\\/&gt;getting the hang of it let&#039;s do it one&lt;br \\\/&gt;last time with the text editor widget&lt;br \\\/&gt;okay let&#039;s move on&lt;br \\\/&gt;this time I&#039;ll drag in an intersection&lt;br \\\/&gt;widget it comes with two columns by&lt;br \\\/&gt;default&lt;br \\\/&gt;a right-click on the column and select&lt;br \\\/&gt;add new column so there&#039;s three in total&lt;br \\\/&gt;dragon imagebox widgets into the first&lt;br \\\/&gt;column I&#039;ll click here to enter the&lt;br \\\/&gt;media library&lt;br \\\/&gt;and simply drag my flower images onto it&lt;br \\\/&gt;to upload them&lt;br \\\/&gt;I&#039;ll choose this image first&lt;br \\\/&gt;next I&#039;ll change the title and&lt;br \\\/&gt;description&lt;br \\\/&gt;and in style our set the spacing to zero&lt;br \\\/&gt;and with to a hundred percent&lt;br \\\/&gt;in the content drop-down align the text&lt;br \\\/&gt;to left&lt;br \\\/&gt;for the title set the spacing to 2&lt;br \\\/&gt;to white&lt;br \\\/&gt;in typography change the font family to&lt;br \\\/&gt;Montserrat&lt;br \\\/&gt;size to 18 pixels and set it to&lt;br \\\/&gt;transform to uppercase as well&lt;br \\\/&gt;for the description set the color to&lt;br \\\/&gt;white&lt;br \\\/&gt;and drag down the opacity of it&lt;br \\\/&gt;set the size to 16 pixels&lt;br \\\/&gt;and give it a weight of 200&lt;br \\\/&gt;now let&#039;s duplicate this widget and drag&lt;br \\\/&gt;it into the other columns&lt;br \\\/&gt;I&#039;ll go ahead and change their images&lt;br \\\/&gt;texts and descriptions&lt;br \\\/&gt;so we end up with three types of flowers&lt;br \\\/&gt;with price tags&lt;br \\\/&gt;okay great now let&#039;s copy this text&lt;br \\\/&gt;editor widget&lt;br \\\/&gt;then paste it under the flowers&lt;br \\\/&gt;and in advanced add 10% padding on the&lt;br \\\/&gt;top to create some space&lt;br \\\/&gt;next copy the button from the first&lt;br \\\/&gt;section&lt;br \\\/&gt;paste it and change the text in the link&lt;br \\\/&gt;field I&#039;ll add a tell scheme like sir&lt;br \\\/&gt;this will trigger a phone call when&lt;br \\\/&gt;clicking on the button in a webpage and&lt;br \\\/&gt;on a mobile phone&lt;br \\\/&gt;back in the section settings&lt;br \\\/&gt;in advanced&lt;br \\\/&gt;I&#039;ll unlink the padding and add 200&lt;br \\\/&gt;pixels to the top and bottom&lt;br \\\/&gt;now it&#039;s time to set the button in the&lt;br \\\/&gt;first section to scroll to this section&lt;br \\\/&gt;I&#039;ll go ahead and type a CSS ID over&lt;br \\\/&gt;here for the section and copy it then&lt;br \\\/&gt;back in the buttons link field in the&lt;br \\\/&gt;first column&lt;br \\\/&gt;paste the ID after the panky&lt;br \\\/&gt;and that&#039;s it now when your visitors&lt;br \\\/&gt;the button they&#039;ll be taken to the&lt;br \\\/&gt;second section automatically cool&lt;br \\\/&gt;okay great let&#039;s move on to the third&lt;br \\\/&gt;and final section I&#039;ll go ahead and copy&lt;br \\\/&gt;the first section&lt;br \\\/&gt;and paste it at the bottom of the page&lt;br \\\/&gt;I&#039;ll change the min height 250 VH&lt;br \\\/&gt;and set the background type to classic&lt;br \\\/&gt;for now I&#039;ll leave the purple background&lt;br \\\/&gt;overlay so we can see the texts I&#039;ll&lt;br \\\/&gt;remove it later so we end up with a&lt;br \\\/&gt;clean white background&lt;br \\\/&gt;but first I&#039;ll delete these widgets so&lt;br \\\/&gt;we&#039;re left with the text editor widget&lt;br \\\/&gt;over here&lt;br \\\/&gt;then I&#039;ll change the text&lt;br \\\/&gt;and set its color&lt;br \\\/&gt;now let&#039;s duplicate the widget and&lt;br \\\/&gt;change the text as well&lt;br \\\/&gt;in style I changed the size to sixty&lt;br \\\/&gt;pixels and give it a bold weight of 600&lt;br \\\/&gt;then remove the letter spacing and drag&lt;br \\\/&gt;the line heights all the way down&lt;br \\\/&gt;next duplicate the first text again and&lt;br \\\/&gt;drag it under the phone number&lt;br \\\/&gt;here I&#039;ll add the flower shops address&lt;br \\\/&gt;and Dragon as social icons widget over&lt;br \\\/&gt;here&lt;br \\\/&gt;add an item&lt;br \\\/&gt;and choose the Instagram icon from the&lt;br \\\/&gt;library&lt;br \\\/&gt;then add all of the social links&lt;br \\\/&gt;accordingly&lt;br \\\/&gt;I&#039;ll go ahead and change the shape to&lt;br \\\/&gt;square and in style give it a custom&lt;br \\\/&gt;color&lt;br \\\/&gt;and set its size to 25 padding to 0.7&lt;br \\\/&gt;and spacing to 12 an icon haver I&#039;ll set&lt;br \\\/&gt;the color to change to the pink red we&lt;br \\\/&gt;set before&lt;br \\\/&gt;I&#039;ll add the float haver animation here&lt;br \\\/&gt;as well&lt;br \\\/&gt;and in advanced I&#039;ll unlink the padding&lt;br \\\/&gt;and add 40 pixels padding to the top&lt;br \\\/&gt;okay great now back in the section&lt;br \\\/&gt;settings in style let&#039;s remove the&lt;br \\\/&gt;purple background overlay so we end up&lt;br \\\/&gt;with a clean white background cool we&#039;re&lt;br \\\/&gt;almost ready&lt;br \\\/&gt;you&lt;\\\/p&gt;&quot;,&quot;inner_tab_content_1&quot;:&quot;&lt;p&gt;Welcome to the Elementor Getting Started Course.&lt;br \\\/&gt;In this short video series, you&#039;ll learn the basics of using Elementor.&lt;br \\\/&gt;We will cover all you need to know to streamline your workflow and easily create landing pages using the power of Elementor.&lt;\\\/p&gt;&lt;p&gt;Things you&#039;ll learn in this course:&lt;br \\\/&gt;\\u2713 Overview of Elementor&lt;br \\\/&gt;\\u2713 Building a Landing Page step-by-step&lt;br \\\/&gt;\\u2713 Responsive design with Elementor&lt;br \\\/&gt;\\u2713 Save your work as a template to reuse across your site&lt;br \\\/&gt;\\u2713 Publish your pages&lt;br \\\/&gt;\\u2713 And much more!&lt;\\\/p&gt;&quot;,&quot;_id&quot;:&quot;1d71e05&quot;,&quot;type&quot;:&quot;youtube&quot;,&quot;vimeo_url&quot;:null,&quot;is_external_url&quot;:null,&quot;hosted_url&quot;:null,&quot;external_url&quot;:null,&quot;section_html_tag&quot;:null,&quot;video_html_tag&quot;:&quot;h4&quot;},{&quot;title&quot;:&quot;Lesson 4: Mobile Responsive Editing With Elementor&quot;,&quot;youtube_url&quot;:&quot;https:\\\/\\\/youtu.be\\\/0RrpdWCcskU?list=PLZyp9H25CboEjxaR503MFVlwtiBat9Dq4&quot;,&quot;duration&quot;:&quot;3:59&quot;,&quot;thumbnail&quot;:{&quot;url&quot;:&quot;&quot;,&quot;id&quot;:&quot;&quot;,&quot;size&quot;:&quot;&quot;},&quot;inner_tab_is_content_visible&quot;:&quot;show&quot;,&quot;inner_tab_content_2&quot;:&quot;&lt;p&gt;we are done creating our page but many&lt;br \\\/&gt;potential customers will land on it via&lt;br \\\/&gt;their smartphones or tablets so let&#039;s&lt;br \\\/&gt;see how we can tweak it for mobile&lt;br \\\/&gt;hadn&#039;t entered the mobile responsive&lt;br \\\/&gt;mode and tweak it a bit&lt;br \\\/&gt;I&#039;ll open the navigator as well so we&lt;br \\\/&gt;get a clear overview of all our sections&lt;br \\\/&gt;I&#039;ll double-click the first section in&lt;br \\\/&gt;the navigator and name it here a section&lt;br \\\/&gt;when clicking on the error we can see&lt;br \\\/&gt;that it contains one column and clicking&lt;br \\\/&gt;again reveals all the widgets in it I&#039;ll&lt;br \\\/&gt;select the heading&lt;br \\\/&gt;and change the size to 45 pixels as you&lt;br \\\/&gt;can see there are responsive handles&lt;br \\\/&gt;indicating the screen sizes you&#039;re&lt;br \\\/&gt;editing for the 45 pixels will be&lt;br \\\/&gt;applied to mobiles only&lt;br \\\/&gt;next I&#039;ll select the text editor widgets&lt;br \\\/&gt;and in advanced and link the padding&lt;br \\\/&gt;values and change the left and right to&lt;br \\\/&gt;ten percent each&lt;br \\\/&gt;again these values are mobile-specific&lt;br \\\/&gt;let&#039;s move on to the second section&lt;br \\\/&gt;I&#039;ll limit flower section&lt;br \\\/&gt;in the advanced tab our first unlink the&lt;br \\\/&gt;padding values and then give it some top&lt;br \\\/&gt;and bottom padding to create some space&lt;br \\\/&gt;next&lt;br \\\/&gt;select the our flowers heading&lt;br \\\/&gt;and change its size 245 pixels then&lt;br \\\/&gt;click the text editor widgets&lt;br \\\/&gt;in advanced and link the padding values&lt;br \\\/&gt;and change the left and right to ten&lt;br \\\/&gt;percent each&lt;br \\\/&gt;I also add 10% padding to the top of the&lt;br \\\/&gt;text editor widget above the button over&lt;br \\\/&gt;here&lt;br \\\/&gt;okay great lastly let&#039;s tweak the third&lt;br \\\/&gt;section for mobile as well in the&lt;br \\\/&gt;navigator I&#039;ll name it contact section&lt;br \\\/&gt;I&#039;ll change the phone number size to 35&lt;br \\\/&gt;pixels&lt;br \\\/&gt;and in the section settings under&lt;br \\\/&gt;advanced&lt;br \\\/&gt;unlink the padding and add 80 pixels to&lt;br \\\/&gt;the top and bottom&lt;br \\\/&gt;there are some other responsive settings&lt;br \\\/&gt;you can try out here as well such as&lt;br \\\/&gt;reversing columns for mobile and tablet&lt;br \\\/&gt;I&#039;ll go ahead and add a new column so&lt;br \\\/&gt;you can see how it works&lt;br \\\/&gt;I&#039;ll drag an image widget into it&lt;br \\\/&gt;and choose this nice flower&lt;br \\\/&gt;now back in the sections Advanced&lt;br \\\/&gt;Settings&lt;br \\\/&gt;and a responsive if I reverse the&lt;br \\\/&gt;columns for mobile the image will show&lt;br \\\/&gt;first&lt;br \\\/&gt;we can also hide entire sections as well&lt;br \\\/&gt;as columns&lt;br \\\/&gt;and this can be done for all responsive&lt;br \\\/&gt;modes like you see here&lt;br \\\/&gt;I&#039;ll go ahead and delete this column&lt;br \\\/&gt;since we won&#039;t be needing it for our&lt;br \\\/&gt;landing page&lt;br \\\/&gt;another cool way to tweak your designs&lt;br \\\/&gt;for mobile is by using the column width&lt;br \\\/&gt;feature I&#039;ll go back to the flowers&lt;br \\\/&gt;section&lt;br \\\/&gt;and click on the first column in the&lt;br \\\/&gt;intersection&lt;br \\\/&gt;then and the layout set a custom column&lt;br \\\/&gt;width I&#039;ll go for 50% so it takes up&lt;br \\\/&gt;half of the width I&#039;ll do the same for&lt;br \\\/&gt;the second column&lt;br \\\/&gt;as you can see we can fully control this&lt;br \\\/&gt;for mobile tablets and desktop I&#039;ll go&lt;br \\\/&gt;ahead and delete the values so they&#039;re&lt;br \\\/&gt;back to what I had before&lt;br \\\/&gt;you&lt;\\\/p&gt;&quot;,&quot;inner_tab_content_1&quot;:&quot;&lt;p&gt;Welcome to the Elementor Getting Started Course.&lt;br \\\/&gt;In this short video series, you&#039;ll learn the basics of using Elementor.&lt;br \\\/&gt;We will cover all you need to know to streamline your workflow and easily create landing pages using the power of Elementor.&lt;\\\/p&gt;&lt;p&gt;Things you&#039;ll learn in this course:&lt;br \\\/&gt;\\u2713 Overview of Elementor&lt;br \\\/&gt;\\u2713 Building a Landing Page step-by-step&lt;br \\\/&gt;\\u2713 Responsive design with Elementor&lt;br \\\/&gt;\\u2713 Save your work as a template to reuse across your site&lt;br \\\/&gt;\\u2713 Publish your pages&lt;br \\\/&gt;\\u2713 And much more!&lt;\\\/p&gt;&quot;,&quot;_id&quot;:&quot;4a0a477&quot;,&quot;type&quot;:&quot;youtube&quot;,&quot;vimeo_url&quot;:null,&quot;is_external_url&quot;:null,&quot;hosted_url&quot;:null,&quot;external_url&quot;:null,&quot;section_html_tag&quot;:null,&quot;video_html_tag&quot;:&quot;h4&quot;},{&quot;title&quot;:&quot;Lesson 5: Publish And Save Your Page as a Template&quot;,&quot;youtube_url&quot;:&quot;https:\\\/\\\/youtu.be\\\/TY6wHrZSvvE?list=PLZyp9H25CboEjxaR503MFVlwtiBat9Dq4&quot;,&quot;duration&quot;:&quot;1:11&quot;,&quot;thumbnail&quot;:{&quot;url&quot;:&quot;&quot;,&quot;id&quot;:&quot;&quot;,&quot;size&quot;:&quot;&quot;},&quot;inner_tab_is_content_visible&quot;:&quot;show&quot;,&quot;inner_tab_content_2&quot;:&quot;&lt;p&gt;we are done let&#039;s publish and check out&lt;br \\\/&gt;a final result&lt;br \\\/&gt;cool&lt;br \\\/&gt;we can also save this page as a template&lt;br \\\/&gt;and reuse it to easily create multiple&lt;br \\\/&gt;landing pages on the fly&lt;br \\\/&gt;simply give the template a name and next&lt;br \\\/&gt;time when you create a new page and&lt;br \\\/&gt;enter the library you&#039;ll see it under my&lt;br \\\/&gt;templates&lt;br \\\/&gt;and if you&#039;d like to save this contact&lt;br \\\/&gt;section for example you can do that too&lt;br \\\/&gt;simply right-click on the handle and&lt;br \\\/&gt;choose save as template like before&lt;br \\\/&gt;well that&#039;s it now you know how to&lt;br \\\/&gt;create a professional landing page from&lt;br \\\/&gt;start to finish without touching a&lt;br \\\/&gt;single line of code I hope you enjoyed&lt;br \\\/&gt;this tutorial and feel confident in&lt;br \\\/&gt;using Elementor to design build and&lt;br \\\/&gt;publish landing pages for your own&lt;br \\\/&gt;business or customers ciao for now&lt;\\\/p&gt;&quot;,&quot;inner_tab_content_1&quot;:&quot;&lt;p&gt;Welcome to the Elementor Getting Started Course.&lt;br \\\/&gt;In this short video series, you&#039;ll learn the basics of using Elementor.&lt;br \\\/&gt;We will cover all you need to know to streamline your workflow and easily create landing pages using the power of Elementor.&lt;\\\/p&gt;&lt;p&gt;Things you&#039;ll learn in this course:&lt;br \\\/&gt;\\u2713 Overview of Elementor&lt;br \\\/&gt;\\u2713 Building a Landing Page step-by-step&lt;br \\\/&gt;\\u2713 Responsive design with Elementor&lt;br \\\/&gt;\\u2713 Save your work as a template to reuse across your site&lt;br \\\/&gt;\\u2713 Publish your pages&lt;br \\\/&gt;\\u2713 And much more!&lt;\\\/p&gt;&quot;,&quot;_id&quot;:&quot;a506e92&quot;,&quot;type&quot;:&quot;youtube&quot;,&quot;vimeo_url&quot;:null,&quot;is_external_url&quot;:null,&quot;hosted_url&quot;:null,&quot;external_url&quot;:null,&quot;section_html_tag&quot;:null,&quot;video_html_tag&quot;:&quot;h4&quot;}],&quot;inner_tab_title_1&quot;:&quot;Overview&quot;,&quot;inner_tab_title_2&quot;:&quot;Transcript&quot;,&quot;inner_tab_is_content_collapsible&quot;:&quot;collapsible&quot;,&quot;inner_tab_collapsible_height&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;139&quot;,&quot;sizes&quot;:[]},&quot;autoplay_next&quot;:&quot;yes&quot;,&quot;show_watched_indication&quot;:&quot;yes&quot;,&quot;inner_tab_collapsible_height_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;inner_tab_collapsible_height_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"video-playlist.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\n\t\t<div class=\"e-tabs\" role=\"region\" aria-labelledby=\"e-playlist-40dbc187\">\n\t\t\t<div class=\"e-tabs-main-area\">\n\t\t\t\t<div class=\"e-tabs-wrapper\">\n\t\t\t\t\t<div class=\"e-tabs-header\">\n\t\t\t\t\t\t<h2 class=\"e-tabs-title\" id=\"e-playlist-40dbc187\">Playlist<\/h2>\n\t\t\t\t\t\t<div class=\"e-tabs-header-right-side\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"e-tabs-videos-count\">5 Videos<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<svg aria-hidden=\"true\" class=\"e-tabs-toggle-videos-display-button rotate-down e-font-icon-svg e-eicon-caret-down\" viewBox=\"0 0 571.4 571.4\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M571 393Q571 407 561 418L311 668Q300 679 286 679T261 668L11 418Q0 407 0 393T11 368 36 357H536Q550 357 561 368T571 393Z\"><\/path><\/svg>\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t\t<div class=\"e-tabs-items-wrapper\">\n\t\t\t\t\t\t<div class=\"e-tabs-items\" role=\"tablist\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div id=\"e-tab-title-1081\" class=\"e-tab-title e-tab-desktop-title\" aria-selected=\"true\" data-tab=\"1\" role=\"tab\" tabindex=\"0\" aria-controls=\"e-tab-content-1081\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-tab-thumbnail\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"icon-play\"><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"icon-watched\"><\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h4 class=\"e-tab-title-text\">\n\t\t\t\t\t\t\t\t\t\t\t<button type=\"button\">Getting Started With Elementor: Create a Landing Page Step-by-Step<\/button>\n\t\t\t\t\t\t\t\t\t\t<\/h4>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"e-tab-duration\">1:37<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div id=\"e-tab-title-1082\" class=\"e-tab-title e-tab-desktop-title\" aria-selected=\"false\" data-tab=\"2\" role=\"tab\" tabindex=\"-1\" aria-controls=\"e-tab-content-1082\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-tab-thumbnail\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"icon-play\"><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"icon-watched\"><\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h4 class=\"e-tab-title-text\">\n\t\t\t\t\t\t\t\t\t\t\t<button type=\"button\">Lesson 2: Start Working With Elementor<\/button>\n\t\t\t\t\t\t\t\t\t\t<\/h4>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"e-tab-duration\">4:12<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div id=\"e-tab-title-1083\" class=\"e-tab-title e-tab-desktop-title\" aria-selected=\"false\" data-tab=\"3\" role=\"tab\" tabindex=\"-1\" aria-controls=\"e-tab-content-1083\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-tab-thumbnail\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"icon-play\"><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"icon-watched\"><\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h4 class=\"e-tab-title-text\">\n\t\t\t\t\t\t\t\t\t\t\t<button type=\"button\">Lesson 3: Building Your Landing Page With Elementor<\/button>\n\t\t\t\t\t\t\t\t\t\t<\/h4>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"e-tab-duration\">10:35<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div id=\"e-tab-title-1084\" class=\"e-tab-title e-tab-desktop-title\" aria-selected=\"false\" data-tab=\"4\" role=\"tab\" tabindex=\"-1\" aria-controls=\"e-tab-content-1084\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-tab-thumbnail\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"icon-play\"><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"icon-watched\"><\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h4 class=\"e-tab-title-text\">\n\t\t\t\t\t\t\t\t\t\t\t<button type=\"button\">Lesson 4: Mobile Responsive Editing With Elementor<\/button>\n\t\t\t\t\t\t\t\t\t\t<\/h4>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"e-tab-duration\">3:59<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div id=\"e-tab-title-1085\" class=\"e-tab-title e-tab-desktop-title\" aria-selected=\"false\" data-tab=\"5\" role=\"tab\" tabindex=\"-1\" aria-controls=\"e-tab-content-1085\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-tab-thumbnail\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"icon-play\"><\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"icon-watched\"><\/span>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<h4 class=\"e-tab-title-text\">\n\t\t\t\t\t\t\t\t\t\t\t<button type=\"button\">Lesson 5: Publish And Save Your Page as a Template<\/button>\n\t\t\t\t\t\t\t\t\t\t<\/h4>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"e-tab-duration\">1:11<\/span>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t<div class=\"shadow shadow-top\" aria-hidden=\"true\"><\/div>\n\t\t\t\t\t\t<div class=\"shadow shadow-bottom\" aria-hidden=\"true\"><\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\n\t\t\t\t<div class=\"e-tabs-content-wrapper\" role=\"tablist\" aria-orientation=\"vertical\">\n\t\t\t\t\t\t\t\t\t\t\t<div id=\"e-tab-content-1081\" class=\"e-tab-content elementor-clearfix\" data-tab=\"1\" role=\"tabpanel\" aria-labelledby=\"e-tab-title-1081\" tabindex=\"0\" data-video-url=\"https:\/\/youtu.be\/bZPWe0VRj28?list=PLZyp9H25CboEjxaR503MFVlwtiBat9Dq4\" data-video-type=\"youtube\" data-video-title=\"Getting Started With Elementor: Create a Landing Page Step-by-Step\" data-video-duration=\"1:37\">\n\t\t\t\t\t\t\t<div><\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div id=\"e-tab-content-1082\" class=\"e-tab-content elementor-clearfix\" data-tab=\"2\" role=\"tabpanel\" aria-labelledby=\"e-tab-title-1082\" tabindex=\"0\" data-video-url=\"https:\/\/youtu.be\/yS02SxCbC_0?list=PLZyp9H25CboEjxaR503MFVlwtiBat9Dq4\" data-video-type=\"youtube\" data-video-title=\"Lesson 2: Start Working With Elementor\" data-video-duration=\"4:12\" hidden=\"hidden\">\n\t\t\t\t\t\t\t<div><\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div id=\"e-tab-content-1083\" class=\"e-tab-content elementor-clearfix\" data-tab=\"3\" role=\"tabpanel\" aria-labelledby=\"e-tab-title-1083\" tabindex=\"0\" data-video-url=\"https:\/\/youtu.be\/fxqIa7QYR-E?list=PLZyp9H25CboEjxaR503MFVlwtiBat9Dq4\" data-video-type=\"youtube\" data-video-title=\"Lesson 3: Building Your Landing Page With Elementor\" data-video-duration=\"10:35\" hidden=\"hidden\">\n\t\t\t\t\t\t\t<div><\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div id=\"e-tab-content-1084\" class=\"e-tab-content elementor-clearfix\" data-tab=\"4\" role=\"tabpanel\" aria-labelledby=\"e-tab-title-1084\" tabindex=\"0\" data-video-url=\"https:\/\/youtu.be\/0RrpdWCcskU?list=PLZyp9H25CboEjxaR503MFVlwtiBat9Dq4\" data-video-type=\"youtube\" data-video-title=\"Lesson 4: Mobile Responsive Editing With Elementor\" data-video-duration=\"3:59\" hidden=\"hidden\">\n\t\t\t\t\t\t\t<div><\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div id=\"e-tab-content-1085\" class=\"e-tab-content elementor-clearfix\" data-tab=\"5\" role=\"tabpanel\" aria-labelledby=\"e-tab-title-1085\" tabindex=\"0\" data-video-url=\"https:\/\/youtu.be\/TY6wHrZSvvE?list=PLZyp9H25CboEjxaR503MFVlwtiBat9Dq4\" data-video-type=\"youtube\" data-video-title=\"Lesson 5: Publish And Save Your Page as a Template\" data-video-duration=\"1:11\" hidden=\"hidden\">\n\t\t\t\t\t\t\t<div><\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t<\/div>\n\n\t\t\t<div class=\"e-tabs-inner-tabs\" >\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div id=\"e-tab-content-1081\" class=\"e-tab-content elementor-clearfix\" data-tab=\"1\" role=\"tabpanel\" aria-labelledby=\"e-tab-title-1081\" tabindex=\"0\" data-video-url=\"https:\/\/youtu.be\/bZPWe0VRj28?list=PLZyp9H25CboEjxaR503MFVlwtiBat9Dq4\" data-video-type=\"youtube\" data-video-title=\"Getting Started With Elementor: Create a Landing Page Step-by-Step\" data-video-duration=\"1:37\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tabs-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title e-inner-tab-active\">\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"e-inner-tab-title-text\" tabindex=\"0\">Overview<\/a>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title \">\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"e-inner-tab-title-text\" tabindex=\"0\">Transcript<\/a>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"e-inner-tabs-content-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title e-tab-mobile-title e-inner-tab-active\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tOverview\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div  class=\"e-inner-tab-content e-inner-tab-active collapsible\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-text\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div >\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p>Welcome to the Elementor Getting Started Course.<br \/>In this short video series, you&#8217;ll learn the basics of using Elementor.<br \/>We will cover all you need to know to streamline your workflow and easily create landing pages using the power of Elementor.<\/p><p>Things you&#8217;ll learn in this course:<br \/>\u2713 Overview of Elementor<br \/>\u2713 Building a Landing Page step-by-step<br \/>\u2713 Responsive design with Elementor<br \/>\u2713 Save your work as a template to reuse across your site<br \/>\u2713 Publish your pages<br \/>\u2713 And much more!<\/p>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-buttons\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<button class=\"show-button\">Show More<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<button>Show Less<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title e-tab-mobile-title \">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tTranscript\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div hidden class=\"e-inner-tab-content  collapsible\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-text\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div >\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p>hi-oh I&#8217;m zve a web designer and lead<br \/>educator here at elemental today we&#8217;ll<br \/>create a professional landing page from<br \/>start to finish without touching a<br \/>single line of code it will be easy to<br \/>follow and most importantly we&#8217;ll do it<br \/>all with elemental this tutorial will<br \/>give you a basic breakdown of elemental<br \/>and show you how to design build and<br \/>publish landing pages for your own<br \/>business or customers just like the one<br \/>you see here a landing page is a page on<br \/>your site visitors arrive on via some<br \/>kind of advertising such as a Facebook<br \/>ad or Google search the page is designed<br \/>with a specific purpose to convert<br \/>visitors into leads by taking a specific<br \/>action so let&#8217;s see how that translates<br \/>to our design the visitor will see the<br \/>hero section first so here we need to<br \/>grab their attention from the get-go<br \/>there&#8217;s a video running in the<br \/>background and a bold title presenting<br \/>the product the button is a clear<br \/>call-to-action that is set to scroll<br \/>down to the second section when visitors<br \/>click on it here they see a selection of<br \/>flowers with prices and can directly<br \/>call the flower shop to inquire and<br \/>place an order by clicking on the button<br \/>mostly we have a contact as section with<br \/>some texts and social icons to find out<br \/>more about the flower shop okay great so<br \/>now that we know what we&#8217;re going to<br \/>build let&#8217;s jump in and make a start<\/p>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-buttons\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<button class=\"show-button\">Show More<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<button>Show Less<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div id=\"e-tab-content-1082\" class=\"e-tab-content elementor-clearfix\" data-tab=\"2\" role=\"tabpanel\" aria-labelledby=\"e-tab-title-1082\" tabindex=\"0\" data-video-url=\"https:\/\/youtu.be\/yS02SxCbC_0?list=PLZyp9H25CboEjxaR503MFVlwtiBat9Dq4\" data-video-type=\"youtube\" data-video-title=\"Lesson 2: Start Working With Elementor\" data-video-duration=\"4:12\" hidden=\"hidden\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tabs-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title e-inner-tab-active\">\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"e-inner-tab-title-text\" tabindex=\"0\">Overview<\/a>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title \">\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"e-inner-tab-title-text\" tabindex=\"0\">Transcript<\/a>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"e-inner-tabs-content-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title e-tab-mobile-title e-inner-tab-active\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tOverview\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div  class=\"e-inner-tab-content e-inner-tab-active collapsible\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-text\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div >\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p>Welcome to the Elementor Getting Started Course.<br \/>In this short video series, you&#8217;ll learn the basics of using Elementor.<br \/>We will cover all you need to know to streamline your workflow and easily create landing pages using the power of Elementor.<\/p><p>Things you&#8217;ll learn in this course:<br \/>\u2713 Overview of Elementor<br \/>\u2713 Building a Landing Page step-by-step<br \/>\u2713 Responsive design with Elementor<br \/>\u2713 Save your work as a template to reuse across your site<br \/>\u2713 Publish your pages<br \/>\u2713 And much more!<\/p>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-buttons\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<button class=\"show-button\">Show More<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<button>Show Less<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title e-tab-mobile-title \">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tTranscript\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div hidden class=\"e-inner-tab-content  collapsible\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-text\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div >\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p>to start working with elemental you need<br \/>to create your first page so from the<br \/>wordpress dashboard and the pages click<br \/>add new<br \/>and give it an M then click Edit with<br \/>elemental to start with a clean page go<br \/>to the bottom panel and click the page<br \/>Settings icon<br \/>and a page layout choose canvas this is<br \/>the easiest way to create a full blank<br \/>page without a header and a footer<br \/>exactly what we need for our landing<br \/>page<br \/>let&#8217;s get familiar with the elemental<br \/>interface on the right side is the<br \/>editing area of the page this is where<br \/>you can add and edit elements that form<br \/>the layout of your page on the left side<br \/>is the elemental panel here are creative<br \/>tools called widgets you use widgets to<br \/>add elements to your page like headings<br \/>or a text editor images and videos and<br \/>much more you can always access this<br \/>area by clicking on the widgets icon<br \/>here on the top right<br \/>on the top left you have a hamburger<br \/>menu where you have more options like<br \/>setting default colors and fonts which<br \/>saves a lot of time when designing your<br \/>page I&#8217;ve gone ahead and set the<br \/>headlines index in text to sindelle with<br \/>the weight of 200<br \/>the body text asset to Montserrat<br \/>with the weight of 300<br \/>just don&#8217;t forget to apply your changes<br \/>back in the hamburger menu you can also<br \/>click view page to see your live website<br \/>or exit to dashboard to go back to your<br \/>WordPress dashboard<br \/>at the bottom is another panel with more<br \/>key features such as page settings where<br \/>you can give the pager name<br \/>and choose a page layout like we did<br \/>before here is the Navigator which helps<br \/>you get a clear and organized view of<br \/>your page currently it&#8217;s empty because<br \/>we haven&#8217;t added any content yet we&#8217;ll<br \/>use it later here we can see our edit<br \/>history to view recent changes<br \/>and next to it is the responsive menu<br \/>for switching between screen modes<br \/>we can preview our changes and when<br \/>ready to go live simply hit the publish<br \/>button<br \/>there are others save options as well<br \/>which I&#8217;ll talk about later okay great<br \/>now let&#8217;s take a closer look at how<br \/>pages are built there are two ways you<br \/>can start let&#8217;s begin with the library<br \/>here you can preview elementals pre-made<br \/>blocks and pages as well as your own<br \/>templates<br \/>and insert them into your page I&#8217;ll go<br \/>ahead and insert this block so you can<br \/>see<br \/>elemento uses three main building blocks<br \/>sections columns and widgets sections<br \/>are the largest and can be identified by<br \/>their blue border like you see here<br \/>inside them are columns in this case<br \/>there&#8217;s one you can identify them by the<br \/>black dashed border these columns house<br \/>widgets such as the texts and batten you<br \/>see her you control the section column<br \/>and widgets with the handle to edit them<br \/>simply right-click the handle where you<br \/>can edit duplicate delete and much more<br \/>the blue line indicates where it will be<br \/>positioned when you let go you can move<br \/>them around by simply dragging and<br \/>dropping them sections columns and<br \/>widgets have three tabs in the panel on<br \/>the Left<br \/>sections and columns have layout style<br \/>and advanced tabs<br \/>whereas widgets have content style and<br \/>advanced tabs soon we&#8217;ll see how these<br \/>settings are used to create a landing<br \/>page but first I&#8217;ll go ahead and delete<br \/>this section because we will create our<br \/>landing page from scratch<br \/>another way to add sections is by<br \/>pressing the plus icon over here then<br \/>simply choose one of these preset<br \/>structures which we can tweak to our<br \/>liking on the go so let&#8217;s dive in and<br \/>start building a landing page<br \/>you<\/p>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-buttons\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<button class=\"show-button\">Show More<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<button>Show Less<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div id=\"e-tab-content-1083\" class=\"e-tab-content elementor-clearfix\" data-tab=\"3\" role=\"tabpanel\" aria-labelledby=\"e-tab-title-1083\" tabindex=\"0\" data-video-url=\"https:\/\/youtu.be\/fxqIa7QYR-E?list=PLZyp9H25CboEjxaR503MFVlwtiBat9Dq4\" data-video-type=\"youtube\" data-video-title=\"Lesson 3: Building Your Landing Page With Elementor\" data-video-duration=\"10:35\" hidden=\"hidden\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tabs-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title e-inner-tab-active\">\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"e-inner-tab-title-text\" tabindex=\"0\">Overview<\/a>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title \">\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"e-inner-tab-title-text\" tabindex=\"0\">Transcript<\/a>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"e-inner-tabs-content-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title e-tab-mobile-title e-inner-tab-active\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tOverview\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div  class=\"e-inner-tab-content e-inner-tab-active collapsible\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-text\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div >\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p>Welcome to the Elementor Getting Started Course.<br \/>In this short video series, you&#8217;ll learn the basics of using Elementor.<br \/>We will cover all you need to know to streamline your workflow and easily create landing pages using the power of Elementor.<\/p><p>Things you&#8217;ll learn in this course:<br \/>\u2713 Overview of Elementor<br \/>\u2713 Building a Landing Page step-by-step<br \/>\u2713 Responsive design with Elementor<br \/>\u2713 Save your work as a template to reuse across your site<br \/>\u2713 Publish your pages<br \/>\u2713 And much more!<\/p>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-buttons\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<button class=\"show-button\">Show More<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<button>Show Less<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title e-tab-mobile-title \">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tTranscript\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div hidden class=\"e-inner-tab-content  collapsible\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-text\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div >\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p>in the previous lesson we learned how to<br \/>get up and running with elemental in<br \/>this lesson we&#8217;ll start building our<br \/>page I&#8217;ll add a section with one column<br \/>of 100 VH<br \/>this way the section will always take up<br \/>at least a hundred percent of the<br \/>viewports heart no matter the amount of<br \/>content in it I&#8217;ll set the content width<br \/>to 800 pixels over here and in style we<br \/>can give our section a background there<br \/>are a couple of types you can open the<br \/>media library by clicking on the plus<br \/>over here as you can see it&#8217;s empty we<br \/>can drag in an image file as well as<br \/>other media I want a video to play in<br \/>the background so I&#8217;ll go ahead and drag<br \/>in a video file and then I&#8217;ll copy this<br \/>link over here<br \/>now close the library and change the<br \/>background type to video we can either<br \/>add a YouTube or Vimeo link or simply<br \/>paste the link to the video file we just<br \/>uploaded to a media library<br \/>I&#8217;ll go ahead and set it to play on<br \/>mobile as well<br \/>next I&#8217;ll give it a classic background<br \/>overlay<br \/>you can either use the color picker<br \/>or piss the color-code over here I&#8217;ll go<br \/>for this nice purple color if you want<br \/>to reuse this color simply click the<br \/>plus icon and it will be added to your<br \/>color palette automatically next I&#8217;ll<br \/>set the opacity to zero point seven and<br \/>I&#8217;ll darken it a bit by using the blend<br \/>mode option okay great<br \/>next I&#8217;ll drag in a text editor widgets<br \/>and change the text<br \/>in style our line into the center and<br \/>change the color to white<br \/>in typography the default font family<br \/>montserrat we set before is<br \/>automatically applied here I&#8217;ll change<br \/>the size to 15 pixels weight to 200<br \/>and set transform to uppercase I also<br \/>set the letter spacing to 7 so it<br \/>spreads out nicely<br \/>then drag in a heading widgets and<br \/>change the text<br \/>align it to the sensor as well<br \/>and InStyle set the color to white<br \/>in topography the fun family&#8217;s in zoo we<br \/>said before as default is automatically<br \/>applied here as well I set the size to<br \/>70 pixels and transformed to uppercase<br \/>next drag in another text editor widgets<br \/>and change the text<br \/>before align it to the center and change<br \/>the color to white<br \/>then set the line height to 2 a.m.<br \/>in advanced and link the padding values<br \/>so you can set them individually and<br \/>change the unit to percentage and give a<br \/>20% padding to the left and right okay<br \/>great<br \/>looking good we&#8217;re almost done with our<br \/>first section time to drag in the baton<br \/>widget<br \/>I&#8217;ll change the text and align to the<br \/>center<br \/>here I&#8217;ll add a link that sets it to<br \/>scroll down to the second section on<br \/>this page which we need to build first<br \/>so I&#8217;ll show you how to do that soon<br \/>I&#8217;ll set its size to large<br \/>and in style topography I&#8217;ll set the<br \/>transform to uppercase<br \/>next I&#8217;ll give it this dog text color<br \/>and change the background color to white<br \/>on hover I&#8217;ll change the text color to<br \/>white<br \/>crank color to this pink red<br \/>I&#8217;ll save this color so I can reuse it<br \/>later let&#8217;s add a hover animation as<br \/>well I&#8217;ll set it to flood<br \/>lastly I&#8217;ll set the border-radius to<br \/>zero so the button becomes a rectangle<br \/>let&#8217;s check out what we have so far I&#8217;ll<br \/>go ahead and press preview over here as<br \/>you can see the page opens in a new tab<br \/>cool<br \/>okay gret let&#8217;s move on to the second<br \/>section I&#8217;ll add a section with one<br \/>column<br \/>and give it a minimum height of 100 VH<br \/>in style<br \/>I&#8217;ll give it this dog background-color<br \/>and save it as well now in order to<br \/>speed up our design process let&#8217;s go<br \/>back to our first section and copy this<br \/>text editor widget<br \/>paste it in the column<br \/>and change the text<br \/>next I&#8217;ll do the same for the heading<br \/>back in the first section<br \/>I&#8217;ll copy it<br \/>and paste it over here<br \/>then change the text<br \/>getting the hang of it let&#8217;s do it one<br \/>last time with the text editor widget<br \/>okay let&#8217;s move on<br \/>this time I&#8217;ll drag in an intersection<br \/>widget it comes with two columns by<br \/>default<br \/>a right-click on the column and select<br \/>add new column so there&#8217;s three in total<br \/>dragon imagebox widgets into the first<br \/>column I&#8217;ll click here to enter the<br \/>media library<br \/>and simply drag my flower images onto it<br \/>to upload them<br \/>I&#8217;ll choose this image first<br \/>next I&#8217;ll change the title and<br \/>description<br \/>and in style our set the spacing to zero<br \/>and with to a hundred percent<br \/>in the content drop-down align the text<br \/>to left<br \/>for the title set the spacing to 2<br \/>to white<br \/>in typography change the font family to<br \/>Montserrat<br \/>size to 18 pixels and set it to<br \/>transform to uppercase as well<br \/>for the description set the color to<br \/>white<br \/>and drag down the opacity of it<br \/>set the size to 16 pixels<br \/>and give it a weight of 200<br \/>now let&#8217;s duplicate this widget and drag<br \/>it into the other columns<br \/>I&#8217;ll go ahead and change their images<br \/>texts and descriptions<br \/>so we end up with three types of flowers<br \/>with price tags<br \/>okay great now let&#8217;s copy this text<br \/>editor widget<br \/>then paste it under the flowers<br \/>and in advanced add 10% padding on the<br \/>top to create some space<br \/>next copy the button from the first<br \/>section<br \/>paste it and change the text in the link<br \/>field I&#8217;ll add a tell scheme like sir<br \/>this will trigger a phone call when<br \/>clicking on the button in a webpage and<br \/>on a mobile phone<br \/>back in the section settings<br \/>in advanced<br \/>I&#8217;ll unlink the padding and add 200<br \/>pixels to the top and bottom<br \/>now it&#8217;s time to set the button in the<br \/>first section to scroll to this section<br \/>I&#8217;ll go ahead and type a CSS ID over<br \/>here for the section and copy it then<br \/>back in the buttons link field in the<br \/>first column<br \/>paste the ID after the panky<br \/>and that&#8217;s it now when your visitors<br \/>the button they&#8217;ll be taken to the<br \/>second section automatically cool<br \/>okay great let&#8217;s move on to the third<br \/>and final section I&#8217;ll go ahead and copy<br \/>the first section<br \/>and paste it at the bottom of the page<br \/>I&#8217;ll change the min height 250 VH<br \/>and set the background type to classic<br \/>for now I&#8217;ll leave the purple background<br \/>overlay so we can see the texts I&#8217;ll<br \/>remove it later so we end up with a<br \/>clean white background<br \/>but first I&#8217;ll delete these widgets so<br \/>we&#8217;re left with the text editor widget<br \/>over here<br \/>then I&#8217;ll change the text<br \/>and set its color<br \/>now let&#8217;s duplicate the widget and<br \/>change the text as well<br \/>in style I changed the size to sixty<br \/>pixels and give it a bold weight of 600<br \/>then remove the letter spacing and drag<br \/>the line heights all the way down<br \/>next duplicate the first text again and<br \/>drag it under the phone number<br \/>here I&#8217;ll add the flower shops address<br \/>and Dragon as social icons widget over<br \/>here<br \/>add an item<br \/>and choose the Instagram icon from the<br \/>library<br \/>then add all of the social links<br \/>accordingly<br \/>I&#8217;ll go ahead and change the shape to<br \/>square and in style give it a custom<br \/>color<br \/>and set its size to 25 padding to 0.7<br \/>and spacing to 12 an icon haver I&#8217;ll set<br \/>the color to change to the pink red we<br \/>set before<br \/>I&#8217;ll add the float haver animation here<br \/>as well<br \/>and in advanced I&#8217;ll unlink the padding<br \/>and add 40 pixels padding to the top<br \/>okay great now back in the section<br \/>settings in style let&#8217;s remove the<br \/>purple background overlay so we end up<br \/>with a clean white background cool we&#8217;re<br \/>almost ready<br \/>you<\/p>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-buttons\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<button class=\"show-button\">Show More<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<button>Show Less<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div id=\"e-tab-content-1084\" class=\"e-tab-content elementor-clearfix\" data-tab=\"4\" role=\"tabpanel\" aria-labelledby=\"e-tab-title-1084\" tabindex=\"0\" data-video-url=\"https:\/\/youtu.be\/0RrpdWCcskU?list=PLZyp9H25CboEjxaR503MFVlwtiBat9Dq4\" data-video-type=\"youtube\" data-video-title=\"Lesson 4: Mobile Responsive Editing With Elementor\" data-video-duration=\"3:59\" hidden=\"hidden\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tabs-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title e-inner-tab-active\">\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"e-inner-tab-title-text\" tabindex=\"0\">Overview<\/a>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title \">\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"e-inner-tab-title-text\" tabindex=\"0\">Transcript<\/a>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"e-inner-tabs-content-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title e-tab-mobile-title e-inner-tab-active\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tOverview\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div  class=\"e-inner-tab-content e-inner-tab-active collapsible\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-text\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div >\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p>Welcome to the Elementor Getting Started Course.<br \/>In this short video series, you&#8217;ll learn the basics of using Elementor.<br \/>We will cover all you need to know to streamline your workflow and easily create landing pages using the power of Elementor.<\/p><p>Things you&#8217;ll learn in this course:<br \/>\u2713 Overview of Elementor<br \/>\u2713 Building a Landing Page step-by-step<br \/>\u2713 Responsive design with Elementor<br \/>\u2713 Save your work as a template to reuse across your site<br \/>\u2713 Publish your pages<br \/>\u2713 And much more!<\/p>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-buttons\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<button class=\"show-button\">Show More<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<button>Show Less<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title e-tab-mobile-title \">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tTranscript\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div hidden class=\"e-inner-tab-content  collapsible\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-text\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div >\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p>we are done creating our page but many<br \/>potential customers will land on it via<br \/>their smartphones or tablets so let&#8217;s<br \/>see how we can tweak it for mobile<br \/>hadn&#8217;t entered the mobile responsive<br \/>mode and tweak it a bit<br \/>I&#8217;ll open the navigator as well so we<br \/>get a clear overview of all our sections<br \/>I&#8217;ll double-click the first section in<br \/>the navigator and name it here a section<br \/>when clicking on the error we can see<br \/>that it contains one column and clicking<br \/>again reveals all the widgets in it I&#8217;ll<br \/>select the heading<br \/>and change the size to 45 pixels as you<br \/>can see there are responsive handles<br \/>indicating the screen sizes you&#8217;re<br \/>editing for the 45 pixels will be<br \/>applied to mobiles only<br \/>next I&#8217;ll select the text editor widgets<br \/>and in advanced and link the padding<br \/>values and change the left and right to<br \/>ten percent each<br \/>again these values are mobile-specific<br \/>let&#8217;s move on to the second section<br \/>I&#8217;ll limit flower section<br \/>in the advanced tab our first unlink the<br \/>padding values and then give it some top<br \/>and bottom padding to create some space<br \/>next<br \/>select the our flowers heading<br \/>and change its size 245 pixels then<br \/>click the text editor widgets<br \/>in advanced and link the padding values<br \/>and change the left and right to ten<br \/>percent each<br \/>I also add 10% padding to the top of the<br \/>text editor widget above the button over<br \/>here<br \/>okay great lastly let&#8217;s tweak the third<br \/>section for mobile as well in the<br \/>navigator I&#8217;ll name it contact section<br \/>I&#8217;ll change the phone number size to 35<br \/>pixels<br \/>and in the section settings under<br \/>advanced<br \/>unlink the padding and add 80 pixels to<br \/>the top and bottom<br \/>there are some other responsive settings<br \/>you can try out here as well such as<br \/>reversing columns for mobile and tablet<br \/>I&#8217;ll go ahead and add a new column so<br \/>you can see how it works<br \/>I&#8217;ll drag an image widget into it<br \/>and choose this nice flower<br \/>now back in the sections Advanced<br \/>Settings<br \/>and a responsive if I reverse the<br \/>columns for mobile the image will show<br \/>first<br \/>we can also hide entire sections as well<br \/>as columns<br \/>and this can be done for all responsive<br \/>modes like you see here<br \/>I&#8217;ll go ahead and delete this column<br \/>since we won&#8217;t be needing it for our<br \/>landing page<br \/>another cool way to tweak your designs<br \/>for mobile is by using the column width<br \/>feature I&#8217;ll go back to the flowers<br \/>section<br \/>and click on the first column in the<br \/>intersection<br \/>then and the layout set a custom column<br \/>width I&#8217;ll go for 50% so it takes up<br \/>half of the width I&#8217;ll do the same for<br \/>the second column<br \/>as you can see we can fully control this<br \/>for mobile tablets and desktop I&#8217;ll go<br \/>ahead and delete the values so they&#8217;re<br \/>back to what I had before<br \/>you<\/p>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-buttons\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<button class=\"show-button\">Show More<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<button>Show Less<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div id=\"e-tab-content-1085\" class=\"e-tab-content elementor-clearfix\" data-tab=\"5\" role=\"tabpanel\" aria-labelledby=\"e-tab-title-1085\" tabindex=\"0\" data-video-url=\"https:\/\/youtu.be\/TY6wHrZSvvE?list=PLZyp9H25CboEjxaR503MFVlwtiBat9Dq4\" data-video-type=\"youtube\" data-video-title=\"Lesson 5: Publish And Save Your Page as a Template\" data-video-duration=\"1:11\" hidden=\"hidden\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tabs-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title e-inner-tab-active\">\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"e-inner-tab-title-text\" tabindex=\"0\">Overview<\/a>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title \">\n\t\t\t\t\t\t\t\t\t\t\t\t<a class=\"e-inner-tab-title-text\" tabindex=\"0\">Transcript<\/a>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<div class=\"e-inner-tabs-content-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title e-tab-mobile-title e-inner-tab-active\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tOverview\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div  class=\"e-inner-tab-content e-inner-tab-active collapsible\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-text\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div >\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p>Welcome to the Elementor Getting Started Course.<br \/>In this short video series, you&#8217;ll learn the basics of using Elementor.<br \/>We will cover all you need to know to streamline your workflow and easily create landing pages using the power of Elementor.<\/p><p>Things you&#8217;ll learn in this course:<br \/>\u2713 Overview of Elementor<br \/>\u2713 Building a Landing Page step-by-step<br \/>\u2713 Responsive design with Elementor<br \/>\u2713 Save your work as a template to reuse across your site<br \/>\u2713 Publish your pages<br \/>\u2713 And much more!<\/p>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-buttons\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<button class=\"show-button\">Show More<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<button>Show Less<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-title e-tab-mobile-title \">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tTranscript\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<div hidden class=\"e-inner-tab-content  collapsible\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-text\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div >\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p>we are done let&#8217;s publish and check out<br \/>a final result<br \/>cool<br \/>we can also save this page as a template<br \/>and reuse it to easily create multiple<br \/>landing pages on the fly<br \/>simply give the template a name and next<br \/>time when you create a new page and<br \/>enter the library you&#8217;ll see it under my<br \/>templates<br \/>and if you&#8217;d like to save this contact<br \/>section for example you can do that too<br \/>simply right-click on the handle and<br \/>choose save as template like before<br \/>well that&#8217;s it now you know how to<br \/>create a professional landing page from<br \/>start to finish without touching a<br \/>single line of code I hope you enjoyed<br \/>this tutorial and feel confident in<br \/>using Elementor to design build and<br \/>publish landing pages for your own<br \/>business or customers ciao for now<\/p>\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"e-inner-tab-buttons\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<button class=\"show-button\">Show More<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<button>Show Less<\/button>\n\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t\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>Learn how to build a professional landing page from start to finish with Elementor<\/p>\n","protected":false},"author":8,"featured_media":9697,"comment_status":"closed","ping_status":"open","sticky":false,"template":"elementor_theme","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[39],"class_list":["post-3155","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-design-layout","tag-courses"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Build a Landing Page With Elementor Course - 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\/getting-started-with-elementor-course\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Build a Landing Page With Elementor Course - Academy\" \/>\n<meta property=\"og:description\" content=\"Learn how to build a professional landing page from start to finish with Elementor\" \/>\n<meta property=\"og:url\" content=\"https:\/\/elementor.com\/academy\/getting-started-with-elementor-course\/\" \/>\n<meta property=\"og:site_name\" content=\"Academy\" \/>\n<meta property=\"article:published_time\" content=\"2021-06-23T11:52:33+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-04-23T11:19:25+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Landing-Page.png\" \/>\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\/png\" \/>\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=\"15 minutes\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Build a Landing Page With Elementor Course - 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\/getting-started-with-elementor-course\/","og_locale":"en_US","og_type":"article","og_title":"Build a Landing Page With Elementor Course - Academy","og_description":"Learn how to build a professional landing page from start to finish with Elementor","og_url":"https:\/\/elementor.com\/academy\/getting-started-with-elementor-course\/","og_site_name":"Academy","article_published_time":"2021-06-23T11:52:33+00:00","article_modified_time":"2023-04-23T11:19:25+00:00","og_image":[{"width":1920,"height":1080,"url":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Landing-Page.png","type":"image\/png"}],"author":"Hodaya","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Hodaya","Est. reading time":"15 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/elementor.com\/academy\/getting-started-with-elementor-course\/#article","isPartOf":{"@id":"https:\/\/elementor.com\/academy\/getting-started-with-elementor-course\/"},"author":{"name":"Hodaya","@id":"https:\/\/elementor.com\/academy\/#\/schema\/person\/ff9f2661f3df53ae5842a9ad15853d1c"},"headline":"Build a Landing Page With Elementor Course","datePublished":"2021-06-23T11:52:33+00:00","dateModified":"2023-04-23T11:19:25+00:00","mainEntityOfPage":{"@id":"https:\/\/elementor.com\/academy\/getting-started-with-elementor-course\/"},"wordCount":3451,"publisher":{"@id":"https:\/\/elementor.com\/academy\/#organization"},"image":{"@id":"https:\/\/elementor.com\/academy\/getting-started-with-elementor-course\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Landing-Page.png","keywords":["Courses"],"articleSection":["Design \/ Layout"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/elementor.com\/academy\/getting-started-with-elementor-course\/","url":"https:\/\/elementor.com\/academy\/getting-started-with-elementor-course\/","name":"Build a Landing Page With Elementor Course - Academy","isPartOf":{"@id":"https:\/\/elementor.com\/academy\/#website"},"primaryImageOfPage":{"@id":"https:\/\/elementor.com\/academy\/getting-started-with-elementor-course\/#primaryimage"},"image":{"@id":"https:\/\/elementor.com\/academy\/getting-started-with-elementor-course\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Landing-Page.png","datePublished":"2021-06-23T11:52:33+00:00","dateModified":"2023-04-23T11:19:25+00:00","breadcrumb":{"@id":"https:\/\/elementor.com\/academy\/getting-started-with-elementor-course\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/elementor.com\/academy\/getting-started-with-elementor-course\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/academy\/getting-started-with-elementor-course\/#primaryimage","url":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Landing-Page.png","contentUrl":"https:\/\/elementor.com\/academy\/wp-content\/uploads\/2021\/06\/Landing-Page.png","width":1920,"height":1080},{"@type":"BreadcrumbList","@id":"https:\/\/elementor.com\/academy\/getting-started-with-elementor-course\/#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":"Design \/ Layout","item":"https:\/\/elementor.com\/academy\/design-layout\/"},{"@type":"ListItem","position":4,"name":"Build a Landing Page With Elementor Course"}]},{"@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\/3155","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=3155"}],"version-history":[{"count":1,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts\/3155\/revisions"}],"predecessor-version":[{"id":9374,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/posts\/3155\/revisions\/9374"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/media\/9697"}],"wp:attachment":[{"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/media?parent=3155"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/categories?post=3155"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/elementor.com\/academy\/wp-json\/wp\/v2\/tags?post=3155"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}