wordpress联系表单7验证不符合相应的输入

Question

我有插件＆＃34;联系表格7＆＃34;在我的Wordpress网站上，我遇到了如何正确对齐验证消息。

这是我尝试输出设计时的响应。

这是我添加到我的＆＃34;联系表单7＆＃34;。

的HTML表单

[response]
[text* your-name class:rounded-input class:cols-4 placeholder "Your Name"]
[text* your-position class:rounded-input class:cols-4 placeholder "Position"]
[text* company class:rounded-input class:cols-4 placeholder "Company Name"]
[email* your-email class:rounded-input class:cols-4 placeholder "Email Name"]

<label class="center-content">
    [checkbox* agreement class:rounded-input "I’m looking for the best solution with fantastic local support."]
</label>

    [submit class:button "Get a Solution"]

<p><small>*Your privacy is very important to us. To learn more about our information processesing procedures, please visit our <a href="#">Privacy Policy</a>.</small></p>

然后这是我的PHP文件中的HTML：

<footer class="contact-form clearfix" style="background-image: url(<?php echo get_template_directory_uri(); ?>/img/contact-bg.png)">
    <div class="form-holder">
    <h2>Together, we’ll do great.</h2>
    <p> Cras venenatis feugiat nibh quis tempus. Quisque libero nibh, consequat posuere,<br> tempus pulvinar purus.</p>

    <?php echo do_shortcode('[contact-form-7 id="66" title="Contact form"]'); ?>
    </div>
</footer>

然后这是我的页脚形式的样式表：

.form-holder {
    text-align: center;
    padding: 20px 5%;
    color: #fff;
}

.rounded-input {
    max-width: 1020px;
    margin: 20px auto;
}

.rounded-input.cols-4 {
    border: 1px solid #fff;
    border-radius: 3px;
    width: 23%;
    margin: 15px 1%;
    background: transparent;
    color: #fff;
}

我正考虑将它们包装在div。

中

Answer 1

在您的html中，您已经分配了18个字符串，您只能使用12个字符串，因此请将短代码更改为

[text* your-name class:rounded-input class:cols-3 placeholder "Your Name"]