هل أنت مهتم بانشاء موقع الكتروني مذهل؟ حسنًا، هذه رائع… أصبح الأمر الآن أسهل من أي وقت مضى! ليست هناك حاجة لترميز كل صفحة يدويًا من البداية أو تعيين فريق من المحترفين. في هذه الأيام، كل ما تحتاجه حقًا هو اضافة تسمى Elementor.

إنها واحدة من افضل منشئي صفحة ووردبريس تنوعًا ويمكن الوصول إليه في السوق.

والأفضل من ذلك، أنها مجانية تمامًا للبدء!

في هذا الدليل التعليمي، سنغطي كيفية استخدام إليمنتور خطوة بخطوة واستعراض بعض أفضل ميزاته.

في النهاية، يجب أن يكون لديك كل ما تحتاجه لإنشاء موقع ويب ووردبريس يثير الإعجاب، في أي وقت من الأوقات!

ما هو Elementor؟

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

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

لماذا يجب عليك استخدام Elementor؟

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

بالنسبة لمطوري ووردبريس، لا يزال النظام الأساسي الأفضل مع تحسين البرنامج النصي والقوالب المخصصة وإصدارات التراجع.

ما الذي يمكنك إنشاؤه باستخدام Elementor؟

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

هل Elementor مجاني؟

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

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

• 59 دولار سنويًا لموقع واحد.
• 99 دولار سنويًا لـ 3 مواقع.
• 199 دولار سنويًا لـ 25 موقعًا.
• 399 دولار سنويًا مقابل 1000 موقع.

1. تثبيت Elementor في ووردبريس

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

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

بمجرد تثبيت ووردبريس واختيار قالب لموقعك، هناك عدة طرق مختلفة يمكنك اتباعها لتثبيت منشئ الصفحة Elementor:

الطريقة 1: موقع Elementor

قم بزيارة موقع Elementor على الويب والحصول على الإصدار المجاني من Elementor. يتم عرض زر “Get Started” بشكل بارز أعلى الصفحة الرئيسية.

عند الضغط على الزر سوف يتم نقلك الى اختيار مظهر او يمكنك التخطي للبدء بموقع جديد بدون مظهر

بمجرد اختيار المظهر والإعدادات الخاصة بك، ما عليك سوى النقر فوق “بدء تشغيل موقعك” وستكون جاهزًا للانطلاق!

الطريقة 2: لوحة تحكم ووردبريس

قم بتسجيل الدخول إلى لوحة تحكم موقع ووردبريس الخاصة بك واستعد لتثبيت الاضافة عن طريق الضغط على زر “إضافة جديد” من علامة التبويب الإضافات.

للعثور على Elementor، ما عليك سوى كتابة كلمة “Elementor” في شريط بحث الاضافات.

يجب أن يظهر منشئ المواقع Elementor مباشرة كخيار اضافة لتثبيته.

فقط انقر فوق “التنصيب الان” ثم “تفعيل” بمجرد تنزيله.

بعد ذلك، سيظهر لك معالج التثبيت. في هذه الحالة يمكنك اتباع الخطوات كالأتي:

• انشاء حساب على المنيتور
• اختيار التصميم
• اختيار اسم الموقع
• اختيار اسم الموقع
• فى هذه النقطة الاخيرة يوفر Elementor الاختيار بين البدء بصفحة جديدة او الاختيار من التصميمات الجاهزة

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

أيًا كانت الطريقة التي تختارها لتثبيت Elementor، فستتمكن من العثور عليه في قائمة الاضافات المثبتة “من الآن فصاعدًا – وسيكون له أيضًا الاعدادات الخاص به في القائمة الجانبية.

من هذه المنطقة، ستتمكن من ضبط إعدادات الاضافية.

على عكس العديد من المكونات الإضافية، فإن أفضل وظائف Elementor تحدث على الصفحات نفسها.

هذا يعني أنك ستقضي معظم وقتك في استخدام Elementor عند إنشاء الصفحات والمشاركات أو تعديلها.

