[Resolved] Custom Button color and logo link

[Asiya]

For this page: http://byasiya.com/illuminate-your-soul/
Is it possible to change the button color and customize the link to which you are taken when you push the logo at the top?

I added the custom logo using the elements feature to override the normal logo.

[Leo]

Hi there,

ARe you referring to the subscribe button?

[Asiya]

The password button. And the logo at the top of the page

[Leo]

Try this CSS:

.page-id-5223 input[type="submit"] {
    color: #fff;
    background-color: #000;
}

And this filter for the logo:
https://docs.generatepress.com/article/generate_logo/

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

[Asiya]

That worked!
Is it possible to also change the subscribe button colors too?
Or does that have to be universal since its part of the menu?

Also if I want this button color change to be applied to a series of pages, how should I do that?

Here is another page for example?
https://byasiya.com/illuminate-your-soul-day-1/

DO I just use your code and change the page-id-####? And if so where can I find the ####?

[Leo]

You can always target the page ID with the same CSS like:

.page-id-5223 .main-navigation:not(.slideout-navigation) .main-nav li.online-button a {
    color: #fff;
    background-color: #000;
}

To do multiple pages, it would be something like:

.page-id-5223 input[type="submit"],
.page-id-xxx input[type="submit"],
.page-id-xxxxnput[type="submit"] {
    color: #fff;
    background-color: #000;
}

You can see lots of instructions by Googling “How to find WordPress Page ID”.

[Asiya]

Thanks Leo!
And to batch the Page ID Subscribe button?
I tried use the comma method you described for the Submit button but it didn’t work.
Or does each have to be its own CSS code piece?

[Leo]

It would be like this:

.page-id-5223 .main-navigation:not(.slideout-navigation) .main-nav li.online-button a,
.page-id-xxx.main-navigation:not(.slideout-navigation) .main-nav li.online-button a,
.page-id-xxxx.main-navigation:not(.slideout-navigation) .main-nav li.online-button a {
    color: #fff;
    background-color: #000;
}

[Asiya]

Thanks LEO!! Appreciate your help!!! Have a wonderful rest of your week. thank you.

[Leo]

No problem 🙂

[Author]

Posts