Sggest Me a WP Theme

G

gg786

Active member

Jun 2, 2020

197

28

28

• Jan 30, 2021

• #1

hi all,'
I am looking for a WordPress theme which has transparent contact form 7 on the revslider on the front page I have tried but I could not found yet any theme with the same features so if anyone knows kindly help me. if it is available on this forum it will be a Plus.

Many Thanks & Regards

 

G

gg786

Active member

Jun 2, 2020

197

28

28

• Jan 31, 2021

• #2

any Luck ??

 

guguk

Well-known member

Jul 19, 2019

1,150

828

113

Ottoman Empire

• Feb 1, 2021

• #3

If you struggle doing that via revolution slider & contact form 7
Then check out landing page templates.
Im sure you will find what you want.

 

G

gg786

Active member

Jun 2, 2020

197

28

28

• Feb 1, 2021

• #4

Sir,
Thank you for the reply, I have searched too many times but could not found exactly what I need, actually, I need a transparent contact form on the rev slider but there is no luck yet.

 

whitebee

Well-known member

Trusted Uploader

Dec 22, 2020

545

613

93

My sweet nest

babiato.tech

• Feb 1, 2021

• #5

Perhaps you shouldn't try to find a theme, but should be trying to find a way to make the contact form transparent using CSS or something else, so it could be added to anything and it stays transparent.

I found a guide about transparent ContactForm 7, hopefully it's what you're looking for:

https://kriesi.at/support/topic/contact-form-7-how-to-make-fields-transparent/

 

• 

Reactions: mader

guguk

Well-known member

Jul 19, 2019

1,150

828

113

Ottoman Empire

• Feb 1, 2021

• #6

gg786 said:

Sir,
Thank you for the reply, I have searched too many times but could not found exactly what I need, actually, I need a transparent contact form on the rev slider but there is no luck yet.

Click to expand...

Just provide a sample? what you want to do exactly?
If the problem just "tarnsparent" it's easy peasy

 

• 

Reactions: mader and whitebee

G

gg786

Active member

Jun 2, 2020

197

28

28

• Feb 1, 2021

• #7

guguk said:

Just provide a sample? what you want to do exactly?
If the problem just "tarnsparent" it's easy peasy

Click to expand...

yes sir I need to make a slider and put contact form on it which I have already done but I want to make the contact form transparent and field borders in custom color or just white enter txt is also need to be white.

 

guguk

Well-known member

Jul 19, 2019

1,150

828

113

Ottoman Empire

• Feb 1, 2021

• #8

gg786 said:

yes sir I need to make a slider and put contact form on it which I have already done but I want to make the contact form transparent and field borders in custom color or just white enter txt is also need to be white.

Click to expand...

if you already made it one slider, just drop a link here and we can suggest you a lil bit CSS

 

G

gg786

Active member

Jun 2, 2020

197

28

28

• Feb 1, 2021

• #9

guguk said:

if you already made it one slider, just drop a link here and we can suggest you a lil bit CSS

Click to expand...

Please find the Link below and kindly suggest me how can I make it more attractive.

slider - UWRE Property

“A HIGHER FORM OF REALTY”

uwreproperty.com

 

guguk

Well-known member

Jul 19, 2019

1,150

828

113

Ottoman Empire

• Feb 1, 2021

• #10

gg786 said:

Please find the Link below and kindly suggest me how can I make it more attractive.

slider - UWRE Property

“A HIGHER FORM OF REALTY”

uwreproperty.com

Click to expand...

mmm how can say.
I just i did not imagine like that when you make transparent it will be not seem "good" i think.

I just suggest you these:
- You should use input placeholder instead of "form label" (I can not do that via CSS you can make that via form fields)
- If you want to use form on slider you should consider to using "border". I mean, only use frame border with little radius and do not use left-right and top border for inputs.
- You should consider to make "send" button full-width or just text without background color.

 

• 

Reactions: gg786

G

gg786

Active member

Jun 2, 2020

197

28

28

• Feb 1, 2021

• #11

Dear Sir,

this would be nice i have tried custom css but it is not working for the form I am stucked on this stage. can you please help me how to get the result as now you understand my opinion

 

frizzel

Well-known member

Trusted Uploader

Jun 13, 2019

485

253

63

Wherever my imagination takes me

• Feb 1, 2021

• #12

You cannot override the CSS in the first form as it's set on the element itself. That's probably done via theme settings or something like that?
The second form (with only the email field) you can override, simply add this to your CSS:

CSS:

.wpcf7 input[type="url"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], textarea.wpcf7-form-control, .form textarea.wpcf7-form-control {
    background: transparent}

However, you might want to consider not a completely transparent background. You can do this with

CSS:

   {background: rgba(255, 255, 255, 0.5)}

(where 0.5 indicates the percentage of opacity, in this case 50 percent.)

The text inside the boxes is a so-called placeholder, for which you can change the color as follows:

CSS:

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #FFF;
  opacity: 1; /* You have to set this for Firefox because it sets a lower opacity for placeholders */
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #FFF;
}
::-ms-input-placeholder { /* Microsoft Edge */
  color: #FFF;
}

 

frizzel

Well-known member

Trusted Uploader

Jun 13, 2019

485

253

63

Wherever my imagination takes me

• Feb 1, 2021

• #13

But, but, but... on the Home Page of the link you gave there's already a nice looking form. Why don't you simply apply the styles of that form to your CF7 form?

 

G

gg786

Active member

Jun 2, 2020

197

28

28

• Feb 2, 2021

• #14

frizzel said:

But, but, but... on the Home Page of the link you gave there's already a nice looking form. Why don't you simply apply the styles of that form to your CF7 form?

Click to expand...

yes I tried but couldn't fount the particular CSS on that form.

 

G

gg786

Active member

Jun 2, 2020

197

28

28

• Feb 2, 2021

• #15

frizzel said:

You cannot override the CSS in the first form as it's set on the element itself. That's probably done via theme settings or something like that?
The second form (with only the email field) you can override, simply add this to your CSS:

CSS:

.wpcf7 input[type="url"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], textarea.wpcf7-form-control, .form textarea.wpcf7-form-control {
    background: transparent}

However, you might want to consider not a completely transparent background. You can do this with

CSS:

   {background: rgba(255, 255, 255, 0.5)}

(where 0.5 indicates the percentage of opacity, in this case 50 percent.)

The text inside the boxes is a so-called placeholder, for which you can change the color as follows:

CSS:

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #FFF;
  opacity: 1; /* You have to set this for Firefox because it sets a lower opacity for placeholders */
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #FFF;
}
::-ms-input-placeholder { /* Microsoft Edge */
  color: #FFF;
}

Click to expand...

Thank you sir this really works I tried but the text is not changing the color I will check it later.

 

frizzel

Well-known member

Trusted Uploader

Jun 13, 2019

485

253

63

Wherever my imagination takes me

• Feb 2, 2021

• #16

They have included a placeholder color already, so you have to override that with a class attribute, like so:

CSS:

.form-control:-ms-input-placeholder {color: #FFF}
.form-control::-ms-input-placeholder {color: #FFF}
.form-control::-webkit-input-placeholder {color #FFF}
.form-control::placeholder {color: #FFF}