Use a child theme to set a global footer that works on blog post pages in Divi

by | Aug 4, 2019 | Divi, Web Dev | 0 comments

Step 1: Save a footer layout as global library element and locate its post ID number: 

1. Create a footer layout section on your page and save it as a global library element.
2. Goto Divi > Divi Library, and select/edit the new global library element you created above.
3. Once you are on the edit screen for the footer library element, look at the URL of the edit page in the browser ULR field and note the post ID number (ie. “post=NUMBER”)… in this case the number is 177.

Step 2: Install the Orbisius child theme creator plugin and create a child theme:

1. Goto the Plugin tab in WordPress and click Add New at the top of the page.
2. In the search field at the right, search for “orbisius”.
3. Install the plugin “Child Theme Creator by Orbisius” and activate it.
4. Navigate to Appearance > Orbisius Child Theme Creator.
5. Here you can see available parent themes to make a child theme of. Find Divi and check mark “Switch theme to the new theme after it is created”. Then click “Create Child Theme”.
6. Now, if you go to Appearance > Themes, you’ll see that your new Divi Child Theme has been created and is activated.

Step 3: Add PHP to your child theme to implement the global footer that will work on all pages as well as custom post types (like blog post pages).

Now that the child theme is installed, we can make adjustments to it to have more control over our site without messing up the main divi theme.

1. In the top wordpress bar, look for the new “Orbisius” drop down and select “Orbisius Theme Editor”.
2. In the Theme Editor you will see an edit box at the top left (Theme #1). Here you will see that “Divi Child Theme of Divi” is selected on the first dropdown, and to the right of that it has “style.css” selected as the File. Under the File selector, select “functions.php” instead.

3. Once you select “functions.php” you will see “<?php” in the top line of the edit box, followed by a bunch of comments and PHP code from the Child Theme creators.
4. Place your curser right after “<?php” and enter a few returns to make some space between it and the comments and code below it.

5. Now, in the space you’ve made, paste the following code:

7. Look for the three X’s … “XXX” in the above code, and replace it with the post ID number we found in Step 1 of this tutorial. When you’re finished, your code should look like this:


8. Once that’s in place, click Save Changes below the edit box.

Finally, when you review your pages and posts they will all have the same global footer that properly displays across the width of the browser. To make changes to your footer, go back to Divi > Divi Libraries, and edit your global Footer from its edit page.

Wilmington, NC


    
    

(910) 632-0981

© 2019 dboy Creative. All rights reserved.