گستران وب

نسخه فارسی شده توسط تیم گستران وب در تاریخ ۹۶/۴/۳۱ اضافه شد

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

جداول واکنشگرا فارسی در وردپرس

تمامی آنچه برای نمایش جداول واکنشگرا در وردپرس می خواهید از طریق تنظیمات افزونه انجام می شود و سپس با شورت کد مورد نظر آن را در هر قسمتی از سایت که بخواهید می توانید به نمایش بگذارید.

شروع کار

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

بر روی گزینه ی اضافه کردن جدول کلیک کنید تا اولین جدول واکنشگرا را ایجاد کنیم.

اضافه کردن جدول

بعد از کلیک با یک پنجره پاپ آپ که در تصویر بالا میبینید، مواجه می شوید؛
ابتدا در فیلد اول یک عنوان برای جدول خود بنویسید، سپس در دو فیلد بعدی به ترتیب تعداد ردیف ها و تعداد ستون های جدول را تعیین کنید و در نهایت create را جهت ایجاد جدول کلیک کنید.

تنظیمات اصلی

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

تنظیمات

تب تنظیمات خود چند تب زیر مجموعه ی دیگر دارد:

 تب اصلی

  • عنوان : با فعال کردن آن عنوان جدول در بالای آن نمایش داده می شود.
  • شرح : یک توضیح برای جدول می توانید داشته باشید.
  • سربرگ: می توانید هدر جدول را با فعال کردن این گزینه نمایش دهید.
  • فوتر: می توانید هدر را با فعال کردن آن در فوتر هم نمایش دهید.
  • ایندکس خودکار: ردیف ها را برای شما اینکدس گذاری می کند که می توانید با گزینه های آن تنظیم کنید که یک ستون جداگانه را برای ایندکس گذاری داشته باشد یا همان ستون اول را بگیرد (این گزینه را انتخاب نکنید چون از اولین ستون اصلی شما استفاده می کند) و یا اینکه همان ستونی که شما می سازید را نمایش دهد.
تب طراح

  • مرز ها: برای جدول شما حاشیه ایجاد می کند.
  • کامپکت : جدول را کامپکت می کند یعنی فشرده می کند(ممکن است مقداری از جدول با این کار غیر قابل نمایش شود!).
  • مشخص کردن: با بردن ماوس بر روی ردیف ها آن ردیف هایلایت می شود.
  • حالت واکنشگرا: این گزینه را بر روی standard responsive mode یا حالت رسپانسیو استاندارد قرار دهید تا بصورت استاندارد با صفحه نمایش های متفاوت به درستی نشان داده شود.
تب Features

این قسمت هم تنظیمات فرعی را در بر دارد همانند عرض خودکار، مرتب سازی، ایجاد باکس جستجو، جستجو و مرتب سازی بر اساس، نمایش/عدم نمایش جدول های خالی و…

نکته: گزینه ایجاد باکس جستجو را ما فعال کردیم و در خروجی با هم مشاهده می کنیم، این باکس جستجو بصورت ایجکس می باشد و از درون همان جدول جستجو را انجام می دهد!

باقی گزینه ها برای نسخه ی پرمیوم می باشد!

تب زبان و متن

برای اینکه نمایش خروجی شما بصورت راست چین (برای ما فارسی زبانان) باشد از بخش Language زبان را برابر Persion قرار دهید.
از بخش سمت چپ این تب هم می توانید متن های پیش فرض را برای گزینه های مشخص تغییر دهید.

بخش اصلی کار ویرایشگر

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

نمایش خروجی

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

دانلود افزونه فارسی  Data Tables Generator by Supsystic

این مقاله چقدر براتون مفید بود؟

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *