Gradient menu / content / footer

Hi Matthieu,

Are you trying to add it as the background of the entire page?

Is it a static page or archive page or others?

You can use Chrome's developer tool to find the CSS class ( when on the page, press F12).

Take the screenshot below as an example, for this page, you can use

body.page-id-2  {
 your-css;
}

https://www.screencast.com/t/S1bZdlhbX5s

Please be noted if there're colors set for content/menu/footer/header, then the body background will be covered by those colors.

Let me know if you need further assistance :)

Hello, thank you for your answer.

Exactly, as the background of the entire page, menu and footer included

I tried this: body.page-id-41
{
background: rgb (255,236,0);
background: linear-gradient (45deg, rgba (255,236,0,1) 0%, rgba (242,145,0,1) 25%, rgba (229,0,126,1) 50%, rgba (10,23,240,1) 75 %, rgba (0.189,255.1) 100%);
}

But no changes ...

Thanks 😃

As I said in my previous reply:

Please be noted if there’re colors set for content/menu/footer/header, then the body background will be covered by those colors.

You'll need to set those elements' background color to transparent as I did in the video, so that the body background will show.
https://www.screencast.com/t/hbymA72UL

You can set those colors in Customizer > colors, but the changes will apply to the entire site,

If you only want the changes to remain on this page, CSS will be needed.

Let me know if you need help with the CSS :)

Thank you very much for your answer, indeed I would need the css to modify the transparency only of this page...

Thanks 😅

Try this CSS:

.page-id-41 .site-header, .page-id-41 div#page, .page-id-41 .site-info {
    background-color: transparent !important;
}

Let me know if it works :)

It's perfect, thank you !

Is it possible to make the outline of the menu items transparent as well?

And last question, is it possible to change the logo on the left only on this page ?

Thanks a lot

Hi there,

Go to Customizer > Colors > Primary Navigation and change menu item background color.

Just to confirm, do you want a different logo image on the Contact page ?
If so you can use the generate_logo filter:

https://docs.generatepress.com/article/generate_logo/

Your PHP Snippet would be something like this:

add_filter( 'generate_logo', function( $logo ) {
      // Return our category logo URL
    if ( is_page(41) ) {
        return 'URL TO YOUR CATEGORY LOGO';
    }

    // Otherwise, return our default logo
    return $logo; 
 } );

The 41 is the ID of your Page ( you can check this is correct by editing the page, and looking in the browser URL ).
And you need to replace the URL TO YOUR CATEGORY LOGO with the full URL to the new image.

Document on adding PHP: https://docs.generatepress.com/article/adding-php/

Everything is perfect ! Thanks a lot ! 😃

Glad we could be of help