It’s easy in an effort to upload your internet web page’s logo to any footer made with the Divi Builder. On the other hand, for many who most simple display it as an image, you’d want to edit your footer each and every time you changed your logo. The solution is to use a dynamic logo. A dynamic logo changes to test the internet web page’s logo mechanically. In this article, we’ll see add a dynamic logo to your Divi footer.
Let’s get started.
1. Create New Footer Template
Go to Divi Theme Builder & Add New Global or Custom designed Footer
It doesn’t make any difference for many who assemble the footer from scratch or download probably the most necessary free templates for this tutorial. You’re going to most simple want to make sure to include an image module. We’ll use this image module to connect to the dynamic logo.
Download a Footer Template
For my examples, I’m the usage of the free footer for Divi’s Immigration Lawyer Layout Pack. The Chic Topic issues blog incorporates numerous free footer templates. To find them throughout the blog by way of entering “free header & footer” throughout the blog’s search box. Download the template to your laptop and unzip the file. You’ll want to upload the JSON file, no longer the zipped file.
Upload the Footer Template
For this tutorial, we’ll use the Divi Theme Builder to make use of the footer to each and every internet web page and submit. You’ll be capable of upload the template to the Theme Builder or use a template from your Divi Library. So as to add to the Theme Builder, transfer to the Divi Theme Builder throughout the Divi menu and make a selection the Portability selection throughout the upper correct corner. That’s the icon with the up and down arrows.
You’ll then see a modal with quite a lot of possible choices. Choose the Import tab throughout the modal. Navigate to and make a selection the JSON file from your laptop. Choose any of the decisions you want. I’m leaving it at the default possible choices. Next, make a selection the import button. Sit up for the import to finish.
Next, delete the header file for many who don’t want to use it and click on on to save lots of loads of your changes. You right now have a global footer. Should you’ve used the template that I used, you’ll have a static logo already in place. We’ll want to make it dynamic. If your template doesn’t include an emblem, simply add an image module.
Next, click on at the Edit icon on the footer to open the template.
Industry Means: Loading from the Divi Library
Alternately, you’ll be capable of upload the structure to your Divi Library. Then, throughout the Divi Theme Builder, you’ll be capable of click on on in an effort to upload a global footer and make a selection it from your library.
Whilst you click on on in an effort to upload a global footer, you’ll be in a position to choose to build the global footer from scratch or make a selection it from the library.
2. Add a Dynamic Logo
Add a Logo
If the template you’re the usage of does no longer include an emblem, add an image module where you want the logo to seem. Go away Open in Lightbox disabled (that’s the default surroundings). For the URL, you’ll be capable of pass away it blank or add your homepage URL to make it clickable.
- Open in Lightbox = No
- Image Link URL = Go away blank or add homepage URL
Open the Design tab. Underneath spacing, pass away Show Space Underneath the Image enabled (that’s the default surroundings). Underneath Margin, add 50px to the bottom margin.
- Show Space Underneath the Image = Certain
- Margin – Bottom = 50px
Dynamic Image Settings
The structure that I’m the usage of already incorporates an emblem image, so I can customize this image module. It’s prepare with the identical adjustments we spotted throughout the previous segment.
First, we’ll want to delete the image that it already has. Hover over the image and click on at the rubbish can icon when it seems that. The reset icon to its correct will also art work.
Now, when you hover over the image space, you’ll see the icon to choose dynamic content material subject matter. Choose this icon.
A modal will appear with numerous possible choices that pertain to your content material subject matter. Choose the third selection from the perfect: Site Logo.
- Site Logo
Your internet web page’s logo will then display throughout the image module. It’s that easy.
3. Save All Template and Theme Builder Changes
Whilst you’ve modified the logo with a dynamic logo, you’ll want to save the changes for it to take affect all through your internet web page.
Click on at the Save button throughout the Visual Builder menu and then click on at the X throughout the upper correct corner to head out the builder. Now, any logo that’s set since the internet web page’s logo throughout the Divi Theme Possible choices will mechanically display in this image module.
Preview Your Dynamic Logo
Proper right here’s how the dynamic logo appears to be on desktop and mobile presentations. I most simple had to industry the logo throughout the Divi Theme Settings computer screen.
Proper right here’s how the dynamic logo appears to be on a desktop. The logo throughout the footer fits the logo throughout the header.
Proper right here’s how the dynamic logo appears to be on mobile.
Changing the Site’s Logo
To use a distinct logo in your footer, simply industry the internet web page’s logo. Go to the Divi Theme Possible choices throughout the Divi menu. Click on at the Upload button to select a brand spanking new logo and save the changes. Your new internet web page logo will industry, and your footer’s logo will are compatible it.
- Divi > Theme Possible choices > Fundamental tab > Logo
- Upload new logo
That’s our take a look at add a dynamic logo to your Divi footer. And no longer the use of a dynamic logo, you’d have to switch the footer’s logo manually if you want to have it to test the internet web page’s logo. A dynamic logo fits the internet web page’s logo mechanically. We will be able to industry the logo in one place, and it’s mechanically applied to the footer of each and every internet web page or submit that uses a dynamic logo.
We want to concentrate from you. Do you employ dynamic logos in your Divi footers? Let us know about it throughout the comments beneath.