Html Contactform 7 中的占位符 - Wordpress

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/24309750/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 02:05:22  来源:igfitidea点击:

Placeholder in Contactform 7 - Wordpress

htmlwordpresscontact-form-7

提问by The_Monster

I am making a website for a client of me but im running into a problem. I've made a contact form in wordpress using Contact Form 7. This plugin is really easy to use but when i wanted to use the placeholder property of the plugin it did not show the placeholder when i loaded the page.

我正在为我的客户制作一个网站,但我遇到了问题。我已经使用 Contact Form 7 在 wordpress 中制作了一个联系表格。这个插件真的很容易使用,但是当我想使用插件的占位符属性时,它在我加载页面时没有显示占位符。

This is how i set the placeholder in Contactform 7

这就是我在 Contactform 7 中设置占位符的方式

[text* your-name placeholder "Name"]

The placeholder tag works just fine for my textarea but it doesnt work with the textbox above. Can someone explain to me what i am doeing wrong here?

占位符标签适用于我的 textarea,但它不适用于上面的文本框。有人可以向我解释我在这里做错了什么吗?

EDIT

编辑

When i inspect the element with Google Chrome and inspect the textbox it says that it has a placeholder. But it doesnt show the placeholder.

当我用谷歌浏览器检查元素并检查文本框时,它说它有一个占位符。但它不显示占位符。

回答by JorgePinon

If anyone is having trouble with this, it could be that you're using class: or id: attributes.

如果有人遇到此问题,可能是您使用了 class: 或 id: 属性。

It worked for me when I added placeholder afterall those:

当我所有这些之后添加占位符时,它对我有用:

[email* your-email id:your-email class:form-control placeholder "ex. [email protected]"]

回答by Pierre Jean

Same problem, then I change the input background color and the placeholder text is white on background white ...

同样的问题,然后我更改输入背景颜色,占位符文本在背景白色上为白色...

So I sudgest to try to change the backrgound input color to test:

所以我建议尝试改变背景输入颜色来测试:

input[type="text"], textarea {
  background-color : #d1d1d1; 
}

回答by Maha Dev

Its very simple.You can add placeholder like this:

它非常简单。您可以像这样添加占位符:

[text* first_name placeholder"First Name"] 

Documentation : https://contactform7.com/setting-placeholder-text/

文档:https: //contactform7.com/setting-placeholder-text/

回答by Ram

[text* your-name placeholder "Name"] The syntax was what you gave correct once check the contact form settings. Because I am also using same as like your syntax it was working properly in my contact form.

[text* your-name placeholder "Name"] 检查联系表单设置后,您给出的语法是正确的。因为我也使用与您的语法相同的语法,所以它在我的联系表中正常工作。

回答by John M.

In case someone is still having this problem despite having everything correctly written as the other answers above, here is the solution to my problem.

万一有人尽管按照上面的其他答案正确编写了所有内容,但仍然遇到此问题,这里是我的问题的解决方案。

Code in a theme was hiding placeholders and it's not related to Contact Form 7.

主题中的代码隐藏了占位符,并且与联系表 7 无关。

CSS Code that fixed my problem:

解决了我的问题的 CSS 代码:

input::placeholder {
    color: #9c9c9c;
    opacity: 1;
}

回答by Fefar Ravi

If you are using class or id attributes.Simply do the following:

如果您使用的是 class 或 id 属性。只需执行以下操作:

[text* your-name class:form-control id:name placeholder "Enter Name"]