[Resolved] Risk warning at the bottom of each page

[Chris]

Hi,

One of my websites is about CFD trading and my partners want me to add a risk warning at the bottom of each page that’s always visible.

Here’s an example: https://www.ig.com/nl/welkom-bij-ig (might need to use a VPN with a Dutch IP, not sure)

Here’s a screenshot:

Any suggestions on how to accomplish this? Preferably without plugins.

Cheers

GeneratePress 2.2.2

GP Premium 1.7.8

[David]

Hi there,

you can use a Hook Element:

https://docs.generatepress.com/article/hooks-element-overview/

The after_footer hook will place it there.

Just add your HTML. If you want to style it so the content remains contained you can wrap it like so:

<div class="disclaimer-container">
    <div class="grid-container">
        <!-- your HTML -->
    </div>
</div>

the grid-container class does the containment. And you can use the custom disclaimer-container to style it with some CSS.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Chris]

Awesome David, yes I have the disclaimer at the bottom now using this code. Now I want it to be visible at all times, so it added this CSS (I’m a noob when it comes to that)

.disclaimer-container 
{
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: white;
  color: black;
  text-align: center;
}

It’s stays visible now, but it overlaps the footer/copyright as you can see on the site. Can you help me with that please?

[David]

You can add some margin to the bottom of the body to match the maximum height of the disclaimer-container:

body {
    margin-bottom: 40px;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Chris]

YESSSS. You’re my hero David! And as always thanks for this great theme.

[David]

Glad to be of help 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts