[Resolved] White menu dissolving in background

[Swadhin]

Hi there,

I want a white menu on my site (as per brand) but it gets mixed up with the white background of the site. Can you please help me in getting a shadow effect (like this blog) so that it subtly differentiates from the rest of the site?

Thanks

[David]

Hi there,

Some CSS like this:

.main-navigation {
    box-shadow: 0 0 48px rgba(50,76,128,0.05);
}

[Swadhin]

This worked like a charm David. Thanks a ton.

One thing that worries me is, I am not seeing the CTA button in the menu on the mobile version. It just has the plain text not the button design.

Best,
-Swadhin

[Leo]

That’s because the CSS is wrapped in desktop only media query:

@media (min-width: 769px) {
    .main-navigation .main-nav ul li.nav-button a {
        background-color: #15c39a;
        border: 1px solid #15c39a;
        line-height: 45px;
        border-radius: 50px;
        color: #ffffff;
    }
}

Try removing the @media (min-width: 769px)

More info here:
https://docs.generatepress.com/article/responsive-display/

[Swadhin]

Thanks Leo, it worked like a charm again.

Leo, I am trying to add WPShowPosts (in a page) on my blog page. Will creating pagination using the setting in WPSHowPosts create duplicate content issues?

Also, is creating a blog page with WPShowPosts SEO friendly? Would you recommend it over a normal blog page?

Leo, is it possible to create an unlimited scroll button like this blog (in design) for a page using WPSshowPosts?

best regards,
-Swadhin

[Leo]

Any chance you can open a separate questions for the new questions so we can mark this one resolved?

Thanks!

[Swadhin]

Sure.. Done!

[Leo]

Thanks 🙂

[Author]

Posts