كيفية استخدام Gutenberg مع Elementor - بالطريقة الصحيحة

يعد Elementor أحد أكثر مكونات WordPress الإضافية شيوعًا على الإطلاق - ولسبب وجيه. قام منشئ الصفحات بتسوية مجال تصميم الويب من خلال مساعدة جحافل مستخدمي WordPress على بناء مواقع ويب جميلة ، دون تعلم كيفية البرمجة. لكن في الآونة الأخيرة ، ظهر محرر كتلة Gutenberg كمعيار جديد لإنشاء محتوى WordPress. بالنظر إلى أوجه التشابه بين هاتين الأداتين ، بدأ الكثير في التساؤل عما إذا كانت لا تزال هناك حاجة إلى Elementor. على العكس من ذلك ، يتساءل بعض مستخدمي Elementor منذ فترة طويلة عما إذا كان استخدام Gutenberg سيؤدي إلى تعطيل موقع الويب الخاص بهم.

كما سأشرح في هذا المنشور ، فإن Elementor vs.Gutenberg ليس اقتراحًا إما / أو. كل أداة لديها ما تقدمه. يعمل Elementor و Gutenberg معًا بشكل جيد عند استخدامهما بشكل صحيح. يساعد على فهم نقاط القوة والضعف لكل أداة والتخطيط لدمج الاثنين على موقع الويب الخاص بك.

في هذا المنشور ، سأشارك أفضل ممارساتي لاستخدام Gutenberg مع Elementor. اتبع هذه الإرشادات لتحقيق أقصى استفادة من كلتا الأداتين مع الحفاظ على التوافق مع الإصدارات المستقبلية من WordPress.

مقارنة Elementor مع Gutenberg

قبل أن أشرح كيفية استخدام Gutenberg و Elementor معًا ، أريد أن أتوقف لحظة للتوسع في المزايا النسبية لكل أداة.

كان هناك بعض الالتباس حول قدرات Gutenberg و Elementor وكيف تتناسب كل أداة مع سير عمل تصميم الويب. في رأيي ، يرجع بعض هذا الالتباس إلى الميل إلى المبالغة في تقدير حالة جوتنبرج الحالية. بينما يتطور Gutenberg بسرعة ويتحسن مع كل تكرار ، فإنه لا يزال قريبًا من كونه غنيًا بالميزات أو قويًا مثل Elementor.

مع وصول ميزات جديدة مثل التحرير الكامل للموضوع ، سنحتاج إلى إعادة النظر في مكان Gutenberg في مهام سير عمل التصميم لدينا. ولكن بالنظر إلى تاريخ جوتنبرج ، فمن المرجح أن تستغرق هذه الميزات الجديدة بعض الوقت لتصبح قابلة للاستخدام في بيئة الإنتاج.

أسباب استخدام العنصر

• يوفر Elementor تحكمًا أكثر وأفضل في تصميم موقع الويب الخاص بك - من تخطيطات الصفحة الواحدة إلى تصميم الموقع بالكامل.
• يجعل تحرير محتوى الواجهة الأمامية Elementor بديهيًا للغاية ويوفر للمستخدمين معاينة في الوقت الفعلي للتغييرات. إلى حد كبير ما تراه هو ما تحصل عليه. لا يزال أمام جوتنبرج طريق طويل لنقطعه في هذا الصدد.
• يُمكِّن مُنشئ السمات Elementor Pro أي شخص من إنشاء سمة WordPress مخصصة. وتسمح شروط عرض Elementor لمالكي الموقع بالتحكم في مكان عرض كل جزء سمة. على سبيل المثال ، من السهل إنشاء أقسام موقع مخصصة برؤوس وتذييلات مختلفة.
• تعد إعدادات التصميم العالمية لـ Elementor مكانًا مركزيًا لإنشاء وإدارة إعدادات تصميم موقعك ، بما في ذلك اختيار اللون والخط. تصبح إعدادات التصميم هذه إعدادات مسبقة يمكن الوصول إليها من خلال واجهة Elementor.
• تلغي الميزات مثل النوافذ المنبثقة ووضع صيانة الموقع الحاجة إلى مكونات إضافية.

أسباب استخدام جوتنبرج

• Gutenberg هو محرر محتوى WordPress الافتراضي. إذا كنت تخطط لاستخدام WordPress لسنوات قادمة ، فستستخدم Gutenberg. قم بإنشاء (معظم) المحتوى الخاص بك باستخدام Gutenberg لضمان التوافق مع الإصدارات المستقبلية من WordPress.
• إن خارطة طريق جوتنبرج واسعة وطموحة. يتم توسيع محرر الكتلة ليحل محل أدوات الشريط الجانبي التقليدية. قريبًا ، ستتمتع Gutenberg بإمكانيات تعديل السمات. بمرور الوقت ، سيكون جوتنبرج أكثر شبهاً بـ Elementor.

