A page with good aesthetics allows you to keep visitors on it longer. Therefore, you don't just have to know the SEO, but also good taste on a visual level, which will ensure that your page is among the first results on the web.
The fact that you can put on a good page, know how to make a good one landing page or having a professional logo always makes a big difference. In reality, the best changes are in the small details, so why not be able to care about these?
This is why we can spend hours deciding between the best songs to choose from. Among these, in addition to being one of the most popular there is Divi, and with good reason. Visually it's a very nice subject, plus it makes it highly professional to see your page with a design.
Therefore, you should take advantage of this tool and being able to give importance to the small details, as we said before.
With the latter in mind, you may be interested in designing a footer, or a footer, for your page, so that it ends with a little detail at the end of each page so that it looks nice. See below how you can do it.
Create a beautiful footer in Divi
Creating a footer in Divi is actually a very simple process. It may seem a bit complicated at first, but over time it is possible to get carried away. All you need to do is to follow step by step:
- Start by entering the theme customizer you have in WordPress. Here, you have to enter the part that says "Cake", Then «Bottom bar» and then the «Background color» part. Here we can see some controls for the footer background color.
- We will have to make it transparent. We can achieve this by setting rgba to 0,0,0,0 However. Note that you can change it depending on the background color you will be using and the colore of the character.
- Now, we are going to devote ourselves completely to creating the footer as such. For that, we're going to go to the visual builder of Divi. Here we will click on the button Create from scratch. Then it will ask us for the lines we will use and we will just press the option to use one. It will then ask you for the form to use, but we won't use any.
- Then they subtract the row settings. We will have to make some changes regarding the separation that we will leave with a edge custom 0px at the top and 0p at the bottom. Also, we will leave the custom desktop padding at 80px above and at base e 100px above ea Base on Tablet.
- On the other hand, in the Design tab, we should have a custom margin of -55px in Base and a custom padding of 0px in Top and Base. We will continue with the Dividers in the Basic part. We will just have to add the color we want, as well as the separator style we want to use.
- Now we just have to go to the Advanced tab and add some CSS code so that the text is not behind the background. In CSS customized, in the Main Element screen we will insert "Z-index: 0;". Now you can only save the section in the library to reuse it whenever you can within Divi.
Set the footer
A very common mistake that occurs with the footer in Divi is that it goes up to places where it shouldn't. To solve this problem, in the custom CSS, we will add the following code:
/ * Set DIVI Footer * /
# main footer {
position: absolute;
bottom: 0;
width: 100%;
}
TagsTutorial
