Source: https://divicake.com/blog/how-to-make-a-custom-footer-in-divi/ [Blog](https://divicake.com/blog/)/[Tutorials](https://divicake.com/category/tutorials/) # How to Make Your Custom Footer in Divi: Step-by-Step Guide By Divi Cake·19 January 2024·Updated 15 January 2026·6 min read Step-by-Step Guide to Make Your Custom Footer in Divi We may earn a commission from affiliate links in this post. [Disclosure policy](https://divicake.com/affiliate-disclosure-policy/) On this page - [Step-by-Step Process to Make Custom Footer in Divi](https://divicake.com#step-by-step-process-to-make-custom-footer-in-divi) - [Add a Row](https://divicake.com#add-a-row) - [Add a Button](https://divicake.com#add-a-button) - [Add More Content to the Footer](https://divicake.com#add-more-content-to-the-footer) - [Add Social Links](https://divicake.com#add-social-links) - [Conclusion](https://divicake.com#conclusion) The [Divi Theme Builder](https://divicake.com/blog/divi-theme-builder-overview/) by [Elegant Themes](https://divicake.com/go/elegant-themes-home-page/) is an excellent tool that helps us make websites in a new and easy way. Still, some people face difficulties making custom footers using Divi Theme Builder. So, we will go through a detailed procedure to design a custom footer for your website using [Divi](https://divicake.com/go/divi/). ## Step-by-Step Process to Make Custom Footer in Divi You can pick a Footer from the [Divi Marketplace](https://divicake.com/go/divi-marketplace/) or make one from scratch. We will show you how to create a custom footer using Divi theme builder. So, without wasting much time, let’s dive in and start. As we are going to build a custom footer, follow these steps to get the desired outcome: - Go to the [Theme Builder](https://divicake.com/blog/divi-theme-builder-best-practices/) in your [Divi Theme Options](https://divicake.com/blog/getting-started-with-divi-theme-options-builder-tab/). - Click on the “Build Global Footer.” Click on the build global footer Build Global Footer - Click on “Build From Scratch.” Click on “Build From Scratch” Build From Scratch Add a Background Color to the Section You can add a background color that suits you (e.g., black color) while making your own custom footer in Divi. To add Background color to the footer, follow the following steps: - Click on the gear icon. - Then click on the background. - Afterwards, click on the plus button. - Then, add any color of your desire as your primary color. Add Background Color Read More: [A Look at Divi’s New Global Color System](https://divicake.com/blog/a-look-at-divis-new-global-color-system/) Now, you can add margins to your custom footer. To add some Margins of your own choice to your custom footer section, follow these steps: - Go to the design tab in the Sections Settings window. - Then click on “Spacing.” - Then add margins to the top, bottom, left, and right according to your choice. You can assign them any size you want by simply putting the value in the box. Now, you can add some padding to your custom footer. To add padding of your own choice, follow these steps: - Go to the design tab in the Sections Settings window. - Click on “Padding.” - Add padding to the top, bottom, left, or right, according to your choice. You can assign them any size you want by simply putting the value in the box. Add Margins and Padding of your own choice to your custom footer section Add Margins and Padding of Section Read More: [Getting Started with Divi: Advanced Settings](https://divicake.com/blog/getting-started-with-divi-advanced-settings/) Now, you can add borders to your custom footer. To add borders of your own choice, follow these steps: - Go to the design tab in the Sections Settings window. - Click on borders. - Add borders to the top, bottom, left, or right according to your choice. You can assign them any size you want by simply putting the value in the box. Add borders of your own choice to the custom footer section Add borders to the custom footer section Now, you can add a box shadow to your custom footer. To add a box shadow of your own choice, follow these steps: - Go to the design tab in the Section Settings window. - Click on “Box Shadow.” - Add any sort of design to your box shadow as you want. You can adjust it by simply adjusting the options below (e.g., blur settings). Add a box shadow of your own choice to the custom footer section Add box shadow to the custom footer section Now, you can save your margins, padding, borders, and box-shadow settings. Learn More: [Getting Started with Divi: Design Settings](https://divicake.com/blog/getting-started-with-divi-design-settings/) ### Add a Row Now, it’s time to add a row to your custom footer. To add a row to your footer, follow these steps: - Click on the plus icon. It’ll show you an “insert row” window with two options (New Row, Add from the library); you need to select the “new row” option because you are adding a custom footer. - Add a single row. Add a row to the custom footer section by clicking on the plus icon and selecting a new row Add Single Row Now, it’s time to add a text module in the column**.** To add a text module, follow these steps: - Find the text module or search for “Text,” and the text module option will pop up. - Add any type of text that you want in the text box given in the “Text Settings” window. - Design the text as you want from the design tab in the “Text Settings” window. Add a text module in the column of the custom footer section Add a text module You can add the following things to the text in the Design Tab: - Text - Heading Text - Sizing - Spacing - Border - Box Shadow - Filter - Transition You can assign the text as a title or as a sub-title. You can also insert a link into the text, color it as you want, and many other options in the same “text settings” window. You can also edit the text size for different devices (e.g., mobile, tablet). Customize the text module from the design tab in the “text settings” window Customize the text module Read More: [Getting Started with Divi: Using Divi Layouts](https://divicake.com/blog/getting-started-with-divi-using-divi-layouts/) ### Add a Button Now, it’s time to add a button to your custom footer. To add a Button module, follow the following steps: - Click on the plus icon. - Search for a button module and add one. - Name your button by editing the text box in the content tab of the “Button Settings” window. - Design the button module (e.g., [hover options](https://divicake.com/go/divi-hover-options/), button size, [different fonts](https://divicake.com/blog/divi-fonts/)) as you want from the design tab in the “Sutton Settings” window. - You can also put a link to the button as well. Add a button module to the custom footer section and customize it Add a button module to the custom footer section Learn More: [How To Add A Button To A Divi Blurb Module](https://divicake.com/blog/how-to-add-a-button-to-a-divi-blurb-module/) When you are done setting up your button module, save your work and move on to the next step. ### Add More Content to the Footer If you want to add more content to your footer (e.g., pages like Contact Us, About Us, and Careers), don’t forget to perform the following steps: - Add a section and customize it. - Add a column and customize it. - If you are adding two or more products, services, or pages, don’t forget to add and customize a separate column for each product, service, or page. - You can keep the same settings for a column by simply copying the column and editing its content. - Add a module (e.g., button module) and customize it. - When you are done, save your work by clicking the tick symbol on the bottom left. I’ve already described these steps above in detail. Add a section to the custom footer to add more content to the custom footer Add more content to the custom footer Read More: [Getting Started with Divi: Content Settings](https://divicake.com/blog/getting-started-with-divi-content-settings/) ### Add Social Links If you wish to add [social links](https://divicake.com/blog/monarch-by-divi-for-social-media/) to the custom footer, follow the following steps: - Add a section and customize it. - Add social icons to this section. - Add a column and customize it (I’ve already described above how to add a column). - Insert the “Social Media Follow” module (I’ve already described above how to add a module). - To add links, go to the content tab of your “Social Media Module Settings” window. Put links to your social media follow module by clicking the gear icon. - If you want to reset the colors of your social media icons to your default column background color, right-click on the social media icon name in the content tab of your “Social Media Module Settings” window. And choose “Reset Item Styles”. - If you don’t want to reset the colors, let them be. - Customize the social media follow module from the design tab of your “Social Media Module Settings” window. Add social links to the custom footer section by searching and adding the “social media follow” module to the custom footer Add Social Links to the custom footer Read More: [How to Add Custom CSS to Divi](https://divicake.com/blog/how-to-add-custom-css-to-divi/) ## Conclusion Divi Theme Builder makes it easy to create awesome custom footers. You can add any content to your footer by simply adding [modules](https://divicake.com/blog/divi-modules/) and columns to sections and customizing them. You can save time and make stunning websites using Divi’s features. Learn More: [3 Ways to Customize the Divi Header](https://divicake.com/blog/customize-divi-header-layouts-plugins-tutorials/) ## Written by Divi Cake Divi 5 tutorials, layouts and fixes from the team that builds Divi sites every week. - [About Divi Cake](https://divicake.com/about/) ## Submit a comment Comments are read before they appear. Your email is not published. Comment NameEmail Company website Submit commentSubmit commentSubmit comment The comment form needs JavaScript for its spam check. Thanks. Your comment is waiting for review and will appear here once it is approved. ## Do you need help with … - [Divi websites](https://divicake.com/divi-website-development/) - [Divi plugins](https://divicake.com/divi-plugin-development/) - [Fix a site](https://divicake.com/fix-existing-site/) - [Beyond Divi](https://divicake.com/beyond-divi/) - [Technical SEO](https://divicake.com/technical-seo/) - [SEO content](https://divicake.com/seo-content/) ## Save Annually on Divi [Save 69% on Divi VIP](https://divicake.com/go/divi-vip/)[Save 69% on Divi Cloud](https://divicake.com/go/divi-cloud/)[Save 69%, Divi Team](https://divicake.com/go/divi-teams/) ## WordPress Hosting & Tools [100% off on Kinsta for 1 Month](https://divicake.com/go/kinsta/)[Get up to 62% off Bluehost hosting.](https://divicake.com/go/wordpress-hosting-blue-host/)[Save Up to 15% on Rank Math](https://divicake.com/go/rank-math/)[Get 50% OFF on all WPForms plans](https://divicake.com/go/wpforms/) ## More in Tutorials [ How to Undo AI Changes on a Divi 5 Site Tutorials2 min read ### How to undo AI changes on a Divi 5 site Undo what Claude or ChatGPT changed on your Divi 5 site: colours, presets, Theme Builder templates and pages, in one prompt or from the Revisions screen. 10 October 2026](https://divicake.com/blog/undo-ai-changes-divi-5/) [ How to Rebrand a Divi 5 Site with AI Tutorials2 min read ### How to rebrand a Divi 5 site with AI: global colours and button presets Change a Divi 5 site's brand colour and every button preset with Claude or ChatGPT: start with a dry run, answer its questions, apply, then check. 8 October 2026](https://divicake.com/blog/rebrand-divi-5-site-with-ai/) [ How to Rewrite Divi 5 Page Copy with AI Tutorials2 min read ### How to rewrite a Divi 5 page's copy with AI without changing the design Rewrite every line on a Divi 5 page with Claude or ChatGPT in one prompt, then check that the colours, spacing, widths and links did not move. 6 October 2026](https://divicake.com/blog/rewrite-divi-5-page-copy-with-ai/)