Return to previous page

Forms – configuration – contact form 7

This topic has 8 replies, 2 voices, and was last updated 1 years, 10 months ago ago by Rose Tyler

Peter

Participant

February 6, 2023 at 14:47

Hi, can you help me how to stylize the contact form?
I added it but it looks ugly, the fields have no background and they are too big.
How can I change this to “customer friendly”?

Please, contact administrator
for this information.

#346169 Copied Theme version: 9.0.3

7 Answers

Rose Tyler

Support staff

February 6, 2023 at 15:24

Hello, Peter

We’ve deleted the demo custom CSS code for the page. Please check now.

Kind Regards,
8theme team

#346173 Copied

Peter

Participant

February 6, 2023 at 15:28

Thanks, It’s better.
And how could I make this form narrower (as I marked in the screenshot)?
Where can I style it or are there any ready-made css styles for forms?
Because on sample templates they are not once so nicely prepared.

Please contact administrator
for this information.

#346174 Copied
Rose Tyler

Support staff

February 6, 2023 at 15:59
In this case, you need to use custom CSS code, for example:
```
.vc_tta-panels .wpcf7-form {
    width: 80%;
}
```
Describe your request in more detail, then we will be able to suggest the code.

Kind Regards,
8theme team
#346178 Copied
Peter

Participant

February 13, 2023 at 10:08

Hi,
Thanks.
Can you help me with “Tabbed content”?
Why does he look so weird? It looks different on the other side. The clicked item is highlighted somehow. (I’m attaching a screenshot).

Please contact administrator
for this information.

#346765 Copied

Rose Tyler

Support staff

February 13, 2023 at 13:04

Hello, Peter,

Screenshots were done from 2 different pages? Please provide URLs of both pages.

Kind Regards,
8theme team

#346779 Copied

Peter

Participant

February 13, 2023 at 13:48

ok

Please contact administrator
for this information.

#346787 Copied
Rose Tyler

Support staff

February 13, 2023 at 16:11
Hello, Peter,

You can add the next code in Custom CSS for page area:
```
.vc_tta-container .vc_tta-tabs-position-top .vc_tta-tabs-list {
    border-bottom: 1px solid #eee;
    margin-bottom: 1.5em;
}
.wpb-js-composer .vc_tta-container .vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab a {
    border-bottom: 1px solid transparent !important;
    line-height: 1em;
    margin-bottom: 0;
    padding: 1.001em 0 !important;
    margin-right: 1.5em;
}
.wpb-js-composer .vc_tta-container .vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab a:hover, .wpb-js-composer .vc_tta-container .vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab.vc_active>a {
    color: #1071b6;
}
.wpb-js-composer .vc_tta-container .vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab a:hover, .wpb-js-composer .vc_tta-container .vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab.vc_active>a {
    border-color: #1071b6 !important;
}
```
https://prnt.sc/OKRMdNfQ05MV
Please note that such additional customization is outside the scope of our basic support.

Kind Regards,
8theme team
#346814 Copied
Tagged: configuration, contact form 7, forms, seo friendly, templates, woocommerce, wordpress
Viewing 8 results - 1 through 8 (of 8 total)