2. استكشاف خيارات العنصر

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

من أهم ميزات أي منشئ الصفحات سهولة الاستخدام. يجب أن تكون قادرًا على القفز وجعل رؤيتك حقيقة واقعة دون الكثير من عمليات البحث المحموم على يوتيوب.

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

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

تعتمد معظم خيارات التخصيص التي ستجدها في Elementor على الأدوات التي تأتي مع الاضافات.

إعدادات Elementor

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

هناك أيضًا وظيفة مدير دور مفيدة في Elementor تتيح لك تصنيف أنواع المستخدمين التي يمكنها الوصول إلى المحرر (ملاحظة: هذه ميزة فقط في Elementor Pro).

ما الودجات المضمنة؟

بشكل عام، يعتمد Elementor على محرر السحب والإفلات الذي يلائم الأقسام والأعمدة وودجات ووردبريس.

تم تقسيم النظام على النحو التالي:

• الأقسام: حاويات للأعمدة وعناصر واجهة المستخدم.
• الأعمدة: الأقسام التي تحتوي على عناصر واجهة تعامل.
• الودجات: العناصر الفردية على الصفحة.

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

فيما يلي قائمة سريعة بالعديد من الأدوات الأساسية التي ستستخدمها كثيرًا:

• عنوان
• صورة
• فيديو
• أيقونة
• زر
• فواصل
• محرر النص
• خرائط جوجل

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

ما عليك سوى سحب مثيل لعنصر ما إلى الصفحة الرئيسية وتخصيصه وفقًا لاحتياجاتك.

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

ومع ذلك، فإننا نجادل في أن معظم ما يمكنك القيام به في Pro ممكن في الإصدار المجاني – إنه يستغرق وقتًا أطول.

يعود الأمر إليك فيما إذا كنت تحتاج إلى الأدوات المصغّرة المتميزة الموجودة في الإصدار المحترف.

إليك عينة سريعة من عشرات الأدوات الموجودة في Elementor:

• مراجعة
• ذموذج
• سلايدر
• جدول الاسعار
• بورتفوليو
• نموذج الدخول
• زر فيسبوك
• زر اتخاذ اجراء

ستساعد عناصر Pro هذه في جعل موقعك يبدو أنيقًا وأكثر احترافًا، كما أنها مصممة لدعم جهود التجارة الإلكترونية، بما في ذلك التكامل المتعمق مع ووكومرس.

أخيرً، يدعم Elementor أدوات الجهات الخارجية.

يمكنك العثور على الكثير من إضافات إليمنتور التابعة لجهات خارجية والتي تعمل على توسيع أدواتك المتاحة بشكل أكبر، أو حتى تطوير عنصر واجهة المستخدم الخاص بك باستخدام موارد التطوير من Elementor!

ألست متأكدًا من رغبتك في إضافة عناصر واجهة مستخدم إضافية؟

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

3. Elementor مجاني وElementor Pro

إذا كنت تريد منشئ صفحات مجاني متطور ومتكامل الميزات أكثر من العديد من الخيارات المدفوعة، فإن Elementor يعد خيار رائع!

مع ذلك، يضيف Elementor Pro العديد من الميزات المرغوبة لتسريع سير عملك ومنحك مزيدًا من التحكم في مظهر موقع الويب الخاص بك ووظائفه.

نرحب بإضافات أداة إنشاء السمات والأدوات المميزة والعناصر العالمية، ولكنك بالتأكيد لست بحاجة إليها لإنشاء موقع ويب رائع.

جدول مقارنة ميزات Elementor

إليك نظرة عامة سريعة على الاختلافات الرئيسية التي ستجدها بين Elementor المجاني وElementor Pro (المدفوع).

هذه نظرة عامة للاختلافات بين الإصدارين، ولكن يمكنك معرفة المزيد حول Elementor مجاني مقابل Elementor Pro.

تسعير Elementor Pro

إذا كنت تفكر في الحصول على أحد الإصدارات المدفوعة من Elementor Pro، فيجب أن تلاحظ أن جميع الخطط الثلاث تقدم نفس الميزات بالضبط!

