Comment button not displayed

Sparkling
1

Hello

Sometimes (randomly), the submit button for comments does not show up.

Everything is on the screenshot : why is there display: none; for the button ?

2

Hi @angristan,

I hope you are well today and thank you for your question.

Everything is on the screenshot : why is there display: none; for the button ?

It’s because to apply some bootstrap framework effects on it so it’s displayed using javascript.

If for some reason the javascript code doesn’t work on your site due to other javascript error then you can display that button by adding the following CSS code in the Custom CSS option of the latest version of Sparkling theme on the below path.

Admin Area -> Appearance -> Customize -> Sparkling Options -> Other -> Custom CSS

#submit, .tagcloud, .comment-reply-link, .widget_rss ul, button[type=submit], .postform, table#wp-calendar {
    display: inline-block !important;
}

Best Regards,
Movin

3

Hi, thanks for your answer.

It seems to work but not totally.

4

May this be linked with that ? https://colorlibsupport.com/t/jquery-bug-and-js-errors/

5

Hi @angristan,

To apply the same red style on the button you can try using the following CSS code.

#submit, .tagcloud, .comment-reply-link, .widget_rss ul, button[type=submit], .postform, table#wp-calendar{
    color: #FFF;
    background-color: #DA4453;
    border-color: #DA4453;
    -webkit-transition: background-color 0.3s linear;
    -moz-transition: background-color 0.3s linear;
    -o-transition: background-color 0.3s linear;
    transition: background-color 0.3s linear;
    display: inline-block !important;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}

#submit:hover{
background-color: #363636;
    border-color: #363636;
}

Regards,
Movin

6

Thanks ! It works for comments, but it’s messing up tags.

7

I removed .tagcloud and it’s back to normal.

I noticed that the search bar is strange now :

8

To resolve the issues try changing the selector in the CSS code as following.

#comments #submit{
    color: #FFF;
    background-color: #DA4453;
    border-color: #DA4453;
    -webkit-transition: background-color 0.3s linear;
    -moz-transition: background-color 0.3s linear;
    -o-transition: background-color 0.3s linear;
    transition: background-color 0.3s linear;
    display: inline-block !important;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}

#comments #submit:hover{
background-color: #363636;
    border-color: #363636;
}
9

Awesome, work perfectly !

Thank you very much for you support !

10

You are most welcome here :slight_smile: