ساخت فرم ۲ ستونه در Contact Form 7

ساخت فرم ۲ ستونه در Contact Form 7

سلام دوستان عزیز تم لاین.

اگر شما بخواهید در وردپرس فرم ۲ ستونه بسازید باید از کد های شخصی سازی شده html و css استفاده کنید که ما در اینجا براتون کدی رو قرار دادیم که براحتی میتوانید در افزونه Contact Form 7 فرم های ۲ ستونه و واکنش گرا طراحی بکنید و در نوشته های خودتون قرار بدید.

حتما سربزنید : افزونه ساخت آسان فرم تماس و فرم ساز Contact Form 7

ابتدا این کد های HTML رو درون افزونه و در قسمت شخصی سازی وارد بکنید :

<div class="clearfix">
    <div id="left">
        First name [text first-name] <br/>
        Last Name[text last-name] <br/>
        How Did You Find Us? [text text-find-us]
    </div>
    <div id="right">
        Email [email* your-email] <br/>
        Phone [text your-phone]
    </div>
</div>
 
Subject [text* your-subject] <br/>
Message [textarea* your-message] <br/>
[submit "Send"]

بعدش کد های زیر رودرون کد های css سفارشی قرار بدید :

/*--- ۲ Column Form Styles Start ---*/

#left {
    width: 47%;
    float: left;
    margin-right:6%;
}
 
#right {
    width: 47%;
    float: left;
}
 
.clearfix:after {
    content:"۰۲۰";
    display:block;
    height:0;
    clear:both;
    visibility:hidden;
    overflow:hidden;
    margin-bottom:10px;
}
 
.clearfix {
    display:block;
}

/*--- ۲ Column Form Styles End ---*/

بعدش اگه صفحه رو تست بکنید، میبینید که یک فرم ۲ ستونه زیبا و رسپانسیو در صفحه قرار دارد.

درباره تم لاین

بنده محمود هستم . علاقمند به وردپرس و کسب و کارهای اینترنتی. این سایت رو هم برای دوستداران وردپرس راه اندازی کردیم . انتقادات و پیشنهاداتتون رو از ما دریغ نکنید . با تشکر

موارد جالب

13 روش برای محافظت وردپرس

۱۳ روش برای محافظت وردپرس در برابر هکرها

سلام دوستان عزیز. در این مطلب براتون ۱۳ روش فوق گذار برای محافظت سایت در ...

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *