ویرگول
ورودثبت نام
امیرحسین دوزنده
امیرحسین دوزندهبرنامه نویس Front-End ، علاقه مند به جاوا اسکریپت و پایتون که گاهی وقتا هم طراحی میکنه.
امیرحسین دوزنده
امیرحسین دوزنده
خواندن ۴ دقیقه·۷ سال پیش

تجربه من با Elementor - قسمت 2

Elementor Page Builder
Elementor Page Builder

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

قبل از اینکه بریم سراغ بخش فنی مربوط به Elementor یکم درمورد خود پروژه توضیح بدم شاید بهتر باشه اینجوری شما هم متوجه چالش‌هایی که موقع پیاده‌سازی تو استودیو داشتیم میشین:

  • اول از هر چیزی طراحی UI/UX نسخه جدید بود که باید علاوه بر ظاهر متفاوتش هویت سازمانی پارس‌پک رو تو خودش حفظ میکرد، خب این بخش به من و بچه های تیم فنی مربوط نبود و جزو چالش های تیم طراحی بود که خانم شاپورزاده و آقای گروسیان زحمتش رو کشیدن.
طرح نهایی پارس‌پک
طرح نهایی پارس‌پک
  • بعد از اینکه طراحی‌ها کامل شدن نوبت به پیاده سازی نسخه استاتیک پروژه بود، فارغ از ارتباط‌هایی که صفحات و بخش‌های مختلف باید با دیتابیس یا Elementor میداشت و خب این دیگه جزو چالش‌های تیم فنی بود و باید نسخه پیاده‌سازی شده هم به تمیزی طرح میبود. نسخه استاتیک پروژه رو به صورت تیمی ؛ نیما عمرانی، امیر قدیمی و من پیاده‌سازی کردیم و قدم بعدی اتصال به وردپرس بود.

برای اتصالش به وردپرس چون قصد داشتیم از یکی از Page Builderهای وردپرس استفاده کنیم به خاطر مزیت‌های Elementor رفتیم سراغ این پلاگین و خب چون بنا بود کل قالب رو به تنهایی پیاده‌سازی کنم شروع کردم به جستجو درمورد اینکه چه جوری میتونم Widgetهای اختصاصی برای Elementor داشته باشیم.

تو جستجوی اولیه خودم رسیدم به اینکه این پلاگین داره خیلی عالی از ویجت‌های خود وردپرس پشتیبانی میکنه و منم که تو نوشتن Custom Widgetهای وردپرس مشکلی نداشتم پس دیگه همه چی حله ? که خب کاملا اشتباه میکردم نه که فک کنید Elementor پشتیبانی نمیکنه‌ها نه. من برای این پروژه به یه سری فیلد احتیاج داشتم که باید حتما از ACF برای مدیریتشون استفاده میکردم و خب Elementor و ACF بودن که با هم هماهنگ نبودن، به این صورت یکی از پیش فرض‌های من یعنی استفاده از ACF به صورت جدی به مشکل خورد.

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

درنهایت رسیدم به یک پلاگین خیلی ساده که برای Elementor نوشته شده بود و تقریبا 5 یا 6 تا ویجت کوچیک اضافه میکرد که خب من به هیچ کدوم از ویجت‌ها احتیاج نداشتم واسه همین تصمیم گرفتم این پلاگین رو تست کنم و ببینم میتونم به چیز بدرد بخوری برسم یا نه و خب نتیجه‌اش برای اولین پروژه خیلی خوب بود برای اینکه من اون پلاگین رو تغییر دادم و تمام ویجت‌هایی که احتیاج داشتم رو روی بستر اون پلاگین نوشتم.

حالا دو تا کار کوچیک باید انجام میدادم تا مطمئن شم توی به روزرسانی برای این پلاگین که حالا هیچ شباهتی به پلاگین قبلی نداشت مشکلی پیش نمیاد:

  • اول از همه باید پلاگینی که تغییر داده بودم رو به عنوان Needed Plugin به قالب و وردپرس معرفی میکردم تا نیازی به دانلودش نباشه.
  • دوم باید این پلاگین رو از لیست پلاگین‌هایی که برای به روزرسانی چک میشدن خارج میکردم تا به صورت خودکار روش به روزرسانی انجام نشه و اصلا تو پنل مدیرت هم اعلانی برای نسخه جدید ایجاد نکنه.

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


بعد از این که این مورد حل شد باید میرفتم سراغ طرح و Componentهایی که باید به یه Widget جدا تبدیل میشدن رو شناسایی میکردم اینجوری لازم نبود برای هر قسمت حتما حتما یک Widget جدا نوشته می‌شد بلکه کافی بود تفاوت‌هایی که داشتن رو پیدا میکردم و یه سری تنظیمات در رابطه به اون تفاوت‌ها ایجاد میکردم تا Sectionهای مشابه قابلیت تبدیل شدن بهم رو داشته باشن. اینجوری یه حجم زیادی از کار کم میشد و ما میتونستیم بهینه‌تر قالب رو بنویسیم.

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

وردپرسبرنامه نویسیwordpressphpelementor
۱۲
۳
امیرحسین دوزنده
امیرحسین دوزنده
برنامه نویس Front-End ، علاقه مند به جاوا اسکریپت و پایتون که گاهی وقتا هم طراحی میکنه.
شاید از این پست‌ها خوشتان بیاید