أسباب استخدام جوتنبرج مع العنصر

يستطيع Elementor القيام بأشياء لا يستطيع Gutenberg القيام بها (حتى الآن). وحتى بعد أن يتمكن Gutenberg من القيام بهذه الأشياء ، لا نعرف كيف ستتم مقارنتها - أو كم من الوقت سيستغرق التعامل مع التكافؤ مع Elementor. يحتاج معظم الأشخاص إلى إنشاء موقع ويب اليوم ، وليس بعد ثلاث سنوات من الآن.

في غضون ذلك ، يجب على مصممي المواقع أن يفكروا على الأقل فيما قد يحدث بعد ثلاث سنوات من الآن.

لا أوصي بإنشاء مئات منشورات المدونة في Elementor. في الواقع ، لا أوصي بإنشاء أي منشورات مدونة في Elementor. كما سترى ، من الممكن تمامًا إنشاء منشوراتك باستخدام Gutenberg وجعل هذه المنشورات تتدفق إلى قوالب Elementor المصممة. هذه الطريقة هي أفضل ما في العالمين.

أفضل الممارسات لاستخدام Elementor و Gutenberg معًا

لا يوجد سبب لعدم استخدام Elementor مع Gutenberg ولكن القيام بذلك مع التركيز على المستقبل. يومًا ما ، قد يتفوق جوتنبرج على Elementor من حيث الميزات وسهولة الاستخدام. حتى يأتي ذلك اليوم ، هذه هي الطريقة التي يمكنك بها استخدام الاثنين معًا دون تعارض.

1. استخدم سمة تدعم العنصر ولا تقاومه

توقف عن البحث عن المظهر المثالي ، لأنك ستقوم ببناء المظهر الخاص بك باستخدام Elementor.

ومع ذلك ، ما زلت بحاجة إلى موضوع للبدء. ولكن بدلاً من البحث عن سمة محملة بالميزات وإعدادات أداة التخصيص والقوالب المخصصة ، استخدم سمة مبسطة تخرج عن الطريق وتسمح لـ Elementor بالقيام بعملها.

ابدأ بتجربة سمة Hello Elementor. تم صنعه بواسطة فريق Elementor للاستخدام مع Elementor. توقع أن تصاب بخيبة أمل عند تنشيط هذا الموضوع لأول مرة. مرحبًا سهل كما هو ، وهذا هو بيت القصيد.

Astra هو خيار جيد آخر. يتضمن Astra ميزات أكثر من Hello ، ولكن يتم تعطيل معظم الميزات عند تثبيت المكون الإضافي لأول مرة. من السهل تمكين ميزات Astra حسب حاجتك إليها.

2. استخدم Elementor Pro Theme Builder

يعد مربع أدوات Elementor مثيرًا للغاية بحيث يسهل تخطي Theme Builder والبدء في إنشاء صفحات ويب جميلة على الفور. لا تفعل ذلك! بدلاً من ذلك ، اقض بعض الوقت في تعلم كيفية عمل Theme Builder وابدأ بإنشاء العناصر التأسيسية لموقعك.

أقترح إنشاء رأس وتذييل موقعك أولاً. هذه مكونات أساسية لتصميم موقعك تظهر في كل صفحة.

بعد ذلك ، قم بإنشاء قوالب للمشاركات والصفحات. يتدفق المحتوى الذي كتبه Gutenberg إلى هذه القوالب. من الضروري فهم الآثار المترتبة على هذا النهج بشكل كامل. ستقوم بإنشاء وتحرير منشوراتك في Gutenberg أثناء استخدام Elementor لتصميم قالب المنشورات.

3. إيقاف تشغيل Elementor للوظائف

كما ذكرت ، لا أعتقد أنه يجب استخدام Elementor لتصميم منشورات فردية.

ليس من الصعب على موقع ويب نشط إنشاء مئات المنشورات بمرور الوقت. يعد تأليف المشاركات الفردية في Elementor استخدامًا غير فعال للوقت. يضمن القيام بذلك أنك ستحتاج إلى إعادة إنشاء هذه المنشورات إذا اخترت التوقف عن استخدام Elementor في المستقبل.