الاختلاف الوحيد بين خطط Pro هو عدد التراخيص التي تشتريها مرة واحدة.

• مع Essential: تحصل على Elementor Pro لموقع ويب واحد مقابل 49 دولارًا سنويًا.
• مع Advanced: تحصل على Elementor Pro على 3 مواقع مقابل 99 دولارًا سنويًا.
• مع Expert: تحصل على Elementor Pro على 25 موقع مقابل 199 دولارًا سنويًا.
• مع Studio: تحصل على Elementor Pro على 100 موقع مقابل 499 دولارًا سنويًا.
• مع Agency: تحصل على Elementor Pro على مواقع 1000 ضخمة مقابل 999 دولار سنويًا.

أيهما مناسب لك؟ بالنسبة للأفراد أو الفرق الصغيرة، يعتبر Expert بالتأكيد أفضل قيمة، طالما أنه من المحتمل أنك ستدير أكثر من موقع ويب واحد باستخدام Elementor Pro في العام المقبل.

يمكنك دائمًا اختيار البدء بـ Essential والترقية إلى Advanced أو Expert لاحقًا إذا قررت أنك تحب Elementor وتريد المزيد من التراخيص.

4. كيفية استخدام منشئ الصفحة Elementor المجاني

لذا، مع كل ذلك بعيدًا، هل أنت مستعد لرؤية Elementor وهو يعمل؟

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

الخطوة 1. إنشاء منشور أو صفحة جديدة

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

الخطوة 2. تحرير باستخدام Elementor

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

الخطوة 3. اسحب العناصر إلى الصفحة الرئيسية

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

لنقم بإنشاء عنوان جديد للصفحة. كل ما عليك فعله هو النقر فوق المربع الذي يشير إلى “العنوان” ثم الضغط باستمرار على زر الماوس الايمن، واسحبه إلى منطقة عنصر واجهة المستخدم على الصفحة (حيث تظهر عبارة “اسحب عنصر واجهة المستخدم هنا”).

إذا كنت لا تريد أن يشغل هذا العنصر العرض الكامل لصفحتك (وهو ما يفعله افتراضيًا)، فيمكنك النقر فوق الزر الصغير “زائد – +” لتخصيص بنية هذا القسم من صفحتك.

بعد النقر على زر علامة الجمع، سترى خيار “تحديد الهيكل الخاص بك”. لنبدأ بأربعة أعمدة متساوية.

بعد النقر فوق هذا الرمز الذي يحتوي على الأعمدة الثلاثة ، نرى الآن قسمًا جديدًا تمامًا على الصفحة به ثلاثة أعمدة ، لكل منها زر علامة زائد.

وإذا أردنا تخصيص ما نراه في هذا القسم؟ لقد خمنت ذلك، فنحن نسحب أداة هناك.

قمنا بسحب عنصرين إلى العمود الايمن (صورة) وفيديو والذي تم تحميله مسبقًا بقائمة تشغيل إليمنتور الافتراضية.

الخطوة 4. تعديل الإعدادات

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

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

الخطوة 5. انشر صفحتك

بمجرد أن تصبح راضيًا عن الإعدادات، فقد حان الوقت للتحقق من المنتج النهائي.

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

هذا شيء جيد جدا. هذا يعني أنه بمجرد نشر الصفحة التي تعمل عليها، يمكنك أن تثق في أنها تبدو تمامًا كما كانت أثناء تحريرها. هذه واحدة من أهم ميزات المينتور.

ملخص منشئ الصفحة

من الواضح أن هذا مثال سريع، لكنه يوضح لك مدى سهولة وضع العناصر وإنشاء موقع ويب فعال!

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

نوصي بشدة بإلقاء نظرة على قالب Astra، فهو يحتوي على الكثير من قوالب Elementor المضمنة التي تسمى Starter Templates والتي يمكنك استخدامها.

هناك نقطة مهمة أخرى نريد التأكيد عليها هنا:

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

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

