۶ نکته برای بهینه سازی المنتور در وردپرس

• ۱۳ آذر ۱۴۰۳
• دسته بندی ها: وردپرس
• برچسب ها: وردپرس

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

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

المنتور ناوبری‌ها(navigator) و منوهای بصری را ارائه می‌دهد که حتی بدون دانش کدنویسی HTML یا CSS قابل استفاده هستند. مثلا Elementor 3.4، دارای چند ویژگی و بهبودهای بسیار خوب UX محور است.
این قابلیت را به کاربران ارائه می‌دهد که بدون محدودیت با گزینه‌های جدید طراحی کنند. می‌توان Menu Cart widget، AJAX Load More، Video Playlists، و  Dynamic WooCommerce Tags را کاوش کرد. این قابلیت‌ها به بازاریابی و سایر عملکردها در وب سایت‌ها کمک می‌کند.

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

1. یک روش Font Loading برای افزایش سرعت صفحه انتخاب کنید

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

صفحه تنظیمات المنتور به شما امکان می‌دهد تغییرات را در روش Google Fonts Loading خود انتخاب کنید. در آخرین نسخه، شما به پنج گزینه برای انتخاب دسترسی دارید، یعنی:

• پیش‌فرض(Default): در اینجا مرورگر، استراتژی نمایش فونت را تعریف می‌کند.
• در حال مسدودسازی (Blocking): به فونت یک دوره block  کوتاه و یک دوره swap  بی نهایت می‌دهد.
• جایگزین(Fallback): به فونت یک دوره block  بسیار کوچک و یک دوره swap  کوتاه می‌دهد.
• اختیاری(Optional): هنگامی که صحبت از مخفی کردن متن می‌شود، این همان حالت Fallback  است. تنها تفاوت این است که از فونت Fallback  استفاده می‌کند مگر اینکه فونت به طور کامل بارگذاری شود.
• تعویض(Swap): به این معنی است که اگر یک فونت آن طور که لازم است بارگیری نمی‌شود، فونت‌های fallback  قبل از ارائه مجدد با نسخه به روز شده پس از در دسترس بودن استفاده می‌شود.

 

2. تضادهای (Conflict) پیکربندی سرور در سایت خود را حل کنید

با هر افزونه‌ای، ممکن است با یک کانفلیکت سرور مواجه شوید. برای به حداقل رساندن مشکلات هاست یا سرور در هنگام استفاده از المنتور، می‌توانید از یک سوئیچ ساده استفاده کنید که با رفتن به تنظیمات Core Elementor می توانید به آن دسترسی داشته باشید.

روی المنتور>تنظیمات>پیشرفته کلیک کنید تا  تغییر روش بارگذاری ویرایشگر (Switch front-end editor loader method) را  فعال کنید تا تضادهای پیکربندی سرور حل شود.

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

 

3. طرح بندی(Layout) سایت خود را بهینه کنید

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

به روز رسانی اخیر Theme Builder در واقع به شما امکان می‌دهد یک نمای کلی بصری از کل سایت داشته باشید. شما می‌توانید مدیریت کنید که کدام قالب در کدام بخش از سایت اعمال می‌شود و به راحتی محتوا را در صورت نیاز ویرایش، ارتقا یا تغییر دهید.

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

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

علاوه بر این، Elementor 3.4 (و جدیدتر) شما را قادر می‌سازد طراحی layout  خود را مطابق با هفت دستگاه از جمله دسکتاپ، موبایل و تبلت اصلی تنظیم کنید.
برای فضای بیشتر صفحه نمایش، نقاط شکست را همراه با اندازه‌های دستگاه صفحه عریض جدید ارائه می‌دهد. این به شما انعطاف‌پذیری کامل می‌دهد تا به‌طور مستقل اندازه پیش‌نمایش را در صورت لزوم افزایش یا کاهش دهید، بنابراین پلتفرمی را به شما می‌دهد که عملکرد بسیار بالاتری را ارائه می‌دهد.

 

4. فشرده سازی تصاویر سایت بدون افت کیفیت

بهینه سازی تصویر یک عامل حیاتی برای بهبود عملکرد کلی سایت  است. مشتریان به دنبال محتوای بصری بیشتری و در عین حال خواهان بارگذاری سریع‌تر وب‌سایت‌ها هستند. برای کاهش زمان بارگذاری وب‌سایت، باید تصاویر خود را بهینه کنید.

