جهش به محتوا
ورود کاربران
وبلاگوردپرسساخت جدول در وردپرس چطور انجام می شود
هر زمان نیاز به کمک داشتید، در کنار شما هستیم . با ما تماس بگیرید ( 031-3626 0000 ) یا درخواست خود را به صورت آنلاین ثبت نمایید.

ساخت جدول در وردپرس چطور انجام می شود

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

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

 

انواع جداول و کاربرد های آنها

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

انواع جداول و کاربرد های آنها

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

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

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

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

 

روش های ساخت جدول در وردپرس

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

روش های ساخت جدول در وردپرس

برای ساخت جدول در وردپرس روش های متعددی در اختیار شما قرار دارد که می توان آنها را به این صورت دسته بندی کرد:

  • استفاده از ادیتور ها
  • استفاده از افزونه ها
  • استفاده از سایت های واسط

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

اما در صورتی که شما نیاز به نمایش یک جدول تقریبا ثابت که اطلاعات آن به صورت ایستا می باشد دارید که سرعت سایت شما را پایین نیاورد و به صورت بهینه برای کاربران نمایش داده شود و یک استایل مدرن و متفاوت داشته باشد باید به سراغ سایت هایی که به شما جداول مختلف را بر اساس نیاز شما ارائه می کنند بروید و کد های HTML و CSS جدول خود را از این سایت ها دریافت کنید.

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

 

آموزش ساخت جدول در وردپرس با ادیتور گوتنبرگ

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

آموزش ساخت جدول در وردپرس با ادیتور گوتنبرگ

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

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

ادیتور گوتنبر برای ساخت حدول

 

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

ابزار ها در گوتنبرگ

 

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

جد.ل خالی در گوتنبرگ

 

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

داده های جدول گوتنبرگ

 

البته این جدول به این سادگی نخواهد ماند و شما این امکان را دارید که آن را تغییر داده و ویرایش کنید، در صورتی که روی آن کلیک کنید یک منوی ابزار در اختیار شما قرار می گیرد که گزینه های مختلفی را در اختیار شما می گذارد:

ویرایش جدول در گوتنبرگ

 

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

در پایین جدول نیز بخشی برای وارد کردن توضیحات جدول وجود دارد که با عبارت Add Caption مشخص شده است.

 

ساخت جدول در ادیتور کلاسیک

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

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

ساخت جدول در ادیتور کلاسیک

 

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

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

 

ساخت جدول در وردپرس با استفاده از افزونه

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

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

نصب افزونه TablePress

 

بعد از این که کار نصب و فعالسازی این افزونه به اتمام رسید، مسیری به صورت پیشخوان > TablePress به ما نمایش داده خواهد شد که با استفاده از آن می توانید به تمامی گزینه هایی که این افزونه برای ساخت جدول در وردپرس در اختیار ما قرار می دهد دسترسی داشته باشید. در صورتی که روی این گزینه کلیک کنید به صفحه زیر منتقل خواهید شد که شما می توانید تمام جدول هایی که ساخته اید را در این بخش مشاهده کنید:

صفحه اول افزونه TablePress

 

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

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

جدول جدید در افزونه TablePress

 

کاری که در این صفحه باید انجام دهید این است که اطلاعات مربوط به جدول یعنی نام جدول، توضیحات جدول(که البته اختیاری است)، تعداد سطر ها و تعداد ستون های جدول خود را وارد کرده و روی Add Table کلیک کنید. بعد از این کار شما به صفحه زیر منتقل خواهید شد:

تنظیمات افزونه TablePress

 

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

 

Table Information (اطلاعات جدول)

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

اطلاعات جدول در افزونه TablePress

 

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

 

Table Content (محتوای جدول)

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

Table Content (محتوای جدول)

 

Table Manipulation (دستکاری جدول)

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

Table Manipulation (دستکاری جدول)

 

برای اینکه از این امکانات استفاده کنید لازم است که روی هر یک از برچسب هایی که می خواهید پیاده سازی کنید کلیک کرده و بعد از آن روی خانه مورد نظر در جدول کلیک کنید. به عنوان مثال اولین گزینه که Insert Link می باشد را انتخاب کرده و روی اولین خانه از جدول که در بخش قبلی ما قرار دارد کلیک می کنیم و این ادیتور لینک به ما نمایش داده خواهد شد:

ادیتور لینک در افزونه TablePress

 

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

 

Table Option (امکانات جدول)

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

Table Option (امکانات جدول)

 

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

 

Features of dataTables JavaScript Library (امکانات کاربری)

مواردی که در این بخش تنظیم می کنید، تعیین کننده این هستند که کاربر شما می تواند چه امکاناتی را روی این جدول داشته باشد و خودش طور با این جدول کار کند. به عنوان مثال شما می توانید این امکان را به کاربر بدهید که ستون های جدول را بر اساس نیازی که دارد Sort و مرتب کند، با این امکان کاربر با یک کلیک می تواند کارهایی مانند مرتب سازی بر اساس قیمت و یا بر اساس محبوبیت را روی داده های جدول شما پیاده سازی کند.

Features of dataTables JavaScript Library (امکانات کاربری)

 

در این بخش هم شما در صورتی که بخواهید از اسکریپت های اضافی روی جدول خود استفاده کنید این امکان را خواهید داشت.

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

اما در خیلی از موارد باز هم این جداول می تواند رضایت بخش نباشد. در این حالت باید گفت که شما امکان پیاده سازی جداولی با تمامی ویژگی هایی که دارید را خواهید داشت. در ادامه این مورد را بررسی می کنیم.

 

ساخت جدول در وردپرس بوسیله سایت های واسط

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

یکی از سایت های کاربردی که این کار را برای ما انجام می دهد DIVTABLE می باشد. در این سایت شما امکان اینکه یک جدول را طراحی کرده و استایل آن را تغییر دهید را خواهید داشت. وقتی که وارد این سایت بشوید، در کادری مانند زیر باید سایز و مشخصات جدول خود را تعیین کنید:

ساخت جدول در وردپرس بوسیله سایت های واسط

 

بعد از این که اطلاعات جدول را مشاهده کردید با کلیک روی دکمه #STYLER که در سمت راست تصویر بالا قابل مشاهده است، به بخش استایل دهی به جدول منتقل شده و می توانید به تمامی تنظیماتی که در این رابطه انجام می گیرد دسترسی داشته باشید:

استایل دهی به جدول

 

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

خروجی جدول برای وردپرس

 

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

 

نتیجه گیری

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

این مقاله برای شما مفید بود؟
بلهخیر

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

Solve : *
30 − 29 =