5. كيفية استخدام منشئ قوالب Elementor

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

تتوفر أداة إنشاء القوالب في إصدار Elementor Pro، وهي أداة تغيير قواعد اللعبة لأي شخص على دراية بمنشئي الصفحات، لأنها تتيح لك إنشاء الهيدر والفوتر بشكل مخصص ومحتوى ديناميكي آخر لموقعك على الويب.

حتى أنه يسمح لك بتجاوز جوانب تصميمات ووردبريس الخاصة بها، بحيث يمكنك الاحتفاظ بما يعمل وإجراء التغييرات التي تريدها!

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

الاحتمالات لا حصر لها.

إنشاء هيدر – فوتر مع Elementor

هل أنت جاهز لإنشاء هيدر أو فوتر مخصص باستخدام Elementor باستخدام أداة إنشاء المظهر؟ إليك كيف يتم ذلك!

الخطوة 1. انقر فوق “القوالب” في لوحة تحكم ووردبريس

بعد تسجيل الدخول إلى لوحة تحكم ووردبريس الخاصة بك، انتقل إلى “القوالب” ضمن Elementor في القائمة الجانبية باليمين.

الخطوة 2. إضافة قالب جديد أو استيراد

هذا هو المكان الذي تقوم فيه بإنشاء قالب جديد للهيدر.

إذا رأيت هيدر أعجبك مظهره بالفعل، فيمكنك استيراده لاستخدامه كنقطة بداية. بخلاف ذلك، انقر فوق “إضافة جديد”.

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

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

ومع ذلك هناك العديد من الطرق البديلة لتحرير هيدر وفوتر موقع ووردبريس مجانًا. سنشرح هذا في المستقبل القريب

الخطوة 3. قم بتحرير القالب الجديد الخاص بك

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

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

بناء صفحات ووكومرس باستخدام Elementor

تشبه عملية إنشاء صفحة منتج ووكومرس مخصصة أي صفحة أو قسم آخر يمكنك إنشاؤه. الشعور بنمط هنا؟

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

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

يمكنك تعيين تفاصيل المنتجات باستخدام ووكومرس، واستخدام Elementor لعرض معلومات المنتج المحدثة على الواجهة الأمامية.

بكل بساطة!

ما الذي لم تجده في Elementor

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

للتحكم الكامل في المظهر الخاص بك، نوصي باستخدام قوالب ووردبريس سريعة الاستجابة مثل قالب Astra وElementor. يمنحك قالب Astra خيارات الهيدر والفوتر المضمنة وقوائم ضخمة وغير ذلك الكثير!

قوالب المبتدئين لـ Elementor

فائدة كبيرة أخرى لاسترا هي مجموعتها من قوالب Starter الجاهزة للاستيراد إلى Elementor، بما في ذلك الخيارات المجانية والمدفوعة.

على سبيل المثال، إذا كنت تقوم بإعداد موقع ويب لمدرب لياقة، فيمكنك استخدام قالب موقع مدرب اللياقة البدنية من استرا كأساس متين وتخصيصه من هناك.

من السهل القيام باستيراد نموذج استرا Starter!

تحتاج فقط إلى تثبيت الإصدار المجاني أو المدفوع من قوالب استرا، بالإضافة إلى اضافة Starter Templates المجانية.

بمجرد إعداد كلاهما، يمكنك تسجيل الدخول إلى لوحة تحكم ووردبريس الخاصة بك، والانتقال إلى مظهر > Starter Templates، وتحديد موقع الويب الذي تريد استيراده.

بعد ذلك، ستكون قادرًا على إجراء تغييرات على موقع البدء مباشرةً في Elementor!

Ultimate Addons for Elementor

بالإضافة إلى هذه القوالب، يتوفر ايضاً اضافة تسمى Ultimate Addons for Elementor توفر وظائف إضافية غير موجودة في Elementor.

