قرار دادن گزینه‌های تصویری در فرم‌های وردپرس با Contact Form by WPForms

گزینه‌های تصویری در فرم وردپرس

آیا به دنبال راهی هستید که بتوانید فرم­‌های خود را به گونه‌­ای طراحی کنید که باعث جذب مخاطب و کاربر بیشتری گردد؟ گرافیک راهی عالی برای جلب توجه مخاطبان شما و درگیر کردن آن­ها با وبسایت شما است. در این بین، عکس­‌ها جایگاه ویژه­‌ای در این زمینه و ایجاد یک محتوای عالی برای ارائه بهتر اطلاعات دارند. در این آموزش، ما به شما نشان خواهیم داد که چگونه می‌توانید گزینه‌های تصویری در فرم وردپرس خود اضافه کنید تا به این صورت نرخ بازدید سایت خود را افزایش دهید و تعامل بیشتری با کاربر خود داشته باشید.

گزینه‌های تصویری در فرم وردپرس

آنچه در این مقاله به اختصار خواهید خواند:

• گزینه­‌های تصویر چیست و دلیل استفاده از آن­ها در فرم ؟
• افزودن گزینه‌های تصویری در فرم وردپرس خود
• اضافه کردن فرم به وبسایت

گزینه­‌های تصویر چیست و دلیل استفاده از آن­ها در فرم ؟

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

برای روشن‌­تر شدن این موضوع، در اینجا از یک فرم با استفاده از گزینه‌­های تصویر استفاده کرده­‌ایم، تا به راحتی منظور این مقاله درک کنید:

انتخاب تصویر از بسیاری جهات می­‌تواند یک مزیت برای شما و کاربر سایت شما محسوب شود. در همه موارد، گزینه‌های تصویری در فرم وردپرس به شما اجازه می­‌دهند فرم خود را جذاب­‌تر و  قابل فهم‌­تر کنید. استفاده از تصاویر همچنین می‌­تواند به فرم­‌های شما جلا ببخشد و آن را حرفه‌­ای­‌تر جلوه کند. آن­ها همچنین می­‌توانند به کاربران در تصمیم‌­گیری سریع‌­تر کمک کنند. به عنوان مثال، اگر رستورانی را مدیریت می­‌کنید که کار تحویل غذا را نیز ارائه می­‌دهد، پس باید یک فرم سفارش در وبسایت خود داشته باشید. شما می‌­توانید از تصاویر غذاهای مختلف خود استفاده کنید تا مشتریان بالقوه بتوانند آنچه را که می‌خواهند انتخاب کنند.

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

افزودن گزینه‌های تصویری در فرم وردپرس خود

در این آموزش ما از افزونه WPForms استفاده خواهیم کرد تا بتوانید این ویژگی را به فرم­‌های خود اضافه کنید. WPForms یکی از بهترین افزونه سازنده فرم وردپرس در بازار است و به شما امکان می­‌دهد تا با استفاده از یک حرکت ساده یعنی کشیدن و رها کردن، فرم­‌های خود را به راحتی ایجاد کنید.

ابتدا باید افزونه WPForms را نصب و فعال کنید. WPForms یک افزونه برتر وردپرس است. همچنین نسخه رایگان این افزونه با نام WPForms Lite ارائه شده است که دارای ویژگی انتخاب تصویر نیز می‌­باشد.

ایجاد فرم خود با WPForms

پس از فعال کردن افزونه، به قسمت WPForms بروید و Add Form را بزنید تا بتوانید یک فرم اضافه کنید.

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

با این کار، رابط سازنده WPForms را با زمینه‌هایی از پیش بارگذاری شده را راه‌­اندازی می­‌کند. می­‌توانید با کلیک بر روی آن، هر قسمت از فرم را ویرایش کنید، آن را به بالا و یا پایین حرکت دهید یا حتی می­‌توانید مواردی را حذف کنید.

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

برای افزودن این گزینه، کافیست قسمت Multiple Choice را از قسمت Standard Fields در سمت چپ صفحه خود بکشید و در فرم خود رها کنید. ما می‌خواهیم آن را درست در بالای کادر “Comment ” و یا “Message” قرار دهیم.

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

در این قسمت، شما به باید کادر ” Use image choices ” را علامت بزنید و تا WPForms به طور خودکار این قسمت را بروز کند و امکان گزینه‌های تصویری در فرم وردپرس را اضافه می­‌کند.

برای متن برچسب آن­‌ها می­‌توانید هر آنچه را می­‌خواهید بنویسید و سپس بر روی دکمه “بارگذاری تصویر” کلیک کنید. شما می­‌توانید از رایانه خود تصویر را بارگذاری کنید یا یکی از کتابخانه رسانه وردپرس خود، تصویر را انتخاب کنید.

لازم به ذکر است که از تصاویری با فرمت jpg یا png استفاده کنید که بیش از 250px با 250px نباشد. WPForms اندازه تصاویر شما را تغییر نمی­‌دهند. قبل از آپلود کردن باید اطمینان حاصل کنید که آن­ها به اندازه مورد نظر خود هستند. از طرف دیگر، می‌­توانید قبل از افزودن آن­ها به فرم خود، تصویر خود را در خود WordPress ویرایش کنید. این کار برای این است که اگر همه عکس­‌ها اندازه یکسانی باشند، در هنگام نمایش بهتر به نظر خواهند رسید.

