Footer/Footer Widget Display Modifications

BB Theme
1

Hello,

I have 2 questions regarding the footer/footer widget display area. First, is there a way to display the footer widget on all pages EXCEPT the homepage? I only see 3 options (disable, include on all pages, and include on homepage only).

Secondly, how do I go about changing the height of the footer widget display area? I have an image I’m using in the background in the footer widget area and in order for it to display the entire image I need the height to be 520px (the overall image is 1200 x 520). It is not a typical footer, hence the need. Is this possible?

Thanks in advance for any help/suggestions with the above.

Kelly

2

Hey Kelly,

Thanks for getting in touch! You can try these CSS snippets. For hiding the widgets on the homepage, just set the widgets layout to show on all pages. The snippet below will hide it on the homepage.

/*Hide footer widgets on the homepage*/
.home .fl-page-footer-widgets {
  display: none;
}
/*Set widgets area height*/
.fl-page .fl-page-footer-widgets {
  height: 520px;
}

Hope this helps!

Ben

3

Thanks Ben. That works! Couple more questions…is there a way to remove the border on the footer widget area so that it blends seamlessly with the content area above?

On an unrelated note, is there an easy way to add custom bullets in lieu of the standard bullets? Specifically, I’d like to add an image. I saw something online that looks like this:

}
/Set custom bullets/
ul.leaf {
list-style-image: url(‘/images/leafbullet.png’);
}

Is there a way to modify the above code to work with beaver builder?

4

Hey Kelly,

You can use this CSS snippet to remove the top border.

/*Remove top border on the footer widgets part*/
.fl-page .fl-page-footer-widgets {
  border-top: none;
}

Just remove the .leaf part and that should make it work to all unordered lists(ul’s). :slight_smile:

Edit: Make sure you edit the URL where the image is located on your new site.

Ben

5

You guys ROCK! Thank you so much!!

6

No worries! Have fun with The Beaver! :slight_smile:

Ben

7

Ben,

Once last question (sorry!). I added some code to include a clickable button in the footer widget area. The button works fine on mobile devices and Safari (I’m on a mac) but the link does not work in Firefox. Any suggestions? Here’s the code I added:

<button type=“button”>Send Us A Note</button>

8

[Content Hidden]

9

Never mind, I just found a solution :
For WPZOOM users (social medias icons) if your footer is way too big like it was on mine :
add this custom css on the theme :


.fl-page-footer-widgets {
  margin : -60px;

}

In the plug in find social-icons-widget-by-wpzoom/css/socicon.css

on inline icons, set top : -22px;

Done.

10

[Content Hidden]

11

Hi Yanis,

Would it be possible for you to create your own topic regarding this issue, please? The reason for this is that if Kelly has subscribed to this topic which is likely. She will now be receiving notifications for each of your replies. However, we do appreciate you searching the forums prior to creating your own topic. :smiley:

Also, when you create your own topic, can you also remove any custom CSS you have added related to those social icons. Then we should be able to assist and get your issue resolved.

Thanks,
Danny