لم يكن تصميم موقع ويب ذو مظهر احترافي مناسبًا للجميع ، خاصة وأننا شعرنا جميعًا أنك بحاجة ماسة إلى أن تكون مصمم ترميز ويب محترف. في الوقت الحاضر ، نرى أدوات جديدة تنشأ لنظام WordPress البيئي ، من أجل توفير حل أبسط من أي وقت مضى لتصميم موقع على شبكة الإنترنت وهذا في متناول معظم المبتدئين.
فيما يتعلق بتصميم تخطيطات WordPress ، كان علينا بالفعل تقديم المكوّن الإضافي الملحن البصري، والتي تعد بالتأكيد واحدة من أفضل الأدوات عندما يتعلق الأمر بتصميم التخطيط. وتجدر الإشارة مع ذلك إلى أن هذا الحل غير مناسب للجميع. هذا هو السبب في أنه في هذا البرنامج التعليمي ، سوف نقدم لك المزيد في وورد البرنامج المساعد Elementor ، وهو ملف وورد البرنامج المساعد freemium (مجاني ، ولكن قابل للتمديد بموجب الاشتراك).
أين يمكن الحصول على عنصر لبرنامج WordPress
نحن نفكر بجدية في جعلك ترى إمكانات المكون الإضافي ، وسوف يساعدك الحل المجاني في البدء دون دفع فلس. هذا الحل المجاني متاح في WordPress.org. كونه وورد البرنامج المساعد، يتم تثبيت هذا الأخير مثل أي شيء آخر البرنامج المساعد من لوحة القيادة.
إذا تمكن المكوّن الإضافي من إرضائك تمامًا ، فستتمكن من الحصول على الترخيص الكامل بجميع الوظائف على الموقع العنصر الرسمي.
الميزات الرئيسية للعنصر
قبل بدء البرنامج التعليمي بنظرة عامة على المكون الإضافي ، سنقدم لك أولاً الميزات الرئيسية للمكون الإضافي (الإصدار المجاني والإصدار الكامل).
| نسخة مجانية | النسخة الكاملة |
|---|---|
| أعمدة متعددة | قائمة التنقل ، مقال |
| وحدات النصوص، العناوين | وحدة WooCommerce (المنتجات ، الفئات) |
| وحدات الفيديو ، صورة ، دائري ، معارض ، Soundcloud | تكامل Facebook (صفحة ، زر ، تعليقات) |
| وحدة المشاركة | أسعار الجدول |
| وحدة HTML | محفظة ، نموذج |
| وحدة لواجهة ورد | وحدة البحث |
لاحظ أن هذه قائمة شاملة إلى حد ما من الميزات المختلفة التي يوفرها المكون الإضافي. ستجد المزيد من التفاصيل في استكشاف موقعه على الانترنت.
ابدأ مع Elementor
لن نغطي عملية التثبيت بأكملها هنا. نظرًا لأن هذا مكون إضافي لبرنامج WordPress ، فقد تم بالفعل شرح إجراء التثبيت بتنسيق تعليمي السابق. ومع ذلك ، بعد التثبيت ، سيتم نقلك إلى الصفحة الرئيسية للمكون الإضافي.
إذا كانت لديك هذه الصفحة على شاشتك ، فهذا يعني أنك نجحت في تثبيت ملف العنصر المساعد. نحن نستخدم حاليًا الإصدار الكامل لهذا البرنامج التعليمي ، ولكن لا ينبغي أن تكون الواجهة مختلفة جدًا عن الإصدار المجاني.
قبل الانتقال إلى واجهة التحرير ، سأدعوك لتسجيل ترخيصك. هذا صالح فقط لأولئك الذين اختاروا النسخة الكاملة. إذا كان لديك الإصدار المجاني ، فيمكنك الانتقال إلى القسم التالي. لتسجيل ترخيصك ، ستلاحظ إشعارًا على WordPress سيطالبك بتسجيل ترخيصك.
لذا فقط اضغط عليها للذهاب إلى صفحة التسجيل والنقر فوق تفعيل.
ستحتاج عادةً إلى صفحة التأكيد إذا كانت رخصتك صالحة.
إذا لم تصل إلى هذه الصفحة ، فأنا أدعوك إلى الاتصال بمطوري المكون الإضافي للمزيد المساعدة في حل المشكلة.
كيفية استخدام Elementor
يعمل Elementor على الصفحات والمنشورات على WordPress. سواء كنت تستخدم الواجهة الكلاسيكية أو واجهة Gutenberg الجديدة ، سترى زرًا سيطالبك باستخدام Elementor Builder.
من الناحية العملية ، لن تحتاج دائمًا إلى تعديل مشاركاتك باستخدام Elementor. لذلك أدعوك لاستخدام البرنامج المساعد فقط على الصفحات. من خلال النقر على الزر ، ستصل إلى واجهة تصميم Elementor التي توفر جوًا من déjà vu (لأولئك الذين يستخدمون أداة تخصيص WordPress).
إذن لديك على اليسار عناصر التحكم المتنوعة التي يوفرها المكون الإضافي وعلى اليمين ، لديك معاينة مباشرة لتغييراتك. في هذا البرنامج التعليمي ، نستخدم موضوع Twenty Sixteen WordPress.
أقسام العنصر
الأقسام في Elementor هي مجموعات من كتل الوظائف التي يقدمها Elementor. يعتمد عدد الأقسام على ما إذا كنت تستخدم الإصدار الكامل وما إذا كنت تستخدمه WooCommerceأو Yoast SEO أو أي مكونات إضافية متوافقة. اعتمادًا على هذه الشروط، سيكون لديك أقسام أكثر أو أقل على الواجهة الخاصة بك. نظرًا لأننا نستخدم النسخة الكاملة مع البرنامج المساعد WooCommerce تم تفعيله، وهذا هو الشكل الذي تبدو عليه واجهتنا.
كيفية وضع كتلة Elementor
بمجرد توسيع القسم ، ستجد كتل العناصر. يتم وضع كتل Elementor المختلفة بواسطة "Drag & Drop" في المنطقة المميزة بخطوط منقطة.
كيفية اختيار تخطيط على Elementor
قبل إضافة كتلة على Elementor ، عليك أن تتذكر اختيار تخطيط بالنقر فوق الزر "+" في القسم المميز.
بناءً على احتياجاتك ، ستختار التصميم الأنسب. بمجرد اختيار التخطيط ، يكون لديك تمثيل لهذا القسم في نفس المنطقة مظللًا. سيعرض هذا القسم نفس عدد الأعمدة المقابلة لاختيارك. في حالتي ، اخترت عمودًا به 3 أعمدة.
الكتل المختلفة التي بداخلها علامة "+" هي المناطق التي يمكن أن تقبل كتل Elementor. إذا قمت بإضافة كتلة Elementor دون اختيار تخطيط أولاً ، فسيتم اختيار تخطيط العمود الفردي افتراضيًا.
يمكن إعادة ترتيب أقسام العنصر فيما بينها ، باتباع نفس مبدأ "السحب والإفلات". يمكنك أيضًا حذف قسم ، إذا لم تعد ترغب في استخدامه.
فيما يلي مثال لقسم يحتوي على كتلتين هما كتلة العنوان وكتلة النص.
كيفية استخدام أدوات التصميم الأخرى
بعد الانتهاء من تصميمك ، فإن أحد الأشياء التي تريد القيام بها هو حفظ عملك. ستجد هذا الخيار في أسفل القسم الذي يعرض أقسام العنصر المختلفة.
يمكنك اختيار الحفظ مباشرة (نشر) ، والحفظ كمسودة أو كقالب. سوف نستكشف هذه النقاط المختلفة أكثر لاحقًا.
أثناء التصميم الخاص بك ، قد ترغب أيضًا في معاينة التغييرات بدون واجهة Elementor الإضافية. كل ما عليك فعله هو النقر على أيقونة العين.
يحدث أنه أثناء التصميم ، يحدث خطأ (إجراء غير إرادي). في هذه الحالة ، يقدم Elementor محفوظًا ، والذي يسمح لك بالتصفح في جميع أفعالك.
هذا سيسمح لك بالعودة بسهولة.
يسمح لك خيار "المتصفح" ، الذي يأتي قبل زر السجل مباشرة ، بتعديل الأقسام المختلفة فيما يتعلق بالمتصفح الذي يستخدمه الزوار. يتيح لك هذا الخيار الوصول إلى تعديل متقدم لهياكل القسم (عرض العمود). عليك إجراء تغييرات هنا بعناية فائقة.
يتيح لك زر "الإعدادات" تعديل خيارات معينة خاصة بالصفحة مثل العنوان أو الصورة المميزة أو الحالة وغيرها.
هذا كل شيء في هذا البرنامج التعليمي ، سوف نستكشف Elementor أكثر في البرنامج التعليمي التالي. لا تتردد في إلقاء نظرة على الموقع الرسمي الذي يقدم أمثلة أكثر نجاحًا.
