نسخه ۴ المنتور را میتوان یکی از مهمترین بهروزرسانیهای این صفحهساز محبوب دانست؛ بهروزرسانیای که فقط چند قابلیت جدید به المنتور اضافه نمیکند، بلکه شیوه طراحی صفحات در وردپرس را هم تغییر میدهد.
مهمترین اتفاق در نسخه جدید المنتور، معرفی المانهای اتمی المنتور (Atomic Elements) است؛ قابلیتی که زیرساخت طراحی صفحات را هوشمندتر، سبکتر و منعطفتر میکند. اگر میخواهید بدانید Elementor Atomic Elements دقیقاً چیست، چه تفاوتی با ویجتهای فعلی دارد و چرا این قابلیت آینده المنتور را متحول میکند، در ادامه همراه ما باشید.
المانهای اتمی المنتور چیست و چه تغییری در طراحی سایت ایجاد میکند؟
المانهای اتمی المنتور (Atomic Elements) را میتوان نسل جدیدی از عناصر طراحی در المنتور دانست که با یک هدف مهم معرفی شدهاند: ساخت وبسایتهای سبکتر، سریعتر و بهینهتر.
اگر مدتی با المنتور کار کرده باشید، احتمالاً متوجه شدهاید که حتی یک عنصر ساده مثل یک تیتر یا دکمه، در پشت صحنه ساختارهای مختلفی ایجاد میکند. این ساختارها در پروژههای بزرگ، مخصوصاً سایتهایی که صفحات زیادی دارند، میتوانند روی حجم کد، سرعت بارگذاری و عملکرد سایت تأثیر بگذارند.
در نسخه جدید المنتور، رویکرد کمی متفاوت شده است. با معرفی Elementor Atomic Elements، المنتور تلاش کرده ساختار عناصر را سادهتر و ماژولارتر کند. نتیجه این تغییر، کدهای سبکتر، رندر سریعتر صفحات و تجربه کاربری بهتر برای بازدیدکنندگان سایت است.
البته باید توجه داشته باشید که این تغییر یکشبه اتفاق نیفتاده است. هنوز تمام عناصر المنتور به ساختار اتمی منتقل نشدهاند و این مسیر بهصورت مرحلهای در حال توسعه است. در حال حاضر عناصر پرکاربردی مانند تیترها، تصاویر و تبها (Tabs) از این معماری جدید استفاده میکنند. همچنین برخی امکانات پیشرفتهتر مانند فرمهای اتمی در نسخه پرو المنتور در دسترس هستند.
بنابراین اگر بعد از آپدیت به نسخه ۴ المنتور انتظار دارید تمام ویجتهای قدیمی بهطور کامل تغییر کرده باشند، باید بدانید که این یک فرآیند تدریجی است و المنتور در حال حرکت به سمت یک معماری جدید است.
چطور المانهای اتمی المنتور را فعال کنیم؟
فعالسازی المانهای اتمی المنتور فرآیند پیچیدهای نیست و در چند مرحله ساده انجام میشود. فقط قبل از شروع، مطمئن شوید که سایت شما شرایط لازم برای استفاده از این قابلیت جدید را دارد.
۱. بررسی نسخه المنتور
اولین قدم این است که مطمئن شوید از نسخه ۴ المنتور یا نسخههای جدیدتر استفاده میکنید. قابلیتهای جدید المنتور، از جمله Atomic Elements، در نسخههای قدیمیتر در دسترس نیستند.
اگر از قالبهایی استفاده میکنید که المنتور را بهعنوان صفحهساز اصلی پیشنهاد میدهند، احتمالاً این افزونه از قبل روی سایت شما نصب شده است. در این حالت فقط کافی است وارد بخش افزونهها شوید و نسخه فعلی المنتور را بررسی کنید.
۲. المنتور را به آخرین نسخه بهروزرسانی کنید
برای استفاده بهتر از Elementor Atomic Elements، پیشنهاد میشود همیشه از جدیدترین نسخه المنتور استفاده کنید.
برای انجام این کار:
- وارد پیشخوان وردپرس شوید.
- به بخش بهروزرسانیها بروید.
- اگر نسخه جدیدی از المنتور منتشر شده بود، آن را نصب کنید.
همچنین میتوانید از بخش «افزونهها» در پیشخوان وردپرس، المنتور را پیدا کرده و آن را بهروزرسانی کنید.
بهروزرسانیهای جدید معمولاً علاوه بر اضافه کردن قابلیتهای تازه، مشکلات نسخههای قبلی را هم برطرف میکنند و باعث میشوند تجربه کار با المنتور روانتر باشد.
۳. رفتن به بخش تنظیمات المنتور
از پیشخوان وردپرس، روی تب «المنتور» رفته و از بخش «ویرایشگر»، روی «تنظیمات» کلیک کنید.
در این صفحه، تبی به نام ویرایشگر اتمیک وجود دارد. وارد آن شده و دکمه «تجربه جدید را فعال کنید» را فشار دهید.
۴. فعالسازی المانهای اتمی
در این مرحله کافی است تیک گزینه «خواندم و متوجه شدم» را زده و دکمه «فعال» را بزنید.
بعد از فعال شدن، المانهای اتمی المنتور در کنار ابزارهای معمولی المنتور قرار میگیرند و میتوانید در طراحی صفحات خود از هر دو نوع عنصر، یعنی ویجتهای قدیمی و عناصر اتمی، بهصورت همزمان استفاده کنید.
این یعنی نیازی نیست پروژههای قبلی خود را تغییر دهید یا همه چیز را از ابتدا بسازید؛ بلکه میتوانید بهمرور با معماری جدید المنتور آشنا شوید و از قابلیتهای آن در طراحی سایت با المنتور استفاده کنید.
در هنگام ورود به ویرایش با المنتور در برگههای خود، با چنین پیامی مواجه خواهید شد. این نشان میدهد که فعالسازی عناصر اتمی المنتور برای شما با موفقیت انجام شده است.
ویژگیهای اصلی معماری Atomic در المنتور
هر عنصر به یک کامپوننت ماژولار تبدیل میشود
در سیستم جدید، هر عنصر مانند عنوان، دکمه، تصویر و سایر بخشها به شکل یک کامپوننت مستقل ساخته میشود. این عناصر با ساختار HTML سادهتر و سبکتر ایجاد میشوند تا مرورگر بتواند آنها را سریعتر پردازش کند.
نتیجه این تغییر، افزایش سرعت نمایش صفحات و بهبود عملکرد سایت است.
استایلدهی بر پایه CSS انجام میشود
یکی از تغییرات مهم در Elementor Atomic Elements، تمرکز بیشتر روی CSS و سیستم طراحی یکپارچه است.
با استفاده از کلاسهای سراسری (Global Classes) و متغیرهای طراحی (Variables)، میتوان تغییرات ظاهری را بهصورت منظم در تمام بخشهای سایت اعمال کرد.
برای مثال، اگر رنگ اصلی در طراحی دکمههای سایت را تغییر دهید، این تغییر میتواند در تمام صفحات و بخشهای مرتبط اعمال شود؛ بدون اینکه مجبور باشید هر عنصر را جداگانه ویرایش کنید.
محتوا از ساختار و ظاهر جدا میشود
در پروژههای تیمی یا زمانی که سایت را به مشتری تحویل میدهید، جدا بودن محتوا از طراحی یک مزیت بزرگ محسوب میشود.
با این ساختار، افراد مختلف میتوانند روی محتوا کار کنند، بدون اینکه نگرانی بابت خراب شدن طراحی یا تنظیمات ظاهری سایت داشته باشند.
مهمترین ویژگیهای Atomic Editor در نسخه ۴ المنتور
نسخه جدید المنتور فقط یک تغییر ظاهری یا اضافه شدن چند ابزار جدید نیست؛ بلکه با معرفی Elementor Atomic Elements، ساختار طراحی سایت با المنتور وارد مرحله جدیدی شده است.
ویرایشگر اتمی المنتور (Atomic Editor) مجموعهای از قابلیتهای جدید را ارائه میدهد که هدف همه آنها سادهتر کردن فرآیند طراحی، افزایش هماهنگی بین بخشهای مختلف سایت و ایجاد یک سیستم طراحی حرفهایتر است.
در ادامه با مهمترین تغییرات و ویژگیهای این معماری جدید آشنا میشویم.
۱. کامپوننتهای اتمی (Atomic Components)
یکی از مهمترین قابلیتهایی که در المانهای اتمی المنتور معرفی شده، مفهوم کامپوننتها (Components) است.
کامپوننتها به شما اجازه میدهند بخشهایی از طراحی سایت را بهصورت یک عنصر قابل استفاده مجدد ذخیره کنید و در قسمتهای مختلف سایت به کار ببرید.
برای درک بهتر، میتوانید کامپوننتها را نسخه پیشرفتهتر قالبهای آماده در المنتور در نظر بگیرید. اما تفاوت مهم اینجاست که کامپوننتها فقط یک کپی ساده از یک طراحی نیستند؛ بلکه ارتباط خود را با تمام نمونههایی که در سایت استفاده شدهاند حفظ میکنند.
فرض کنید یک بخش از سایت مثل کارت معرفی خدمات، باکس ویژگیهای محصول یا یک بخش دعوت به اقدام (CTA) طراحی کردهاید. حالا میتوانید آن بخش را به یک کامپوننت تبدیل کنید، برای آن یک نام مشخص انتخاب کنید و در صفحات مختلف سایت از همان ساختار استفاده کنید.
حالا اگر بعداً این کامپوننت را ویرایش کنید، تمام نمونههای استفادهشده از آن در سایت بهصورت خودکار بهروزرسانی میشوند؛ چه تغییرات مربوط به ساختار باشند و چه تغییرات ظاهری و استایل.
این قابلیت برای پروژههای بزرگ یک مزیت بسیار مهم محسوب میشود؛ چون به تیمهای طراحی کمک میکند یک سیستم طراحی یکپارچه داشته باشند و بدون نیاز به ویرایش دستی دهها صفحه، تغییرات را در کل سایت اعمال کنند.
به زبان ساده، کامپوننتهای اتمی المنتور باعث میشوند طراحی سایت با المنتور از حالت ساخت صفحات جدا از هم خارج شود و به سمت یک ساختار منظمتر و حرفهایتر حرکت کند.
۲. ویرایش مستقیم داخل صفحه (Inline Editing)
یکی از تغییرات کاربردی در نسخه جدید المنتور، امکان ویرایش مستقیم متنها در همان محیط طراحی است. در گذشته، برای تغییر محتوای یک عنوان یا پاراگراف در المنتور معمولاً باید بین پنل تنظیمات و صفحه طراحی جابهجا میشدید؛ اما با معرفی Inline Editing این روند سادهتر شده است.
در معماری جدید Elementor Atomic Elements، عناصر متنی مانند عنوانها (Heading) و پاراگرافها بهصورت مستقیم روی بوم طراحی قابل ویرایش هستند. یعنی کافی است روی متن موردنظر کلیک کنید و همان لحظه شروع به تغییر آن کنید؛ بدون اینکه نیاز باشد هر بار وارد پنل تنظیمات شوید.
تغییراتی که روی متن اعمال میکنید، بهصورت لحظهای نمایش داده میشوند و همزمان با تنظیمات موجود در پنل المنتور هماهنگ باقی میمانند.
یکی از بخشهای جذاب این قابلیت، نوار ابزار شناور (Floating Toolbar) است که هنگام انتخاب متن ظاهر میشود. این نوار ابزار، گزینههای پرکاربرد ویرایش متن را در همان نزدیکی قرار میدهد تا بدون قطع شدن روند طراحی، بتوانید تغییراتی مثل قالببندی متن را اعمال کنید.
از دیگر امکانات Inline Editing در نسخه ۴ المنتور میتوان به موارد زیر اشاره کرد:
- پشتیبانی از میانبرهای صفحهکلید برای سرعت بیشتر در ویرایش
- قرار گرفتن نوار ابزار در محدوده قابل مشاهده صفحه
- اعمال تغییرات ظاهری بهصورت کاملاً بصری
- بینیازی از کار با کدهای HTML برای تنظیم ظاهر متن
این قابلیت شاید در نگاه اول یک تغییر کوچک به نظر برسد، اما در پروژههای بزرگ و هنگام طراحی صفحات متعدد، باعث میشود فرآیند طراحی سایت با المنتور سریعتر و روانتر انجام شود. حالا طراحان میتوانند بیشتر روی خود صفحه تمرکز کنند و کمتر درگیر جابهجایی بین تنظیمات مختلف باشند.
۳. تبهای اتمی (Atomic Tabs)
یکی دیگر از قابلیتهای مهمی که در Elementor Atomic Editor معرفی شده، ابزار Atomic Tabs است؛ قابلیتی که کنترل بیشتری روی طراحی بخشهای تبدار در صفحات سایت در اختیار طراحان قرار میدهد.
در نسخههای قبلی المنتور، ویجت تبها معمولاً یک ساختار یکپارچه داشت؛ یعنی تمام بخشهای مربوط به تب، از منوی تبها گرفته تا محتوای داخل آن، در قالب یک ویجت واحد مدیریت میشدند. این روش اگرچه برای طراحیهای ساده کاربردی بود، اما در پروژههای حرفهایتر محدودیتهایی ایجاد میکرد.
در نسخه جدید المنتور، رویکرد تغییر کرده است. با معرفی المانهای اتمی المنتور، ساختار تبها به چند بخش مستقل تقسیم شده است. هر بخش بهصورت جداگانه قابل تنظیم و شخصیسازی است و طراح کنترل بیشتری روی ظاهر و عملکرد هر قسمت دارد.
ساختار Atomic Tabs شامل بخشهای زیر است:
- پوسته اصلی تبها (Tabs Main Wrapper): این بخش، چارچوب اصلی تبها را تشکیل میدهد و تمام قسمتهای مربوط به منو و محتوا داخل آن قرار میگیرند.
- منوی تبها (Tabs Menu): ردیفی که دکمهها یا گزینههای انتخاب تبها در آن نمایش داده میشوند. این بخش میتواند بهصورت مستقل استایلدهی شود.
- محرک تب (Tab Trigger): هر تب قابل کلیک، یک عنصر مستقل محسوب میشود. به همین دلیل میتوان ظاهر هر گزینه مانند رنگ، فاصله، حالت فعال و افکتهای آن را جداگانه مدیریت کرد.
- ناحیه محتوای تبها (Tabs Content Area): محلی که تمام بخشهای محتوایی تبها در آن قرار میگیرند و ساختار کلی نمایش محتوا را مدیریت میکند.
- پنل محتوای هر تب (Tab Content Panel): هر تب دارای یک پنل محتوایی مستقل است که میتوان محتوای آن را جداگانه طراحی و تنظیم کرد.
۴. تعاملات ورود (Entrance Interactions)
یکی دیگر از قابلیتهای جدید در نسخه ۴ المنتور، سیستم تعاملات اتمی (Atomic Interactions) است که اولین مرحله از مسیر جدید المنتور برای اضافه کردن حرکتها و انیمیشنهای حرفهای به عناصر سایت محسوب میشود.
با استفاده از Entrance Interactions، طراحان میتوانند بدون کاهش سرعت سایت، افکتهای حرکتی جذابی به بخشهای مختلف صفحات اضافه کنند. هدف این قابلیت این است که ایجاد انیمیشن در طراحی سایت با المنتور سادهتر شود، بدون اینکه عملکرد و پرفورمنس سایت تحت تأثیر قرار بگیرد.
در ویرایشگر جدید المنتور، یک بخش اختصاصی با نام Interactions به پنل تنظیمات اضافه شده است. این بخش در کنار گزینههای عمومی (General) و استایل (Style) قرار دارد و تمام تنظیمات مربوط به تعاملات و افکتهای حرکتی را در یک محیط منظم در اختیار شما قرار میدهد.
تنظیمات قابل استفاده در Entrance Interactions
در این بخش میتوانید مشخص کنید که انیمیشنها چگونه و چه زمانی اجرا شوند:
محرکها (Triggers)
تعیین میکنند که افکت حرکتی چه زمانی فعال شود:
- On Page Load: اجرای انیمیشن هنگام بارگذاری صفحه
- On Scroll Into View: اجرای انیمیشن زمانی که عنصر وارد محدوده دید کاربر میشود
افکتها (Effects)
برای انتخاب نوع حرکت عنصر:
- Fade: ظاهر شدن تدریجی عنصر
- Slide: ورود عنصر با حرکت از یک جهت مشخص
- Scale: تغییر اندازه هنگام ورود
نوع حرکت (Type)
مشخص میکند که افکت برای ورود عنصر باشد یا خروج آن:
- In: ورود عنصر به صفحه
- Out: خروج عنصر از صفحه
جهت حرکت (Directions)
میتوانید مسیر حرکت را مشخص کنید:
- بالا (Up)
- پایین (Down)
- چپ (Left)
- راست (Right)
مدت زمان اجرا (Duration)
زمان اجرای انیمیشن را میتوان بین ۰.۱ تا ۳ ثانیه تنظیم کرد.
تأخیر اجرا (Delay)
با این گزینه مشخص میکنید انیمیشن پس از چه مدت شروع شود. این مقدار میتواند بین ۰ تا ۲ ثانیه تنظیم شود.
یکی از ویژگیهای جذاب Entrance Interactions این است که میتوانید چند افکت را همزمان روی یک عنصر اعمال کنید. برای مثال، یک بخش میتواند همزمان با افکت Fade ظاهر شود، کمی Slide داشته باشد و با Scale بزرگتر شود تا حرکت طبیعیتر و چشمنوازتری ایجاد کند.
همچنین یک گزینه پیشنمایش (Preview) داخلی وجود دارد که به شما اجازه میدهد بدون خروج از محیط طراحی، انیمیشن را بارها اجرا کنید و زمانبندی و نحوه حرکت آن را تنظیم کنید.
البته این قابلیت هنوز در ابتدای مسیر خود قرار دارد. المنتور اعلام کرده که سیستم تعاملات در نسخههای آینده توسعه پیدا خواهد کرد و امکانات بیشتری برای ساخت تجربههای تعاملی و پویا به Elementor Atomic Elements اضافه خواهد شد.
۵. حالت ترکیبی لایهها (Blend Mode)
یکی از قابلیتهای جدیدی که در نسخه جدید المنتور به ویرایشگر اضافه شده، گزینه Blend Mode است. این قابلیت به شما اجازه میدهد نحوه ترکیب شدن یک عنصر با لایههای پشت آن را کنترل کنید و جلوههای بصری جذابتری در طراحی صفحات ایجاد کنید.
در گذشته برای ساخت بسیاری از افکتهای ترکیبی، طراحان معمولاً مجبور بودند از کدنویسی CSS یا ابزارهای ویرایش تصویر استفاده کنند. اما حالا با استفاده از Blend Mode در Elementor Atomic Elements، این امکان مستقیماً داخل محیط المنتور در اختیار شما قرار گرفته است.
این قابلیت بر پایه حالتهای ترکیبی CSS کار میکند و شامل ۱۶ حالت مختلف مانند موارد زیر است:
- Multiply
- Screen
- Overlay
- Darken
- Lighten
- و حالتهای ترکیبی دیگر
با استفاده از این گزینهها میتوانید افکتهای مختلفی ایجاد کنید؛ از ترکیب ظریف تصاویر پسزمینه گرفته تا ساخت نوشتههای خاص، ایجاد کنتراستهای جذاب یا طراحی ترکیببندیهای چندلایه.
برای مثال، میتوانید یک تصویر پسزمینه را با رنگ برند سایت ترکیب کنید، روی تصاویر افکتهای نوری ایجاد کنید یا ظاهر متنها را بدون نیاز به ابزارهای جانبی خاصتر کنید.
در واقع Blend Mode یکی از قابلیتهایی است که نشان میدهد المنتور در مسیر تبدیل شدن به یک ابزار حرفهایتر برای طراحی بصری حرکت میکند و امکاناتی را که قبلاً بیشتر در اختیار طراحان مسلط به کدنویسی بود، به محیط بدون کد خود اضافه کرده است.
۶. CSS سفارشی (Custom CSS)
قابلیت Custom CSS در Elementor Atomic Editor نیز بازطراحی شده و حالا کنترل بیشتری برای کاربران حرفهای فراهم میکند.
در نسخههای قبلی المنتور، امکان افزودن CSS سفارشی وجود داشت؛ اما در معماری جدید، این بخش ساختار منظمتر و ایزولهتری پیدا کرده است تا توسعهدهندگان بتوانند بدون نگرانی از تداخل استایلها، کدهای CSS خود را مدیریت کنند.
مهمترین ویژگیهای Custom CSS جدید عبارتاند از:
اعمال CSS فقط روی همان عنصر
یکی از مشکلات رایج در طراحی سایت، ایجاد تداخل بین کدهای CSS مختلف است. در سیستم جدید، استایلهایی که برای یک عنصر مینویسید فقط روی همان عنصر اعمال میشوند و احتمال خراب شدن بخشهای دیگر سایت کاهش پیدا میکند.
پشتیبانی از کلاسهای سراسری (Global Classes)
حالا میتوانید CSS سفارشی را به کلاسهای سراسری اضافه کنید و همان استایل را روی چندین عنصر مختلف در سایت اعمال کنید.
این ویژگی برای ساخت یک سیستم طراحی یکپارچه بسیار کاربردی است؛ چون به جای تکرار کد، یک استایل مشخص را در بخشهای مختلف استفاده میکنید.
استایلدهی برای حالتهای مختلف عناصر
در نسخه جدید المنتور میتوانید CSS مربوط به حالتهای مختلف مانند:
- Hover (زمان قرار گرفتن نشانگر روی عنصر)
- Focus (زمان انتخاب عنصر)
- Active (حالت فعال)
را مستقیماً از بخش Style مدیریت کنید.
محیط کدنویسی بهتر برای توسعهدهندگان
ویرایشگر CSS جدید امکاناتی مانند موارد زیر دارد:
- پیشنهاد خودکار کدها (Autocomplete)
- امکان افزودن توضیحات داخل کدها
- فضای بیشتر برای نوشتن کدهای طولانیتر
کنترل کامل واکنشگرایی (Responsive)
میتوانید برای هر دستگاه، قوانین CSS جداگانه تعریف کنید:
- دسکتاپ
- تبلت
- موبایل
این قابلیت باعث میشود کنترل دقیقتری روی نمایش عناصر در اندازههای مختلف صفحه داشته باشید.
پیشنمایش لحظهای تغییرات
یکی از ویژگیهای کاربردی Custom CSS جدید این است که تغییرات بلافاصله در محیط طراحی نمایش داده میشوند و نیازی به ذخیره مداوم یا بررسی جداگانه صفحه نیست.
چرا سادهتر شدن ساختار المنتور اهمیت دارد؟
شاید در نگاه اول فکر کنید تفاوت چندانی ندارد که یک عنوان ساده با چند لایه مختلف از عناصر HTML ساخته شود یا با یک ساختار سبکتر. اما همین تفاوتهای کوچک در پروژههای واقعی، مخصوصاً سایتهای بزرگ، میتوانند تأثیر قابل توجهی روی سرعت سایت و عملکرد آن داشته باشند.
یکی از مشکلاتی که خیلی از طراحان هنگام بررسی سایت با ابزارهایی مثل Google PageSpeed Insights با آن مواجه میشوند، زیاد بودن تعداد عناصر تودرتوی HTML است. این موضوع فقط یک هشدار فنی ساده نیست؛ بلکه مستقیماً با نحوه پردازش صفحه توسط مرورگر ارتباط دارد.
وقتی کاربر وارد یک صفحه از سایت شما میشود، مرورگر باید تمام ساختار HTML، استایلها و ارتباط بین عناصر مختلف را پردازش کند. هرچه این ساختار پیچیدهتر و لایههای آن بیشتر باشد، منابع بیشتری از دستگاه کاربر مصرف میشود و ممکن است زمان نمایش صفحه افزایش پیدا کند.
برای اینکه بهتر متوجه این موضوع شوید، میتوانید در مرورگر کروم روی عنوان یک تب کلیک راست کنید و میزان مصرف حافظه آن صفحه را بررسی کنید. معمولاً هرچه این مقدار کمتر باشد، نشاندهنده ساختار سبکتر و تجربه روانتر برای کاربر است.
این موضوع در سایتهایی که طراحیهای سنگین و پرجزئیات دارند اهمیت بیشتری پیدا میکند. بعضی از وبسایتها با استفاده از افکتهای جذاب، سایههای متعدد، طراحیهای شیشهای (Glassmorphism)، مگامنوهای پیچیده و انیمیشنهای مختلف، ظاهر بسیار چشمگیری ایجاد میکنند؛ اما پشت این ظاهر زیبا ممکن است تعداد زیادی عنصر HTML و کدهای CSS وجود داشته باشد.
نتیجه این اتفاق برای کاربری که با یک گوشی قدیمیتر یا سیستم سختافزاری ضعیفتر وارد سایت میشود، میتواند تجربهای آزاردهنده باشد؛ از کند شدن صفحه گرفته تا تأخیر در نمایش بخشهای مختلف سایت.
اینجاست که المانهای اتمی المنتور اهمیت خودشان را نشان میدهند. این ساختار جدید با سادهتر کردن معماری عناصر و کاهش لایههای غیرضروری، کمک میکند صفحات سبکتر باشند، منابع کمتری مصرف کنند و عملکرد بهتری روی دستگاههای مختلف داشته باشند.
به زبان ساده، هدف Elementor Atomic Elements فقط تغییر روش طراحی نیست؛ بلکه ایجاد تعادل بین ظاهر حرفهای و عملکرد بهتر سایت است.
مزایای دیگر المانهای اتمی المنتور
تا اینجا بیشتر درباره تأثیر المانهای اتمی المنتور روی سرعت و عملکرد سایت صحبت کردیم، اما این معماری جدید فقط برای سبکتر شدن صفحات معرفی نشده است. چند تغییر دیگر هم وجود دارد که تجربه کار با المنتور را برای طراحان سادهتر و حرفهایتر میکند.
کنترل بهتر برای طراحی واکنشگرا (Responsive)
یکی از نقاط قوت نسخه جدید المنتور، کنترل دقیقتر روی نمایش عناصر در دستگاههای مختلف است.
حالا تنظیمات مربوط به هر دستگاه ساختار منظمتری پیدا کردهاند و میتوانید برای هر حالت، تنظیمات جداگانه داشته باشید. برای مثال، ممکن است بخواهید رنگ یک عنوان در دسکتاپ مشکی باشد، در تبلت کمی متفاوت نمایش داده شود و در موبایل رنگ دیگری داشته باشد.
این سطح از کنترل باعث میشود طراحی سایت با المنتور برای صفحهنمایشهای مختلف انعطافپذیرتر باشد و دیگر مجبور نباشید با راهحلهای پیچیده یا کدنویسی اضافی، ظاهر سایت را برای دستگاههای مختلف تنظیم کنید.
مدیریت سادهتر تنظیمات
یکی از تغییرات مثبت Elementor Atomic Elements، مرتبتر شدن ساختار تنظیمات عناصر است.
در نسخههای جدید، گزینهها دستهبندی منظمتری دارند و پیدا کردن تنظیماتی که نیاز دارید سریعتر انجام میشود. این موضوع شاید در پروژههای کوچک خیلی به چشم نیاید، اما وقتی روی صفحات زیاد یا پروژههای بزرگ کار میکنید، باعث صرفهجویی قابل توجهی در زمان میشود.
تجربه روانتر هنگام طراحی
سبکتر شدن ساختار عناصر فقط روی بازدیدکنندگان سایت تأثیر نمیگذارد؛ خود طراح هم هنگام کار با ویرایشگر المنتور تجربه بهتری خواهد داشت.
وقتی تعداد لایهها و ساختارهای اضافی کمتر شود، محیط طراحی سریعتر واکنش نشان میدهد و کار کردن با صفحهساز روانتر میشود. در نتیجه هم فرآیند طراحی برای شما راحتتر خواهد بود و هم کاربران نهایی سایت تجربه بهتری خواهند داشت.
جمعبندی؛ آیا از المنتهای اتمی استفاده کنیم؟
حالا به سؤال مهم میرسیم: آیا باید همین الان سراغ المانهای اتمی المنتور برویم یا بهتر است فعلاً صبر کنیم؟
پاسخ به شرایط سایت شما بستگی دارد. این تغییر چیزی نیست که المنتور بهصورت خودکار روی تمام پروژههای قدیمی اعمال کند.
دلیل این تصمیم هم منطقی است. تصور کنید سایتی چند سال با ساختار قبلی المنتور ساخته شده و تعداد زیادی صفحه، قالب و تنظیمات مختلف دارد. اگر سیستم بهصورت خودکار همه عناصر را تغییر دهد، احتمال دارد بعضی بخشها دچار مشکل شوند یا ظاهر سایت تغییر کند.
به همین دلیل، المنتور این انتقال را به انتخاب خود کاربران گذاشته است. یعنی اگر میخواهید از مزایای معماری جدید استفاده کنید، باید عناصر قدیمی را بهتدریج بررسی کرده و در صورت نیاز با عناصر اتمی جایگزین کنید.
اما چه زمانی بهتر است از این قابلیت استفاده کنیم؟
اگر یک سایت جدید طراحی میکنید
در این حالت بهتر است از همان ابتدا سراغ المانهای اتمی المنتور بروید. وقتی پروژه تازه شروع شده است، دلیلی برای استفاده از ساختار قدیمی وجود ندارد و از همان ابتدا میتوانید یک سایت سبکتر و منظمتر بسازید.
اگر یک سایت قدیمی و پربازدید دارید
در این شرایط بهتر است عجله نکنید. تغییر دادن تعداد زیادی از عناصر یک سایت فعال بدون تست قبلی، میتواند ریسک ایجاد مشکل داشته باشد.
بهتر است ابتدا تغییرات را روی یک صفحه آزمایشی یا نسخه تست انجام دهید، عملکرد آن را بررسی کنید و سپس بهمرور بخشهای مختلف سایت را به ساختار جدید منتقل کنید.
اگر سرعت سایت برایتان اولویت اصلی نیست
اگر سایت شما بدون مشکل کار میکند و از نظر سرعت و عملکرد رضایت دارید، لازم نیست همه چیز را فوری تغییر دهید. میتوانید در زمان مناسب و هنگام طراحی صفحات جدید، کمکم از قابلیتهای جدید المنتور استفاده کنید.
