Let’s get to the configurations of the footer bottom section. Navigate to your website admin, browse to Appearance > Customize > Footer Bottom.
Enable Footer Bottom
First things first, you need to enable a footer to be able to see the footer and its settings.
You can enable it by checking the input box next to the “Enable Footer Bottom” label in the Footer Bottom panel.
The visibility setting configures the footer to be seen on certain devices. Following options are provided to choose from.
- Show on All Devices
- Enables the footer to be seen via all mediums without any limitation at all.
- Hide on Tablet
- Disables the footer to be seen browsing from tablets.
- Hide on Mobile
- Disables the footer to be seen on mobile.
- Hide on Tablet & Mobile
- Hides the footer on both tablet and mobile, be it any kind as the screen size defines the medium.
Just click over the dropdown under the “Visibility” label in Footer Bottom panel to select one of the four given options.
Please don’t confuse the footer widgets with footer bottom. The footer widgets section is covered earlier in another article. With this option, you can add text to the footer.
- Terms of Service
- Avoori (in case you want to note that your website is powered by Avoori to gain customer trust with your brand).
Just find the textarea under the “Content” label in Footer Bottom panel to add content to footer.
You can easily add spacing to make footer look bigger, more noticeable or just to blend well with the design overall.
You get four input boxes to add Top, Right, Bottom, and Left padding respectively. These are available under the “Padding (px)” label in Footer Bottom panel.
The fifth is a chain icon that links these four inputs together. So if you want to enter the same padding, click over the chain link and enter a number in any input. It would automatically update the rest of the inputs.
You can change the background of the footer in a few clicks. Just click over the “Select Color” button under the “Background Color” label in the Footer Bottom panel to change the color to your preferences.
For footer bottom background, a relatively lighter color is used. Unlike the footer widgets where most businesses use a contrast color that’s darker to make the widgets and links readable.
If you have changed the background color, you might want to change the text color to make the text readable. Otherwise, you may want to change the text color to blend with the design.
In any case, you can easily change the text color. Just click over the “Select Color” button under the “Text Color” label in the Footer Bottom panel to change text color.
You might as well want to change the color of the links for the footer bottom.
To do so, simply click over the “Select Color” button under the “Links Color” label in the Footer Bottom panel to change text color.
Links Color: Hover
Use this setting to change the color of the links when someone mouse-over the link.
Click over the “Select Color” button under the “Links Color: Hover” label in the Footer Bottom panel to change hover color for links.
Enable Top Border
A top border will be added to the footer bottom.
To enable the border, just click over the checkbox next to the “Enable Top Border” in Footer Bottom panel.
Top Border Width (px)
You can customize the width of the top border in pixels, to either expand or contract as per your design needs.
Just use the slider available under the “Top Border Width (px)” label to increase or decrease the border width.
Top Border Color
The color of the border can be changed as well to suit your design.
Just click over the “Select Color” button under the “Top Border Color” label in the Footer Bottom panel to change text color.