UPDATED 11/16/18 – With the introduction of Divi Hooks, we can now inject that layout into the footer without having to modify any php template files. All we have to do is add a simple snippet of PHP to your functions.php file. While the method in this tutorial still works great, if you want to learn more about Divi hooks, head on over to my newest tutorial here: https://quiroz.co/inject-a-layout-from-your-divi-library-into-your-footer-using-divi-hooks/
Original Post Below
Divi allows you to create cool footers using the Page Builder and with it’s Global Templates, you only have to make changes in one place.
But unfortunately you still have to add that footer to each page and there is no built option for it to appear on post pages, archive pages and category pages until now.
In this tutorial I am going to show you how easy it is to inject that saved footer section into every single page using php and without ever having to actually manually add it to each page individually.
**To do this you will need a basic child theme.
Let’s Get Started
Subscribe To Our You Tube Channel: https://www.youtube.com/channel/UCzSgj2oG27jEhyaxOgYVJiQ
Creating the Footer Section
Now we are going to create a footer section and save it to the Divi Library.
1. Go to your Divi Library and select Add New.
2. Give the template a name and make sure to select “Section” as the Template Type.
3. Now go ahead and create the footer section of your choice. In my example, I gave it a purple background and added several rows and modules.
This is what my example looks like.
Inserting the Footer Section into the PHP template
Now we are going to grab the header shortcode and insert it into the footer.php page with a little PHP snippet.
4. The first thing you will need to do is go into your Divi Library and open up the saved layout.
5. Once you have the layout open, check out the URL and you will see a sequence of characters and numbers. You are going to want to grab the numbers as we will need that for the next steps. For example in my case, the number sequence that I want to grab is 207988. This is the URL: http://montereydev.com/demos/tophead001/wp-admin/post.php?post=207988&action=edit
6. Go to Appearance> Editor and on the right you will find the footer.php that you added to your child theme earlier. Go ahead and open that up.
7. Find this line of code:
Just underneath that line of code you will be adding this new snippet of code. And then replace the number 207988 with the number from your header section.
Unfortunately, my Syntax plugin does not know how to read the shortcode without messing up this page so you will have to write the code yourself or grab the snippet from this rich text format file.
BOOM!!!! You have just injected your Divi Page Builder Footer Section into every single page on your website. Nice work!
Well, that’s all for now. I hope you find this article useful.
Latest posts by Geno Quiroz (see all)
- Elegant Themes Founder Nick Roach: We Want To Flip the Script and Make Divi the Fastest Page Builder Around - April 9, 2021
- Hover Over Blurb To Reveal Hidden Rows in Divi - December 29, 2020
- Vertical Align Columns in Divi - December 29, 2020