يذهب هذا إلى أبعد من Elementor Pro في تقديم عناصر واجهة مستخدم متقدمة، مثل تبديل المحتوى، والنوافذ المنبثقة، والجدول الزمني للمحتوى، وجدول المحتويات.

لتحقيق أقصى قدر من التحكم والمرونة، من الجدير بالتأكيد التحقق من Ultimate Addons for Elementor!

6. كيفية إنشاء القوالب باستخدام Elementor

يمكنك إنشاء قوالب لجميع أنواع الأقسام والصفحات، بما في ذلك:

• الهيدر
• الفوتر
• الصفحة
• منشور واحد
• ارشيف المدونة
• صفحات المنتج

في هذا المثال، دعنا نعمل مع قالب المنشور / الصفحة.

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

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

أفضل من ذلك، هذا متاح لجميع مستخدمي Elementor، بما في ذلك Elementor المجاني.

الخطوة 1. انقر فوق “القوالب” في لوحة تحكم ووردبريس

بعد تسجيل الدخول إلى لوحة تحكم ووردبريس الخاصة بك، انتقل إلى “القوالب” ضمن Elementor في القائمة الجانبية.

الخطوة 2. إضافة قالب جديد أو استيراد

هذا هو المكان الذي تقوم فيه بإنشاء قالب جديد للهيدر.

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

ثم، انقر فوق “إنشاء نموذج” للبدء!

الخطوة 3. قم بتحرير قالب الصفحة

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

بمجرد تصميم الصفحة التي تريدها ، يمكنك حفظها كنموذج بحيث يمكن الوصول إليها لأي من صفحاتك الأخرى من الآن فصاعدًا.

7. كيفية إنشاء نوافذ منبثقة في Elementor

هل تريد إنشاء نافذة منبثقة في Elementor؟ ربما تقدم مغناطيسًا مجانيًا للعملاء المحتملين، أو تصدر إعلانًا، أو تلتقط عملاء متوقعين أو أي شيء آخر؟

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

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

ما عليك سوى اتباع هذه الخطوات لإنشاء نافذة منبثقة يتم تشغيلها عند النقر فوق الزر.

1. توجه إلى لوحة التحكم > القوالب > النوافذ المنبثقة > إضافة جديد.

2. قم بتسمية النموذج الخاص بك، ثم انقر فوق “إنشاء نموذج”.

3. يمكنك اختيار إنشاء قالب خاص بك أو اختيار واحد من مكتبة القوالب.

4. انقر فوق “نشر” بمجرد الانتهاء. ثم احفظ وأغلق.

5. الآن، قم بإنشاء صفحة جديدة في Elementor. واسحب أداة الزر.

6. ضمن التخطيط، حدد ارتباط > ديناميكي > إجراءات > منبثق.

7. تصفح إلى منبثقة > افتح نافذة منبثقة > وحدد النافذة المنبثقة التي أنشأتها للتو.

8. انقر فوق “نشر” عند الانتهاء وتحقق من الصفحة المباشرة. انقر فوق الزر لعرض النافذة المنبثقة الخاصة بك.

وهذا هو مدى سهولة إنشاء نافذة منبثقة باستخدام Elementor!

8. إنشاء موقع ويب مستجيب للجوال باستخدام Elementor

مع تزايد عدد المستخدمين الذين يزورون مواقع الويب من أجهزتهم المحمولة، من الأهمية بمكان الحصول على مكان عرض موقع الويب على الجوال. كما أشرنا سابقًا، يأتي أكثر من 50٪ من حركة مرور موقعك على الويب من أجهزة الجوّال.

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

يجعل Elementor الأمر سهلاً للغاية عندما يتعلق الأمر بتخصيص موقع الويب الخاص بك لأجهزة مختلفة.

القاعدة العامة هي أن جميع الميزات القابلة للتحرير لها إعداد محدد لسطح المكتب والجوال والجهاز اللوحي. تتضمن الإعدادات الأكثر شيوعًا حجم النص والهامش والحشو.