اگر بیش از 3 گزینه برای قرار دادن لیست تصاویر برای انتخاب در فرم وردپرسی دارید، کافی است روی دکمه (+) کلیک کنید تا یک انتخاب جدید اضافه شود. برای کاهش آن نیز می‌­توانید از دکمه (-) استفاده کنید.

 

تغییر نحوه انتخاب تصویر شما روی فرم

WPForms تغییر طرح انتخاب تصویر و سایر تنظیمات را از طریق تب ” Advanced Options ” آسان کرده است.

همانطور که می‌­بینید دارای یکسری گزینه‌­ها است که به ترتیب آن­ها را برای شما توضیح می‌­دهیم. اگر می­‌خواهید گزینه‌های تصویری در فرم وردپرس خود را بطور تصادفی و نه به ترتیب خاصی نمایش دهید، می‌توانید قسمت ” Randomize Choices ” را بررسی کنید. در صورت ایجاد نظرسنجی این گزینه برای شما بسیار مفید خواهد بود.

در زیر قسمت ” Image Choice Style “، شما می‌­توانید نحوه سبک و جایگذاری تصاویر خود را انتخاب کنید. سبک پیش فرض modern است که تصاویر به صورت زیر در کنار هم قرار گرفته‌­اند:

می‌توانید به جای آن، سبک کلاسیک را انتخاب کنید، که با انتخاب یکی از تصاویر به صورت زیر نمایش داده می‌­شود:

همچنین شما می‌­توانید گزینه “none” را برای سبک  نمایش انتخاب کنید. در این حالت، تصاویر شما به سادگی تصاویر معمولی و بدون حاشیه و یا یک ظاهر طراحی ساده خواهند بود به گونه‌­ای که برچسب­‌های هر عکس با radio buttons نشان داده می­‌شوند.

در صورت تمایل می‌­توانید چند ستونه بودن این عکس­‌ها را  با استفاده از روش ” Choice Layout ” تغییر دهید. پیش فرض “” Inline است و بسته به نوع انتخاب شما می­‌توانند گزینه‌های تصویری در فرم وردپرس را در کنار یکدیگر قرار دهید یا در چندین ستون و به صورت عمودی در کنار هم قرار بگیرند.

علاوه بر گزینه­‌هایی که گفته شد، گزینه ” Hide Label ” نیز برای گزینه­‌های تصویری در فرم وردپرس وجود دارد. این بدان معناست که هیچ متنی در زیر تصاویر به نمایش در نخواهد آمد. در برخی موارد، ممکن است انجام این کار منطقی باشد. به عنوان مثال ممکن است از مردم بخواهید نظر دهند که کدام یک از برند یا محصول جدید را دوست دارند.

افزودن، حذف یا ویرایش فیلدها در فرم

شما می­‌توانید فیلدهای موجود در فرم خود را اضافه، حذف یا ویرایش کنید. برای ویرایش یک فیلد کافیست روی آن کلیک کنید.

به عنوان مثال، ممکن است بخواهید قسمت “نظر یا پیام” را به صورت اختیاری تغییر دهید و یک برچسب متفاوتی در این قسمت داشته باشید. بعد از کلیک بر روی فیلد مورد نظر، می‌­توانید آن را در سمت چپ صفحه، ویرایش کنید. برای این کار ابتدا برچسب مورد نظر خود را تایپ و سپس  کادر ” Required ” را علامت بزنید تا قسمت مورد نظر انتخاب شود.

برای حذف فیلد، موس خود را روی آن مورد یا قسمتی از فرم خود قرار دهید و سپس روی نماد زباله قرمز کلیک کنید تا به راحتی حذف گردد.

و در آخر و پس ار ویرایش­‌های لازم، روی دکمه “Save” در بالای صفحه کلیک کنید.

اضافه کردن فرم به وبسایت

شما می­‌توانید فقط با چند کلیک، فرم خود را به هر پست یا صفحه­‌ای در سایت خود اضافه کنید. خب برای این کار ابتدا یک صفحه جدید باز می­‌کنیم. پس به قسمت صفحات بروید و افزودن جدید را بزنید، سپس روی دکمه (+) کلیک کنید تا یک بلوک به صفحه خود اضافه کنید. بلوک WPForms را در قسمت Widgets پیدا کنید، یا با استفاده از نوار جستجو  آن را جستجو کنید. سپس، بر روی بلوک کلیک کنید تا آن را به صفحه خود اضافه کنید.

در مرحله بعدی، بر روی دکمه ” Select a Form ” کلیک کنید و بر روی نام فرم خود کلیک و آن را انتخاب کنید.

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

اگر پس از نمایش، می­‌خواهید در فرم خود تغییراتی ایجاد کنید، می­‌توانید همان فرم را در WPForms  و در بخش All Forms پیدا کنید. هنگامی که تغییرات خود را ذخیره کردید، فرم شما به طور خودکار در صفحه شما نیز بروزرسانی می‌­شود و نیازی به دوباره اضافه کردن فرم به صفحه یا پست خود ندارید.

ایجاد تصاویر در فرم یک سایت وردپرسی

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

آموزش ویدیویی ساخت گزینه‌های تصویری در فرم

دانلود افزونه Contact Form by WPForms

دانلود افزونه Contact Form by WPForms صفحه افزونه