از آنجایی که پوسته‌ها و گرایش‌های طراحی وردپرس به سمت جلوه‌های بصری بیشتر رفته، اطمینان از اینکه ویدیوها، عکس‌ها و GIF‌هایی که در سایت خود قرار می‌دهید، سرعت آن را کاهش نمی‌دهند، ضروری است.
اما به‌جای دانلود یک‌باره همه تصاویر هنگام بارگیری صفحه، می‌توانید بارگذاری تنبل ( lazy loading) را اجرا کنید،  تکنیکی محبوب که در طراحی وب برای به تعویق انداختن بارگیری منابع غیر مهم (مانند عکس‌ها) در یک صفحه استفاده می‌شود و در عوض، آنها را فقط در صفحه بارگیری کنید. لحظه نیاز (مانند پیمایش صفحه به پایین).

بارگذاری تنبل یک ویژگی اصلی وردپرس از نسخه 5.5 وردپرس است، اما با المنتور کار نمی‌کند زیرا این افزونه CSS تصویر بک‌گراند را در یک CSS  جداگانه جمع آوری می‌کند. 

 

Optimole

یک راه حل همه کاره بهینه سازی تصویر برای وردپرس، سازگار با المنتور است. تصاویر شما از یک CDN و نه از سرور اصلی ارائه می‌شوند که زمان بارگذاری و استفاده از پهنای باند شما را کاهش می‌دهد. اندازه تصویر مناسب را برای مرورگر و نمای بازدیدکننده انتخاب و از بارگذاری تنبل برای نمایش تصاویر استفاده می‌کند.

Smush

یکی دیگر از پلاگین‌های بهینه سازی تصویر با امتیاز بالا که به خوبی با المنتور سازگار است، Smush به شما امکان می‌دهد به راحتی اندازه، بهینه سازی و بارگذاری تنبل تصاویر را برای عملکرد بهتر انجام دهید. فشرده سازی بدون تلفات (lossless ) را ارائه می‌دهد و فایل‌های PNG، JPEG و GIF را به صورت انبوه پردازش می‌کند. همچنین می‌توانید بهینه‌سازی خودکار را تنظیم کنید تا پیوست‌های شما در هنگام آپلود فشرده شوند.

5. بهبود عملکرد با خروجی DOM و Asset Loading Functions

آخرین نسخه المنتور شامل تعدادی از نکات برجسته عملکرد، مانند Asset Loading Functions و دسترسی است. نسخه جدید با پشتیبانی از مرورگرهای قدیمی (مانند اینترنت اکسپلورر) JS asset file sizes را کاهش می‌دهد. اندازه فایل‌های کوچک‌تر برای دارایی‌ها، سرعت بارگیری را بهبود می‌بخشد و لایت‌باکس‌هایی که به‌صورت مشروط بارگذاری می‌شوند، گزینه‌ای برای بارگیری آن‌ها در صورت درخواست دارند.

المنتور برای reduce DOM elements و وزن صفحه زمانی که سرعت وب‌سایت را کاهش می‌دهد کار می‌کند. همچنین دارای بارگذاری درون خطی (inline loading) است که به کاربران امکان می‌دهد ویجت‌ها را بدون منتظر ماندن برای دانلود کامل فایل های جاوا اسکریپت قبل از ارائه هر گونه محتوا یا عملکرد، نمایش دهند.

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

6. پلاگین‌های خود را به طور موثر انتخاب و مدیریت کنید

المنتور ویژگی سازنده خود را دارد، اما به راحتی پلاگین‌ها را برای نیازهای سفارشی‌تر ادغام و مدیریت می‌کند. به عنوان مثال، المنتور به خوبی با افزونه های معروف وردپرس مانند WooCommerce، Yoast، Rank Math، ACF، Toolset، Pods، LearnDash، Tutor LMS و MemberPress ادغام می‌شود.

برای ادغام فرم‌ها با المنتور ، می‌توانید از ویجت shortcode  استفاده کنید. اما این روش اجازه سفارشی‌سازی بصری فرم شما را در صفحه‌ای که توسط المنتور ارائه شده است را نمی‌دهد، زیرا از shortcode  برای جاسازی فرم‌های شما در صفحات استفاده می‌کند.

برای انتخاب پلاگین‌های طراحی شده برای کار با المنتور وقت بگذارید. افزونه‌هایی مانند Happy Addons و Essential Addons با ویجت‌های المنتور ارائه می‌شوند که به شما امکان می‌دهند فرم‌های سایت خود را در ویرایشگر بصری ادغام کنید.

فرقی نمی‌کند از Gravity Forms، Contact Form 7 یا هر افزونه محبوب دیگری استفاده کنید، این ادغام‌ها تضمین می‌کنند که فرم‌های شما هم در حالت طراحی و هم در صفحات منتشر شده عالی به نظر می‌رسند. و همچنین بدون ایجاد اختلال در عملکرد سایت، مانند همیشه کارآمد اجرا خواهند شد.

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

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

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