如何在Wordpress中使用带有自定义HTML和CSS的联系表格7



我是WordPress社区的新手,如果由我决定的话,我永远不会踏入它(我只是不喜欢CMS(。这只是我目前正在处理的一个问题,大约一周了,所以请假设我对这个问题一无所知。

因此,我正在将一个HTML模板转换为WordPress主题,现在是时候关注联系人表单了。它出现在(几乎(所有页面的底部(但不在页脚部分(。设计师使其结构非常好,适合这个目的,由于我以前的经验,我正在考虑使用插件来完成这项工作,而不是尝试自己编程联系人表格。但是,我做了一项研究,发现这是大多数人面临的一个常见问题,生成的表单的设计过于死板,无法进行适当的风格设计。据我所知,在设计方面最容易使用的插件是Contact Form 7,因为它只生成表单的一个基本部分。我还找到了解释这个过程的教程。然而,如果我按照其中提到的说明操作,我仍然会得到一个简单的"无类"表单。请记住,我已经在WordPress后端使用Contact form 7语法添加了类,在那里必须创建/编辑表单,但它们(类(不存在。我试图在插件的wp后端编辑器中放置原始HTML,但我得到了相同的结果。

你是如何在Contact Form 7或你使用的任何其他Contact Form插件中实现自定义HTML和CSS设计的,我不会拘泥于Contact Form 7?

非常感谢关于联系表格7的任何帮助,以及关于如何处理一般"WordPress中的自定义设计联系表格"问题的任何其他想法!

您可以使用自定义div和类来设计Contact表单7。以下是示例代码:

<div class="row">
<div class="col-md-6 form-group">[text* your-name class:form-control placeholder "Name"]</div>
<div class="col-md-6 form-group">[email* your-email class:form-control placeholder "Email"]</div>
</div>

提示*:您必须使用联系人表单7生成的默认快捷代码,并使用自定义div来覆盖它。

我希望它能有所帮助。。

最新更新