با بیش از 1 میلیون کاربر فعال، فرم تماس 7 یکی از محبوب ترین پلاگین فرم تماس برای وردپرس است.  خوشبختانه، فرم تماس 7 می تواند به راحتی با استفاده از CSS در تم وردپرس استفاده کنید. در این مقاله، ما شما را در طراحی فرم تماس 7 در وردپرس یاری میرسانیم.

طراحی فرم تماس در وردپرس

طراحی فرم تماس

 

ما در حال فرض کنید که شما در حال حاضر نصب فرم تماس با 7 پلاگین و فرم تماس خود را برای اولین بار ایجاد کرده اند. گام بعدی این است برای کپی کردن کوتاه برای فرم تماس خود را و آن را در پست وردپرس و یا یک صفحه که در آن شما می خواهم فرم خود را به نظر می رسد وارد کنید.
به خاطر این مقاله، ما به شکل پیش فرض تماس با استفاده کرده اند و آن را به یک صفحه وردپرس اضافه شده است. این است چگونه فرم تماس در سایت آزمون ما نگاه کرد.

طراحی قالب وردپرس

طراحی قالب وردپرس

فرم تماس با 7 تولید یک کد سازگار بسیار مفید و استاندارد برای اشکال. هر عنصر در فرم دارای یک ID و CSS کلاس مناسب مرتبط با آن.
هر فرم تماس با استفاده از CSS .wpcf7 کلاس که شما می توانید به سبک فرم خود استفاده کنید.
در این مثال ما با استفاده از یک فونت گوگل Lora در زمینه های ورودی ما است. مشاهده کنید که چگونه برای اضافه کردن فونت های گوگل در وردپرس.

<pre>div.wpcf7 { 
background-color: #fbefde;
border: 1px solid #f28f27;
padding:20px;
}
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea {
background:#725f4c;
color:#FFF;
font-family:lora, sans-serif; 
font-style:italic;    
}
.wpcf7 input[type="submit"],
.wpcf7 input[type="button"] { 
background-color:#725f4c;
width:100%;
text-align:center;
text-transform:uppercase;
}</pre>

فرم تماس با ما پس از اعمال اینگونه دیده میشود.

امیدواریم این مقاله به شما در طراحی فرم تماس 7 در وردپرس کمک کرده باشد.برای مشاهده مقالات بیشتر درباره ی طراحی قالب وردپرس به https://www.on5.ir مراجعه کنید.

آنفایو مرجع مقالات تخصصی طراحی قالب وردپرس

 

 

 

نظر خود را بگذارید

-- بارگیری کد امنیتی --