ویجت جدول محتوا (table of contents) در المنتور

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

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

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

بخش محتوا در ویجت جدول محتوا المنتور

محتوایی که در المان جدول محتوا نمایش داده میشود در واقع خلاصه ای ساختاریافته از سرفصلهای اصلی متن صفحه است که به صورت خودکار توسط افزونه از تگهای هدینگ (مانند H2 و H3) موجود در محتوای شما استخراج میگردد. این فهرست به عنوان یک راهنمای ناوبری عمل میکند و با ارائه لینکهای داخلی به کاربران اجازه میدهد تا مستقیما به بخشهای مورد علاقه خود در مقاله پرش کنند که این ویژگی در بهبود تجربه کاربری و سئوی صفحه شما بسیار مؤثر است. 

گزینه جدول محتوا در table of contents المنتور

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

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

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

بخش استایل در المان جدول محتوا المنتور

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

گزینه باکس در ویجت جدول محتوا المنتور

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

بخش سربرگ در ویجت table of contents المنتور

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

گزینه لیست در المان جدول محتوا المنتور

در بخش لیست (List) تنظیمات استایل المان جدول محتوا شما کنترلهای دقیقی بر نحوه نمایش آیتمهای فهرست دارید. این تنظیمات شامل مواردی مانند انتخاب نوع آیکون یا گلولههای کنار هر عنوان مانند دایره شماره یا مربع، تنظیم فاصله عمودی بین هر لینک و مدیریت رنگ متن در حالت عادی و همچنین رنگ متن در حالت هاور هنگامی که کاربر ماوس را روی لینک میبرد است. این بخش به شما امکان میدهد تا خوانایی و جذابیت بصری لینکهای داخلی مقاله را به دلخواه خود تنظیم کنید.

بخش پیشرفته در ویجت جدول محتوا

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

بخش طرح بندی در ویجت جدول محتوا المنتور

در بخش طرح بندی (Layout) که زیرمجموعه تنظیمات پیشرفته شما میتوانید نحوه قرارگیری و رفتار المان در صفحه را مدیریت کنید. مهمترین گزینه در این بخش تنظیم موقعیت المان است که به شما امکان میدهد آن را به صورت چسبان (Sticky) درآورید تا هنگام اسکرول کاربر در کنار صفحه ثابت بماند. همچنین میتوانید تنظیمات مربوط به عرض المان ترتیب (Z-index) برای مدیریت روی هم افتادن عناصر و کلاسهای CSS اضافی را برای کنترل دقیقتر نحوه چیدمان بصری جدول محتوا در صفحه وب سایت خود اعمال کنید.

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

آموزش موشن افکت در table of contents المنتور

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

بخش تبدیل در ویجت جدول محتوا المنتور

در بخش تبدیل (Transform) که در تنظیمات پیشرفته المان های المنتور یافت میشود میتوانید تغییرات هندسی دقیقی روی المان اعمال کنید. این تنظیمات شامل گزینه هایی برای چرخاندن (Rotate) المان در محورهای مختلف تغییر مقیاس یا اندازه (Scale) کشیدن یا کج کردن (Skew) و جابجایی دستی موقعیت (Offset) آن بدون تاثیر بر چیدمان سایر عناصر صفحه است. این ابزارها برای ایجاد جلوه های بصری خلاقانه و دقیق در طراحی سایت شما بسیار مفید هستند.

 گزینه پس زمینه در جدول محتوا المنتور

در بخش پس زمینه (Background) تنظیمات پیشرفته شما میتوانید ظاهر پشت زمینه این ویجت را فراتر از تنظیمات باکس تغییر دهید. این بخش به شما امکان میدهد تا یک رنگ ثابت (Classic) یا یک گرادیان رنگی (Gradient) جذاب را به عنوان پس زمینه المان انتخاب کنید. همچنین میتوانید یک تصویر سفارشی را به جای رنگ آپلود کرده و تنظیمات مربوط به موقعیت اندازه و تکرار تصویر پس زمینه را مدیریت کنید تا جلوه بصری مورد نظر خود را دقیقا روی کادر جدول محتوا اعمال کنید.

آموزش حاشیه در ویجت جدول محتوا وردپرس

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

بخش ماسک در ویجت جدول محتوا المنتور

در بخش ماسک (Mask) که یکی از ویژگی های خلاقانه و پیشرفته در تنظیمات المنتور است شما میتوانید شکل ظاهری المان جدول محتوا یا هر المان دیگری را با استفاده از الگوهای مختلف تغییر دهید. به جای اینکه المان به صورت یک مستطیل ساده نمایش داده شود میتوانید شکلی مانند دایره مثلث یا الگوهای سفارشی دیگر را به عنوان ماسک انتخاب کنید. این قابلیت به شما امکان میدهد تا بخش هایی از المان را پنهان کرده و تنها قسمت مشخصی که توسط ماسک پوشانده شده را به نمایش بگذارید که برای ایجاد طرح های بصری منحصر به فرد و خارج از کادر بسیار مفید است.

آموزش واکنش گرا در جدول محتوا (table of contents) المنتور

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

بخش ویژگی ها در المان جدول محتوا المنتور

در بخش ویژگیها (Attributes) که در تنظیمات پیشرفته المان های المنتور موجود است شما میتوانید اوصاف سفارشی HTML را به عنصر اصلی المان اضافه کنید. این قابلیت برای توسعه دهندگان وب و کاربران پیشرفته مفید است زیرا به آنها اجازه میدهد تا داده های خاصی (مانند data-attributes) را برای تعامل با کدهای جاوا اسکریپت سفارشی یا بهبود سئوی فنی صفحه اضافه کنند. این ویژگیها مستقیما به کد HTML خروجی المان اضافه میشوند و امکان انعطاف پذیری بیشتر در پیاده سازی عملکردهای خاص و تعامل های پیشرفته را فراهم میکنند که فراتر از تنظیمات استاندارد المنتور است.

آموزش css سفارشی در ویجت جدول محتوا المنتور

در المنتور منظور از سفارشی سازی (Customization) مجموعه گستردهای از تنظیمات است که به شما امکان میدهد ظاهر رفتار و عملکرد المان جدول محتوا را دقیقا مطابق با نیازها و سلیقه خود تنظیم کنید. این سفارشی سازی شامل تغییر رنگها فونت ها حاشیه ها و پس زمینه در بخشهای استایل میشود و همچنین شامل تنظیمات پیشرفته تری مانند اعمال موشن افکت ها موقعیت دهی دقیق المان با استفاده از طرح بندی و افزودن کدهای CSS یا اوصاف HTML دلخواه برای ایجاد تغییرات منحصر به فرد در بخش پیشرفته است که در نهایت منجر به تولید یک خروجی بصری و کاربردی کاملا شخصی سازی شده میشود.

مزایای ویجت جدول محتوا المنتور

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

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

ویجت جدول محتوا در المنتور از نظر سئو

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

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

کلام آخر