على سبيل المثال، كما هو موضح في الصورة أدناه، ابحث عن رمز الجهاز المجاور لـ “العرض”. هذا هو الحال مع أي عنصر ترغب في تخصيصه.

انقر فوق الجهاز الذي تريد إجراء التخصيص له. بمجرد التحديد، امض قدمًا وقم بالتلاعب بالإعدادات بناءً على تفضيلاتك.

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

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

ما عليك سوى التوجه إلى قسم التحرير > خيارات متقدمة > علامة تبويب متجاوب.

هل لاحظت مجموعة من الخيارات ضمن “متجاوب”؟ بشكل افتراضي، يتم تعيين القسم ليتم عرضه عبر جميع الأجهزة. إذا كنت ترغب في إخفائه، حسنًا، ما عليك سوى تبديل الزر بناءً على جهازك.

بينما لا يزال بإمكانك رؤية القسم أثناء تحرير الصفحة، فإنه لن يكون مرئيًا في الواجهة الأمامية، بمجرد نشر الصفحة.

لتبديل عرض صفحة الويب بأكملها، كل ما عليك فعله هو النقر على أيقونة وضع الاستجابة في الجزء السفلي من لوحة تحكم Elementor.

بشكل افتراضي، ستلاحظ عرض الجوال.

للتبديل بين الأجهزة، ما عليك سوى النقر فوق رمز الجهاز المعني في الأعلى. وللخروج من عرض المتجاوب، ما عليك سوى النقر على “X” في الزاوية العلوية باليسار.

ما مدى سهولة إنشاء عرض سريع الاستجابة للجوّال؟ الحق سهلة؟

9. لماذا يجب عليك استخدام Elementor

الآن بعد أن عرفنا كيفية استخدام Elementor، دعنا نغطي سؤالًا خارج السياق إلى حد ما، ولكن يتم طرحه بشكل متكرر. لماذا يجب علينا استخدام إليمنتور في المقام الأول؟

قبل الدخول في مزيد من التفاصيل، دعنا نلقي نظرة على بعض فوائده:

• سهل الاستخدام – يعد إنشاء موقع ويب باستخدام Elementor سهلاً مثل A-B-C.
• التحرير المباشر – Elementor هو محرر Wysiwyg (ما تراه هو ما تحصل عليه)
• أكثر من 50 لغة – مع تكامل RTL وعنصر دعم متعدد اللغات متاح بلغات متعددة
• أصول قوية ومثيرة للإعجاب – هناك عنصر واجهة مستخدم لأي ميزة ترغب في إضافتها إلى موقع الويب الخاص بك.
• تصميم متجاوب – يمكنك بسهولة معاينة صفحاتك وتخصيصها لأجهزة سطح المكتب والجوال والأجهزة اللوحية.
• قوالب مسبقة الصنع – باستخدام قوالب Astra لاليمنتور، لن تحتاج حقًا إلى بديل.
• إنشاء تأثيرات رسوم متحركة متقدمة – يسمح لك Elementor بدمج رسوم متحركة مثل تأثير المنظر وتأثير lottie والمزيد.
• الخطوط والألوان العالمية – اضبط اختياراتك للخطوط والألوان عبر موقعك بنقرة واحدة
• مجاني – يمكنك البدء باستخدام Elementor مجانًا تمامًا
• المصدر المفتوح – يمكنك تحسين قدرات العنصر عن طريق إضافة الوظائف المخصصة الخاصة بك و Cutom CSS.

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

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

في الواقع، تجعل المنصات مثل ووردبريس عملية تطوير الموقع بالكامل أسهل كثيرًا. ومع ذلك، فأنت دائمًا تريد المزيد.

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

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

دعنا نتعمق أكثر في سبب وجوب استخدام اضافة منشئ الصفحات Elementor.

1. سهولة الاستخدام

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

2. التحرير المباشر

Elementor هو محرر WYSIWYG (ما تراه هو ما تحصل عليه). من خلال المعاينة في الوقت الفعلي، يمكنك مشاهدة كيف تبدو صفحتك بالضبط بعد التحديث، بدلاً من نشرها ثم الاضطرار إلى الإعادة إذا لم تسر بالطريقة التي تريدها.

