Website button style and the size of the title text of the tab links "DESCRIPTIO

This topic has 16 replies, 2 voices, and was last updated 2 years, 9 months ago by Elise Noromit.

Viewing 17 posts - 1 through 17 (of 17 total)

Author

Posts
February 1, 2022 at 5:00 am #349288

Sean
Participant

I have the following problems to solve:
1. The buttons of the website are not set according to the button settings in “Theme Settings/Styles and colors/Buttons”. The problematic pages include:

a. “SUBMIT” button on all product review pages (see screenshot):

b. “SUBMIT” button on the Contact us page (see screenshot):

2. Change the title text size of “DESCRIPTION” and “REVIEWS” in the tab links of the product page to 24px (see screenshot).

sincere regards

Attachments:
You must be logged in to view attached files.

February 1, 2022 at 11:17 am #349414

Elise Noromit
Member

Hello,

The description is not a button, it is a heading.

The contact form button does not inherit the theme styles, we can do it by custom CSS.

Please insert the credentials into the Private content below the message area.

I will check the button settings and provide the CSS for the contact form button.

Best Regards

February 1, 2022 at 11:24 am #349419

Sean
Participant

Where can I check “the credentials into”?

February 1, 2022 at 11:49 pm #349556

Elise Noromit
Member

Hello,

Please insert your site admin access into the Private area field.

Best Regards

February 6, 2022 at 2:54 pm #350725

Sean
Participant

okay.

February 7, 2022 at 1:41 am #350801

Elise Noromit
Member

Hello,

Now your site is unavailable: https://gyazo.com/6724a436a216207e0ebd3be89bf55842

Please contact us when it is working.

Best Regards

February 8, 2022 at 12:49 am #351229

Sean
Participant

My website is working normally.

February 8, 2022 at 11:19 pm #351509
Elise Noromit
Member
Hello,

Please add this code to the Theme Settings > Custom CSS > Global:
```
body input[type="submit"] {
    padding: 12px 20px;
    font-size: 13px;
    line-height: 18px;
    background-color: #007aff;
    color: #ffffff;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    outline: none;
    border-width: 0;
    border-style: solid;
    border-color: transparent;
    border-radius: 50%;
    box-shadow: none;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    text-shadow: none;
    letter-spacing: .3px;
    font-weight: 600;
    cursor: pointer;
    transition: color .25s ease, background-color .25s ease, border-color .25s ease, box-shadow .25s ease, opacity .25s ease;
}
```
Best Regards
February 9, 2022 at 9:49 am #351619

Sean
Participant

Hello, after I copied the css file into “Global Custom CSS”, the “REVIEWS” form is normal, but the form on the “CONTACT US” page becomes like this (please see the screenshot), can you adjust it to “REVIEWS” “form “submit” button.

Also, when I opened this support ticket, the second question had not been answered, could you please reply me together? Questions are as follows:

2. Change the title text size of “DESCRIPTION” and “REVIEWS” in the tab links of the product page to 24px (see screenshot).

Attachments:
You must be logged in to view attached files.

February 9, 2022 at 10:54 am #351641

Elise Noromit
Member

Hello,

These styles are for the button. I took this style from the cookies button. You can either change these styles as per your needs or give the page URL where the button is I will take the styles and update them.

Best Regards

February 9, 2022 at 1:23 pm #351719

Sean
Participant

：）

Attachments:
You must be logged in to view attached files.

February 10, 2022 at 1:30 am #351823
Elise Noromit
Member
Hello,

Please add this code to the Theme Settings > Custom CSS > Global:
```
.woocommerce-Tabs-panel--description p {
font-size:12px;
}
```
I need the page URL where I can see the button you want for the contact page.

Best Regards
February 16, 2022 at 9:00 am #353401

Sean
Participant

The style I want for the contact button is something like the “add to cart” button in this page.

February 16, 2022 at 9:22 am #353405

Sean
Participant

Also, after I use the code you gave me, the description text becomes very small, please see the screenshot.

Like I said on February 9, 2022 at 1:23 pm, what I need is to change the font size of the word “DESCRIPTION” to 24px (it’s tag in the single product page is H2, and the page I put below ), instead of modifying the description text size under “DESCRIPTION”.

Attachments:
You must be logged in to view attached files.

February 16, 2022 at 8:15 pm #353606
Elise Noromit
Member
Hello,

Please replace the code with this one:
```
body .wc-tab-inner>div>h2:first-child {
    font-size: 24px;
}
```
If you have any questions please feel free to contact us.

Best Regards
February 17, 2022 at 11:26 pm #354062

Sean
Participant

The style I want for the contact button is something like the “add to cart” button in this page.

——————————————————————
February 9, 2022 at 10:54 am
#351641

Elise Noromit
Keymaster
Hello,

These styles are for the button. I took this style from the cookies button. You can either change these styles as per your needs or give the page URL where the button is I will take the styles and update them.

Best Regards

February 19, 2022 at 12:57 am #354370
Elise Noromit
Member
Hello,

Please replace the code with this one:
```
body .wpcf7-form input[type="submit"] {
    padding: 12px 40px;
    font-size: 13px;
    line-height: 18px;
    background-color: #007aff;
    color: #ffffff;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    outline: none;
    border-width: 0;
    border-style: solid;
    border-color: transparent;
    border-radius: 35px;
    box-shadow: none;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    text-shadow: none;
    letter-spacing: .3px;
    font-weight: 600;
    cursor: pointer;
    transition: color .25s ease, background-color .25s ease, border-color .25s ease, box-shadow .25s ease, opacity .25s ease;
}
```
Best Regards
Author

Posts