نمایش نوار پیشرفت در وردپرس و نحوه استفاده از آن

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

منظور از نوار پیشرفت چیست؟

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

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

استفاده از نوار پیشرفت چه مزیتی دارد؟

نوارهای پیشرفت چندین مزیت را برای وب‌سایت‌ها ارائه می‌دهند که هم تجربه و هم تعامل کاربر را افزایش می‌دهند که برخی از آنها عبارت است از:

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

انواع نوار پیشرفت

به طور کلی می توان گفت، نوار پیشرفته دارای دو نوع مختلف می باشد:

• نوار پیشرفت خطی: نوار خطی به شما امکان می دهد بدون زحمت یک نوار خطی جذاب و قابل تنظیم را در هر بخش از پست ها یا صفحات خود اضافه کنید.
• نوار پیشرفت دایره ای: این به شما امکان می دهد تا یک نوار پیشرفت دایره ای بصری جذاب را در هر بخش از صفحه یا پست خود ادغام کنید.

نحوه اضافه کردن نوار پیشرفت به وردپرس

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

برای اینکار، در ابتدا وارد پیشخوان وردپرس خود شوید و سپس از بخش افزونه ها روی گزینه “افزودن” کلیک کنید. سپس نام افزونه را در باکس بالای صفحه وارد و سرچ نمائید. پس از اینکه افزونه برای شما نمایش داده شد، آن را نصب و فعال کنید.

پس از اینکه افزونه نصب شدن، وارد یک صفحه جدید شوید. از بخش “نوشته ها” روی گزینه “افزودن جدید” کلیک کنید.

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

سپس مشاهده خواهید کرد که یک نوار پیشرفت خطی به صفحه شما اضافه شده است.

افزونه Linear Progress Bar by Unlimited Blocks ابزاری ارزشمند برای افزایش جذابیت بصری و عملکرد وب سایت شما با افزودن یک نوار پیشرفت خطی براق و قابل تنظیم به پست ها یا صفحات شما است. برخی از ویژگی های ان عبارت است از:

• امکان نمایش پیشرفت از 0درصد تا 100 درصد
• گزینه های رنگ قابل تنظیم برای نوار پیشرفت
• گزینه ای برای نمایش برچسب درصد
• امکان سفارشی سازی عرض و ارتفاع نوار پیشرفت
• گزینه ای برای نمایش برچسب یا متنی که وضعیت پیشرفت را نشان می دهد
• امکان متحرک سازی نوار پیشرفت
• گزینه ای برای سفارشی کردن رنگ پس زمینه نوار پیشرفت
• امکان تعیین نقطه شروع مشخص برای نوار پیشرفت
• گزینه ای برای نمایش یک راهنمای ابزار با اطلاعات اضافی
• امکان سفارشی سازی سبک و طراحی نوار پیشرفت

همچنین می توانید از نوار پیشرفته دایره ای استفاده کنید:

برخی از ویژگی های نوار پیشرفت دایره ای عبارت است از:

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

پس از اینکه نوار دلخواه خود را اضافه کردید، می توانید آن را با استفاده از صفحه ساز المنتور نیز ویرایش کنید:

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

این افزونه همچنین انواع بلوک های مفید دیگر از جمله دکمه ها، تایمرهای شمارش معکوس، توصیفات، جابجایی ها و موارد دیگر را ارائه می دهد.

سوالات متداول

جمع بندی: چطور به سایتم نوار پیشرفت اضافه کنم؟

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

منبع: themehunk