contact form 7 افزونه ای است که برای ساخت انواع فرم های تماس استفاده می شود. بطور پیشفرض ، فرم های این افزونه یک ستونه هستند. اما چطور یک فرم تماس چند ستونه بسازیم؟
- نفیسه افقی 2 سال قبل سوال کرد
- آخرین ویرایش 2 سال قبل
- شما باید برای ارسال دیدگاه وارد شوید
1- ابتدا افزونه Column Shortcodes
را نصب کنید.
( داخل قسمت افزونه ها > افزودن
عبارت بالا را وارد کرده و آن را نصب و فعال کنید )
2- سپس وارد فایل functions.php
شده ( نمایش > ویرایشگر پوسته
) و قطعه کد زیر را در آنجا قرار دهید.
add_filter( 'wpcf7_form_elements', 'delicious_wpcf7_form_elements' );
function delicious_wpcf7_form_elements( $form ) {
$form = do_shortcode( $form );
return $form;
}
3- فرم تماس دو ستونه
حالا سراغ فرم تماس خود رفته و از کد زیر برای ساختن یک فرم تماس دو ستونه استفاده کنید
<div class="content-column one_half"><div style="padding:"0;"><label> نام (الزامی)
[text* your-name] </label></div></div>
<div class="content-column one_half last_column"><label> ایمیل (الزامی)
[email* your-email] </label></div><div class="clear_column"></div>
<label> موضوع
[text* your-subject]</label>
<label> پیام شما
[textarea your-message] </label>
[submit "ارسال"]
*برای اینکه فیلدها به هم نچسبند، باید از padding استفاده کنید ( کد زیر را در قسمت custom css در بخش سفارشی سازی وارد کنید)
.content-column.one_half{
padding-right: 10px;
}
4- فرم تماس سه ستونه
از کد زیر استفاده کنید:
<div class="content-column one_third"><div style="padding:"0;"><label> نام (الزامی)
[text* your-name] </label></div></div>
<div class="content-column one_third"><div style="padding:"0;"><label> ایمیل (الزامی)
[email* your-email] </label></div></div>
<div class="content-column one_third last_column"><label> موضوع
[text* your-subject] </label></div><div class="clear_column"></div>
<label> پیام شما
[textarea your-message] </label>
[submit "ارسال"]
بطور مثال:
برای ساخت فرم زیر، از قطعه کدی که در ادامه می آید استفاده شده
<div class="content-column one_third">
<div style="padding:"0;">
<label> نام (الزامی)
[text* your-name] </label>
</div>
</div>
<div class="content-column one_third">
<div style="padding:"0;">
<label>شماره تماس (ضروری)
[number* your-number]
</label>
</div>
</div>
<div class="content-column one_third last_column">
<label> ایمیل (ضروری)
[email* your-email] </label>
</div><div class="clear_column"></div>
</br>
<div class="content-column one_half"><div style="padding:"0;">
<label> آدرس (در صورت تمایل به بازدید رایگان)
و توضیح مختصر درباره پروژه و خواسته و نیازهای شما
[textarea your-address] </label>
</div>
</div>
<div class="content-column one_half last_column">
<label> عکس از محیط موردنظر
برای ارائه بهتر کارشناسان ما می توانید از محیط موردنظر چندین عکس تهیه کنید و اینجا ضمیمه کنید تا بتوانیم بهترین مشاوره را خدمتتان ارائه دهیم
[file your-file]
</label>
</div><div class="clear_column"></div>
</br>
[submit "ارسال"]
- نفیسه افقی 2 سال قبل پاسخ داد
- آخرین ویرایش 2 سال قبل
- شما باید برای ارسال دیدگاه وارد شوید
فرم تماس چند ستونه contact form 7 – وردپرس | موستانگ
aeyeqrriso
eyeqrriso http://www.g1ryd3465gmw9i2a8q31x450mw00aic1s.org/
[url=http://www.g1ryd3465gmw9i2a8q31x450mw00aic1s.org/]ueyeqrriso[/url]
- شما باید برای ارسال دیدگاه وارد شوید