من خلال تأليف محتوى المنشور الخاص بك باستخدام Gutenberg (أو المحرر الكلاسيكي) ، فإنك تضمن التوافق مع المستقبل. إذا توقفت عن استخدام Elementor في المستقبل ، فسيكون الأمر أشبه بتغيير المظهر الخاص بك وليس إعادة بناء موقع الويب بالكامل من البداية.

للتأكد من عدم إنشاء منشور عن طريق الخطأ في Elementor ، أقترح عليك تعطيل Elementor للمشاركات. سيؤدي القيام بذلك إلى منع مؤلفي المنشورات من الضغط عن طريق الخطأ على زر "تحرير في العنصر" ، مما يؤدي إلى جميع أنواع المشكلات التي يواجهها المؤلفون غير المتوقعين. ستستمر القوالب المصممة لـ Elementor في العمل حتى بعد تعطيل التحرير اللاحق.

لإيقاف تشغيل Elementor للتحرير اللاحق.

1. انتقل إلى Elementor -> Settings.
2. بجانب أنواع المنشورات ، قم بإلغاء تحديد مربع المشاركات.
3. احفظ إعداداتك.

4. استخدم Elementor لإنشاء قوالب لمرة واحدة للصفحات الخاصة

إلى جانب استخدام Theme Builder ، يجب عليك استخدام Elementor لتصميم صفحاتك المقصودة الرئيسية. عادةً ما تكون هذه هي الصفحات المضمنة في التنقل الرئيسي في موقعك.

بعض الأمثلة:

• الصفحة الرئيسية
• صفحات التقيد
• منتجات وخدمات
• صفحة التسعير
• صفحة الاتصال

ستجد مجموعة مختارة من تصميمات البداية لصفحات مثل هذه في مكتبة قوالب Elementor.

فقط كن على علم بأنه إذا تحركت بعيدًا عن Elementor ، فستحتاج إلى إعادة بناء هذه الصفحات. ولكن الشيء نفسه ينطبق عند استخدام معظم السمات مع القوالب الفريدة وميزات التصميم.

5. استخدم إعدادات نظام تصميم العنصر

يعد وجود نظام تصميم مدروس جيدًا هو المفتاح للحفاظ على التناسق عبر موقع الويب الخاص بك. هذا صحيح بشكل خاص إذا قمت باستيراد مجموعة متنوعة من التصميمات من مكتبة قوالب Elementor. ناهيك عن خلط الصفحات المصممة من Elementor مع منشورات Gutenberg المؤلفة.

اعتبارًا من الإصدار 3.0 ، يوفر Elementor Pro تحكمًا شاملاً في إعدادات التصميم. تتيح هذه الإعدادات للمستخدمين تحديد الألوان والخطوط وتفضيلات التصميم الأخرى بسهولة لاستخدامها في جميع أنحاء الموقع. تصبح إعدادات الخط واللون إعدادات مسبقة يمكن الوصول إليها بسهولة عبر واجهة Elementor.

تنتقل إعدادات التصميم هذه إلى محتوى المنشور الذي تقوم بتأليفه باستخدام Gutenberg. يمكنك التفكير في هذا على أنه مكافئ لتعيين الخطوط والألوان المفضلة في سمة ما.

تعد إعدادات التصميم واحدة من تلك التحسينات الدقيقة للميزات التي يسهل تفويتها إذا كنت تستخدم Elementor لفترة من الوقت. سيتم سداد الوقت الذي تقضيه في التعرف على هذه الإعدادات الجديدة عدة مرات من خلال سير عمل تصميم مبسط.

ليس ذلك فحسب ، ستعمل هذه الإعدادات على تسريع عمليات إعادة التصميم المستقبلية من خلال السماح لك بإجراء تغييرات كبيرة في اللون والخط في مكان واحد.

يتطلع إلى المستقبل

كما ترى ، يعد Elementor Pro و Gutenberg أدوات تكميلية. المفتاح هو معرفة كيفية الاستفادة من نقاط القوة لكل أداة مع تجنب تحديات التوافق المستقبلية.

إذا أعجبك هذا المنشور ، فقد تكون مهتمًا أيضًا بالدورة التدريبية الجديدة ، "Theme Building with Elementor Pro". تتضمن الدورة التدريبية أكثر من 90 دقيقة من إرشادات الفيديو خطوة بخطوة التي ترشدك خلال عملية إنشاء سمة باستخدام Elementor Pro.

انضم إلى برنامج التدريب والتوجيه WP Apprentice للوصول إلى دورة Theme Builder ومكتبة التدريب بالكامل.