پاسخ داده شد
0
0

contact form 7 افزونه ای است که برای ساخت انواع فرم های تماس استفاده می شود. بطور پیشفرض ، فرم های این افزونه یک ستونه هستند. اما چطور یک فرم تماس چند ستونه بسازیم؟

فرم تماس چند ستونه - موستانگ

  • شما باید برای ارسال دیدگاه شوید
پاسخ عالی
0
0

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 "ارسال"]
  • شما باید برای ارسال دیدگاه شوید
نمایش 1 - 20 از 31 نتیجه
پاسخ شما
اگر قبلاً حساب کاربری دارید با پر کردن فیلد های زیر یا به عنوان مهمان ارسال کنید.
نام*
ایمیل*
وب سایت