3. أصول قوية ومثيرة للإعجاب

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

4. تصميم مستجيب

نظرًا لأن أكثر من 50٪ من زيارات موقع الويب تأتي من أجهزة الجوال، فمن الضروري أن تحصل على عرض الجوال لموقعك على الويب.

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

5. الخطوط العالمية والألوان

قم بتعيين اختياراتك من الخطوط والألوان عبر موقعك بنقرة واحدة. من العناوين والفقرات وحتى نص الزر، حدد علامتك التجارية مرة واحدة وقم بتطبيقها على كل عنصر على موقعك.

6. قوالب جاهزة

مع قوالب موقع Astra على الويب، لن تحتاج حقًا إلى بديل. هناك نموذج جاهز بغض النظر عن المكانة التي أنت فيها.

إذا كنت تبحث عن المزيد من الخيارات، فيمكنك التفكير في مجموعة رائعة من القوالب التي يفتخر بها Elementor. لذلك، حتى لو كنت مبتدئًا تبدأ بتصميم مواقع الويب، فإن Astra و Elementor قد يجعلونك قوي.

7. إنشاء تأثيرات حركة متقدمة

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

8. آمن للغاية

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

9. 50+ لغة

مع تكامل الغة العربية وخيارات الاتجاهات ودعم متعدد اللغات، يتوفر Elementor بلغات متعددة. استخدم النظام الأساسي بلغتك المفضلة.

10. التكامل السلس مع اضافات ووردبريس

سواء كان كنت ذلك اضافات التجارة الالكترونية و LMS و السيو و العضويات وغير ذلك الكثير، فإن Elementor متوافق مع اضافات ووردبريس الشائعة.

11. المصدر المفتوح

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

12. تاريخ المراجعة

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

باستخدام محفوظات مراجعة Elementor، يمكن بسهولة تتبع عملية إنشاء الصفحة بالكامل.

13. لا يوجد اكواد مختصرة

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

14. مجتمع نشط

مع Elementor، لست وحدك. نظرًا للشهرة الهائلة التي تتمتع بها اضافة Elementor، هناك مجتمع متزايد يمكنك الاتصال به.

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

15. غير مكلف ومجاني

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

10. ايجابيات وسلبيات استخدام منشئي الصفحات Elementor

تمامًا مثل أي شيء آخر، فإن Elementor لها ايجابياتها وسلبياتها. في حين أن المزايا تفوق العيوب، فقد قمنا بإدراجهما هنا من أجلك.

الايجابيات الرئيسية:

• واجهة بسيطة وبديهية
• سحب وإفلات منشئ الصفحة
• تخصيص الصفحات بسهولة لمختلف الأجهزة (سطح المكتب والجوال والأجهزة اللوحية)
• معاينات حية في الوقت الحقيقي أثناء التحرير
• أكثر من 90 أداة، وأكثر من 300+ قالب، والعديد من الكتل للاختيار من بينها
• تكامل سلس مع أدوات الطرف الثالث
• تأمين مع التحديثات بانتظام
• قم بإنشاء سمات مخصصة ونوافذ منبثقة ورسوم متحركة جذابة
• متوافق مع جميع القوالب
• يتكامل بشكل جيد مع ووكومرس
• النسخة المجانية تعمل بشكل رائع

السلبيات الرئيسية:

• تحتاج إلى الترقية إلى الإصدار الاحترافي للحصول على الدعم
• لا يوجد خيار تسعير مدى الحياة
• تحميل بطيء للصفحة

افكار اخيرة

يا للعجب، لقد غطينا الكثير من التفاصيل مع هذا البرنامج التعليمي لمنشئ الصفحات Elementor!

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

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

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

نأمل أن يكون هذا المقال قد أعطاك نقطة انطلاق رائعة للنجاح مع Elementor. إذا كان لديك أي أسئلة أو تعليقات، يرجى مشاركتها معنا أدناه!