استایل فرم

فرم‌های عمومی شبیه فرم‌های عمومی هستند. بازدیدکنندگان متوجه می‌شوند که فرم تماس با بقیه وب‌سایت شما مطابقت ندارد و این به اعتماد آسیب می‌رساند.

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

چرا طراحی فرم اهمیت دارد؟

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

نحوه‌ی کار استایل‌دهی فرم

سازنده خودکار فرم شامل یک ویرایشگر سبک بصری است که در رابط سازنده فرم تعبیه شده است.

  • انتخاب کنید چه چیزی را استایل دهیداز بین محفظه فرم، برچسب‌های فیلد، فیلدهای ورودی، دکمه‌ها یا پیام‌های خطا انتخاب کنید.
  • تنظیمات را انجام دهیداز انتخابگرهای رنگ، اسلایدرها و منوهای کشویی برای تغییر مقادیر استفاده کنید. هیچ سینتکس CSS برای یادگیری یا به خاطر سپردن وجود ندارد.
  • پیش‌نمایش فوریهر تغییری بلافاصله در پیش‌نمایش زنده ظاهر می‌شود. قبل از انتشار، دقیقاً ببینید فرم شما چگونه به نظر می‌رسد.
  • ذخیره به عنوان پیش‌فرض. استایل خود را به صورت خودکار به فرم‌های جدید اعمال کنید. یک بار ایجاد کنید، همه جا دوباره استفاده کنید.

آنچه می‌توانید سفارشی کنید

رنگ ها

رنگ ها

کنترل تمام رنگ‌های فرم. رنگ‌های پس‌زمینه برای محفظه فرم و فیلدهای مجزا. رنگ‌های متن برای برچسب‌ها، متغیرها و متن ورودی. رنگ‌های حاشیه برای حالت‌های پیش‌فرض، فوکوس و خطا. رنگ‌های دکمه برای جلوه‌های پس‌زمینه، متن و هاور.

فن چاپ

فن چاپ

فونت‌ها را برای برچسب‌ها و فیلدهای ورودی انتخاب کنید. اندازه فونت‌ها را به‌طور مستقل تنظیم کنید - برچسب‌های بزرگ‌تر برای تأکید، متن کمکی کوچک‌تر برای اطلاعات ثانویه. وزن فونت را برای برچسب‌های پررنگ یا متن ورودی سبک‌تر کنترل کنید.

فاصله گذاری و چیدمان

فاصله گذاری و چیدمان

فاصله بین فیلدها را تنظیم کنید تا فضای کافی برای تنفس ایجاد شود. فاصله بین فیلدها را برای ورود راحت متن تنظیم کنید. حاشیه‌های اطراف کل فرم را کنترل کنید تا فرم به طور کامل در طرح‌بندی صفحه شما قرار گیرد.

مرزها و گوشه‌ها

مرزها و گوشه‌ها

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

دکمه

دکمه

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

فرم کانتینر

فرم کانتینر

به کل فرم استایل بدهید. یک رنگ پس‌زمینه اضافه کنید یا آن را شفاف نگه دارید. برای عمق دادن به فرم، سایه‌های کادر اعمال کنید. شعاع حاشیه را برای فرم‌های گرد تنظیم کنید. حداکثر عرض را کنترل کنید تا فرم‌ها بیش از حد کشیده نشوند.

سناریوهای رایج استایل‌دهی فرم

دستورالعمل‌های برند را مطابقت دهید

شرکت شما رنگ‌های خاصی دارد—#0F2D5F برای رنگ اصلی و #F59E0B برای رنگ‌های مکمل. این مقادیر را در ویرایشگر استایل وارد کنید. دکمه‌های فرم از رنگ مکمل شما استفاده می‌کنند. برچسب‌های فرم از رنگ اصلی شما استفاده می‌کنند. سازگاری کامل با برند.

فرم‌های با کنتراست بالا ایجاد کنید

وب‌سایت با پس‌زمینه تیره؟ فرم‌های روشنی ایجاد کنید که برجسته باشند. پس‌زمینه روشن؟ از فرم‌های حاشیه‌دار با سایه‌های ظریف استفاده کنید تا ناحیه فرم را بدون ایجاد رقابت بصری تعریف کنید.

طراحی فرم‌های مینیمال

حاشیه‌ها را حذف کنید، فاصله‌ها را کاهش دهید، از پس‌زمینه‌های شفاف استفاده کنید. فرم‌هایی ایجاد کنید که به جای اینکه در یک کادر قرار بگیرند، با صفحه ادغام شوند.

فرم‌های فراخوان عمل جسورانه بسازید

دکمه‌های بزرگ، رنگ‌های قوی، فاصله‌گذاری زیاد. فرم‌هایی ایجاد کنید که برای مهم‌ترین صفحات جذب مشتری بالقوه، توجه را جلب کنند.

فرم‌هایی که با هر قالبی مطابقت دارند

افزونه فرم ساز خودکار با هر قالب وردپرسی کار می‌کند. فرم‌های استایل‌دهی شده شما با هر زمینه طراحی سازگار می‌شوند.

با استفاده از Woodmart، Astra، GeneratePress، Divi یا هر قالب دیگری؟ فرم‌های شما ظاهری بومی خواهند داشت. ویرایشگر سبک به شما کنترل کافی برای مطابقت با هر سیستم طراحی را می‌دهد.

بدون تداخل قالب. بدون مشکل وراثت استایل. فقط فرم‌هایی که دقیقاً همانطور که می‌خواهید به نظر می‌رسند.

استایل فرم

بدون نیاز به سی اس اس

برای استایل‌دهی به فرم‌هایتان نیازی به نوشتن CSS سفارشی ندارید. ویرایشگر بصری همه چیز را مدیریت می‌کند.

اما اگر می‌خواهید کنترل CSS داشته باشید، Auto Form Builder از CSS سفارشی برای هر فرم پشتیبانی می‌کند. برای موارد خاص، override اضافه کنید یا استایل‌بندی پیشرفته‌ای را که در ویرایشگر بصری موجود نیست، اعمال کنید. کاربران پیشرفته انعطاف‌پذیری مورد نیاز خود را دریافت می‌کنند.

همین امروز ساخت فرم‌های وردپرس را شروع کنید

همین امروز Auto Form Builder را رایگان دانلود کنید و تعداد نامحدودی فرم ایجاد کنید. بدون نیاز به کارت اعتباری. بدون محدودیت دوره آزمایشی. فقط یک راه بهتر برای ساخت فرم‌ها.