armadilo732

تازه وارد
28/3/19
1
0
1
آموزش افزودن کدهای css به قالب


برای انجام این کار کدهایی در باکس های زیر مشاهده می‌کنید که هرکدام مرتبط با انجام کاری هستند برای افزودن این ویژگی ها در قسمت پیشخوان وردپرس (نمایش>ویرایشگر پوسته) را باز کنید. فایل style.css را انتخاب کنید و کد های موجود را در یک خط خالی از این پوشه copy paste کنید. اگر از قالب هاب غیر رایگان و پیشرفته استفاده می‌کنید حتما در تنظیمات قالب سایت خود قسمتی با عنوان کد های css سریع (quick css) دارید. در این صورت نیاز به فایل style.css نیست و از همان قسمت می‌توانید کد ها را اضافه کنید. در آخر با ذخیره کد‌ها فرم را در سایت باز کنید و با زدن کلید ترکیبی ctrl + f5 تغییرات را در فرم مشاهده کنید.


اندازه فیلد در gravity forms


برای تغییر اندازه فیلد از کد زیر استفاده کنید. با عوض کردن مقدار max-width می‌توانید عرض فیلد را به دلخواه تغییر دهید.

body #gform_wrapper_1 {
max-width: 246px;
margin: 0 auto;
}


در عبارت #gform_wrapper_1 بجای عدد 1 آی دی یا شناسه مربوط به فرمی را قرار دهید که قصد دارید این تغییرات بر آن اعمال شود. برای مشاهده آی دی فرم های موجود در گرویتی فرم به آدرس (فرم‌ها>فرم‌ها) رفته و مقابل هر فرم آی دی مربوط در ستون شناسه قرار دارد. اگر قصد دارید تنظیمات اندازه فیلد را برای فیلد های دو فرم مجزا اعمال کنید از کد بالا دو بار استفاده کنید و در هر بار شناسه مربوط به فرم مدنظر خودتان را قرار دهید. (این موضوع برای تمامی کدهای css  صدق می‌کند)


وسط چین کردن فیلدهای gravity forms


فیلدها به طور پیشفرض راست چین هستند. برای وسط چین کردن فیلد ها از کد زیر استفاده کنید.

/* keep it mobile friendly by only applying these styles for larger viewports */
@media only screen and (min-width: 641px) {

body #gform_wrapper_1 ul li.gfield .ginput_container,
body #gform_wrapper_1 ul li.gfield .gfield_description,
body #gform_wrapper_1 div.ginput_complex label,
body #gform_wrapper_1 input:not([type='radio']):not([type='checkbox']):not([type='submit']),
body #gform_wrapper_1 select,
body #gform_wrapper_1 textarea {
text-align:center;
}

body #gform_wrapper_1 ul.top_label li.gfield label.gfield_label {
text-align: center;
display: block;
}

body #gform_wrapper_1 .gform_footer,
body #gform_wrapper_1 .gform_page_footer{
text-align: center;
}

}


تمامی عبارات #gform_wrapper_1 را مانند توضیحات بالا برای شناسه فرم موردنظر ست کنید.

مشاهده ادامه مقاله در لاین‌گراف ...