- In this video, I’m going to show you how to create a footer with Elementor Pro.
- The first thing you need is to have Elementor and Elementor Pro installed. You can download these and many other premium plugins for WordPress from librenetworks.com by becoming a member. You can find the link below in the video description.
- Once Elementor and Elementor Pro are installed, in the left-hand WordPress sidebar, go to Templates, Add New.
- Now, in template type, click on the dropdown and choose Footer. Then, enter a name for the template, for example, Footer Demo. Click on Create Template.
- Next, you can choose from some of the pre-designed templates that come with the Pro version, or create one from scratch. In this tutorial, we’ll see how to create one from scratch.
- To do that, simply click on the close tab icon in the top right corner.
- Now, the first step is to define the structure you want for the footer.
- To do that, click on the plus symbol. In this case, we’ll define a two-column structure.
- Click on the left section, and in the left-hand sidebar menu, drag and drop the Inner Section option to create another subdivision into two columns, which we’ll use for links such as FAQs, Privacy Policy, etc.
- Click on the plus symbol again on the left column, and in the left-hand sidebar menu, drag and drop the Title option.
- We’ll write something like ‘Need Help?
- And align it to the center.
- Then, we’ll go to Style and change the color and font size.
- And we also change the font size.
- For example, 22 pixels.
- Let’s go back to the left sidebar, click here to view the modules, and drag the Icons List option.
- In this first column, we’ll add 3 typical links, such as About Us, Frequently Asked Questions, and Contact. Remember to add the links to your pages. Since I don’t have them created, I’ll leave them like this.
- Let’s delete the icons.
- Then, we’ll go to Style, and in the alignment section, we’ll center align the column.
- Now, let’s create a second column for legal pages, such as Terms of Use, Privacy Policy, and Cookie Policy.
- To do it faster, let’s delete the empty column and duplicate the column we have already created.
- In the title, we write Legal. And we change the names of the pages and links.
- We write Terms of Use, Privacy Policy, and Cookie Policy.
- Now, in the right section, we’ll place a newsletter subscription form, something that every online business should have.
- We click on the section, and in the left sidebar, we drag the Form option.
- We want a quick subscription form, so we’ll only leave the email field, a checkbox for privacy policy, and the subscribe button.
- In the email field, we uncheck the Label option, to make it look nicer.
- We add a new section for the privacy policy, and in type, we select the Acceptance option.
- We mark it as Mandatory, and paste the following code, which I’ll leave in the video description.
- Remember to replace it with the link to your privacy page.
- To change the text of the button, let’s go to the Button tab, and here, we type “Subscribe”.
- Now, let’s change the color of the button. We go to Style, Button, and I will use the same color as the titles.
- Speaking of titles, let’s also add a title to this section.
- We duplicate this title and give it a new name, for example, “Subscribe to the Newsletter”.
- Now, let’s center the entire section in the middle for a better look.
- We click on the section, and in Vertical Alignment, we select Center.
- Lastly, let’s add some social media icons.
- We click on the plus symbol, and add a new section.
- Now, we click on the plus symbol again, and in the left-hand sidebar, we drag and drop the Social Icons option.
- We add options for Facebook, Twitter, YouTube, and Instagram.
- Remember to paste your social media links here, otherwise, the icons won’t work.
- We select a circular shape for the icons.
- And in the Style tab, we’ll set a size of, for example, 12 pixels.
- To finish, let’s add a background color to the Footer.
- We select the section, go to the Style tab, select Classic background type, and configure the color using the color picker.
- For this occasion, I will paste the color code for the yellow from my website.
- Let’s do the same with the social media section. Go to the Style tab, select Classic background type, and configure the color you want in the color picker.
- Finally, let’s set some inner padding and margins to the Footer area.
- Select the section and go to the Advanced settings tab.
- In the Margin section, click on this button to unlink the values.
- Then, select the unit type E.M., and apply 2 E.M. top margin.
- Now, in the Padding section, do the same. Click on the button to unlink the values, select E.M. as the unit type, and apply 2 E.M. of padding top and bottom.
- Next, let’s do the same for the social media icons section.
- Click on the button to unlink the values, select E.M. as the unit type, and apply 2 E.M. of padding bottom.
- The last step is to publish the Footer. Click on the Publish button, and select to display it on the entire website, which is the most common option.
- However, if you want, you can exclude the Footer from certain pages.
- For example, in this case, let’s exclude the Footer from the posts.
- In other words, the Footer will be displayed on our entire website, except for the posts.
- Now, save and close.
- And now, if you go to the website, you’ll see that the Footer is displayed exactly as we have configured it.
- I hope you’ve learned how to create a Footer for your website with Elementor Pro. Now, it’s your turn to experiment.
- Remember to subscribe and visit Librenetworks.com if you want to save money on premium plugins and themes for WordPress.
