Buttons at post pages

How I can change the style of the buttons at the post pages?
(Comment, prev. post, next post)

Thanks an best Regards!

Hello there,

At this time, we can only be able to change it with CSS code. To help me write the correct code that resulting exactly like you wanted, do you have a mockup design to share here?

Regards,
Kharis

Hello Kharis,

for me it would be enough if you could tell me how I can edit the buttons via css, so you dont have to wirte a code.
My problem is e.g. when I try to change the color of the buttons, I would use this code:

    .button {
    	color: #9bad96 !important;
    }

(or .button:hover for the hover option)

but this code doesn’t work for me.

Regards,
Tobi

I tried

    body.single.single-post .button {
    	color: #9bad96 !important;	
    }

this also does not work.

Hello there,

To reduce confusion and avoid possible endless discussion, would you mind sharing a link to one of your site that I can see the button you’d like to redesign?

Regards,
Kharis

Here is the link to an random post, when you scroll down to the comment section there are 3 buttons…
one to comment, one for the next and one for the prev. Post:

http://new.reitanlage-meyhen.de/2016/02/12/markup-html-tags-and-formatting/

I think this is there is something like a regular Theme button css, because when I use a Contact Form Plugin and activate the option “use Theme button style” the submit-button looks like the buttons on the Post Page.

Regards,
Tobi

Try the below CSS code selector:

.post-navigation .nav-previous,
.post-navigation .nav-next,
.paging-navigation .nav-previous,
.paging-navigation .nav-next {
    background-color: #fff000;
}

Regards,
Kharis

1 Like

This works perfectly for the two page Navigation links, thank you.
But the third button at the comment section looks still the same.

Regards,
Tobi

For comment form’s button, use .comment-respond input[type="submit"] selector. Here’s the default styles to override.

.comment-respond input[type="submit"] {
    padding: 15px;
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    box-shadow: none;
    border: none;
    background-color: #ff6b53;
    box-shadow: 0 0 1px #adadad;
    transition: all 0.4s;
}

Regards,
Kharis