Elementor 2.0 is here, and now you are no longer limited to edit just the content area of your website and don’t have to rely on your WordPress Theme to have the desired header/footer either. Thanks to Elementor, you can design that yourself and that too without touching a single line of code!
Just like Header, the Footer is an integral part of every website. In this article, we will learn how you can create a custom Footer using Elementor.
Creating a Custom Footer Using Elementor
Creating a Footer with the Elementor is very easy. You need to follow the steps given below 😉
Step 1: First, Login to your WordPress website and go to WP Admin > Elementor > My Templates.
Step 2: Click on the Add New button and select the type of template as Footer. Give it a Name and click on the Create Template button.
Step 3: On the next screen, you can select from the existing Footer Templates offered by Elementor or you can close this box and start fresh. Select the one you want and click on the Insert button.
Step 4: Now comes the editing part. Here, we will change the test, typography, and other styling options like we usually do on the Elementor page builder.
Step 5: Change the text in the Icon list and add the respective links to the list items. If you find any list item which is not applicable, then you can easily remove it using the (x) button on the right. You can add desired icons to the list items as well and can change the way they look using the Style tab.
Step 6: For the Newsletter subscription box, add your Email ID in the settings and change the click action of the submit button as per your wish. You can opt for directly sending an Email, or you can connect it to any Email service such as Active Campaign or MailChimp. You can also add or remove fields on the form as required.
Step 7: Now you need to add the social sharing links to the icons at the bottom. For that, click on the widget that will allow you to edit the Social Icons. Click on each icon list to add the social sharing link under the link field.
Step 8: You can also add another widget to the footer if you want by simple drag and drop operation like you do while designing a page or a row. After making all the changes, click on the Publish button on the bottom left corner of the page.
Step 9: When you click on the Publish button, you will be asked to add some conditions to the page. These conditions define where your footer or any other theme parts will be displayed. Since I want this footer to show up on the Entire Site, I will select the same from the list.
Step 10: Once, you have defined your conditions, click on the publish button.
After all the changes and setting the conditions, this is the result. An informative footer with a newsletter subscription box-
Summing Up!
This was it for the footer. You can try other footer template designs as well, or you can design your footer from scratch as well!
Footer was just the tip of the iceberg. You can design Archive Pages, Single Posts, Headers, etc. with a single tool – Elementor. Get this tool here.
If you liked this post, do share it and if you get stuck anywhere, leave a comment down below, and I will get back to you ASAP!
5 thoughts on “How to Create a Custom Footer Using Elementor?”
Thanks for tut. Might be good to mention that the templates are only available with Elementor Pro, not the free version.
I did it without using a premade template, but when I published as entire site, it didn’t show up. Not sure what I did wrong, it seemed pretty straight forward.
Any suggestions?
Hi, how do you change the link color in the footer? Right now elementor is using my sitewide color, but it looks terrible on my footer color.
I have the same question. Thanks for any help on this!
You might also want to mention that you cannot use an elementor footer without also using an elementor header… that’s one of the bigger drawbacks. For anyone reading, be prepared for your themes header to disappear as soon as you enable the elementor footer.
Hi there,
This is something new to me. Thanks for the information. 🙂