كيفية استخدام SiteOrigin Page Builder مع WordPress

مثل منشئي صفحات WordPress الآخرين ، SiteOrigin موجود هنا لمساعدتك في إنشاء موقع ويب قوي وسريع الاستجابة مع بعض CSS ومعرفة بالشفرة الصفرية. هناك عدد قليل من السمات من نهايتها يمكنك استخدامها (المجانية والمتميزة) بالإضافة إلى المكونات الإضافية المجانية و Pro page builder.

لقد اختبرت الإصدار الاحترافي من SiteOrigin وأنشأت صفحة مقصودة. يأتي مزودًا بوظيفة السحب والإفلات ويعمل مع أي سمة ويمكنك استخدام جميع عناصر واجهة المستخدم المجانية و Pro و WordPress في نفس الوقت. دعنا نقرأ هذه المقالة لمعرفة المزيد عن تثبيت SiteOrigin وتكوينه باستخدام WordPress.

لماذا تختار SiteOrigin Page Builder؟

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

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

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

ميزات SiteOrigin Page Builder

يأتي الإصدار المجاني من SiteOrigin مع خيارات محدودة جدًا من "عناصر واجهة المستخدم" ولكن مع إصدار Pro ، لديك مجموعة من الأدوات الإضافية المفيدة لبناء موقعك بسهولة.

منشئ نوع المنشور المخصص

واحدة من أكثر الميزات شيوعًا وفائدة في SiteOrigin هي Custom Post Type Builder مع تخطيطات Page Builder قابلة لإعادة الاستخدام وقوالب WooCommerce. إنها مختلفة قليلاً عن الأدوات الأخرى وسأقدم شرحًا أعمق قليلاً حول كيفية استخدامها.

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

الخطوة 1

ستحتاج إلى إضافة نوع منشور مخصص جديد ، وبناء تخطيط نوع المنشور باستخدام Page Builder واختيار إعدادات عرض نوع المنشور.

من لوحة تحكم WordPress الخاصة بك ، انتقل إلى Tools → Post Types وانقر فوق Add New Button ، وقم بتسميته Portfolio ، على سبيل المثال. الآن ، انقر فوق علامة التبويب Page Builder بجوار علامتي التبويب Text و Visual ، واستخدم أزرار Page Builder Add Widget و Add Row لإنشاء تخطيط نوع المنشور المخصص لمحفظتك.

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

الخطوة 2

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

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

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

أداة ما بعد الحلقة

يحتوي SiteOrigin على أداة Post Loop Widget المضمنة ولكنها تعتمد على قوالب التكرار داخل السمة النشطة.

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

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

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

WooCommerce Template Builder

تسمح قوالب WooCommerce بإنشاء صفحات WooCommerce جميلة ومظهر مرئي لمنتج واحد. يتم تقسيم واجهة WooCommerce Template Builder إلى سبع علامات تبويب:

1. المنتج
2. أرشيف المنتج
3. محل
4. عربة التسوق
5. عربة فارغة
6. الدفع
7. حسابي

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

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

الأدوات الأخرى شائعة مثل الخرائط والأكورديون وعبارات الحث على اتخاذ إجراء وعلامات التبويب والأدوات الاجتماعية ودوائر العرض وما إلى ذلك.

مع اشتراك Pro ، لا تحصل فقط على Pro Page Builder ولكن يمكنك الوصول إلى جميع ميزات Pro والسمات المميزة و CSS والأدوات المصغرة.

التسعير وخطط SiteOrigin Page Builder

تقدم SiteOrigin نموذجين للتسعير. الأول والأكثر فائدة هو الاشتراك السنوي ، والذي يأتي في 3 باقات.

• مفرد لموقع واحد بسعر 29 دولار
• أعمال لما يصل إلى 5 مواقع بسعر 49 دولارًا
• مطور لمواقع غير محدودة بسعر 99 دولار

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

• مفرد لموقع واحد بسعر 38 دولار
• أعمال لما يصل إلى 5 مواقع بسعر 64 دولارًا
• مطور لمواقع غير محدودة بسعر 128 دولار

متطلبات النظام / الاستضافة من SiteOrigin

على الرغم من صعوبة العثور على متطلبات النظام الخاصة بـ SiteOrigin. من بعض منتديات الدعم والتعليقات عبر الإنترنت ، يبدو أن PHP 7.4 مع 512 ميجا بايت على الأقل من ذاكرة PHP ستفي بالغرض. ومع ذلك ، فقد استخدمت VultrHF مع ذاكرة PHP سعة 2 جيجابايت لأغراض الاختبار.

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

تثبيت وتكوين SiteOrigin Page Builder

عندما يتعلق الأمر بالتثبيت والتكوين ، فإن SiteOrigin يقدم شيئًا مثيرًا للاهتمام لا يفعله معظم منشئي الصفحات.

بالنسبة إلى كل شيء في WordPress ، يجب عليك تثبيت SiteOrigin المجاني مباشرة من Repository ، وبعد ذلك ، يمكنك تحميل الإصدار Pro الذي تم تنزيله من حساب SiteOrigin الخاص بك. بعد الانتهاء من التثبيت ، اتبع الخطوات وقم بتثبيت / تنشيط المكونات الإضافية الموصى بها.

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

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

عند الانتهاء ، يمكنك البدء في بناء موقعك باستخدام منشئ الصفحة SiteOrigin. انتقل إلى Pages → Add New وبالنقر على سهم القائمة المنسدلة ، سيُعرض عليك إضافة صفحة جديدة باستخدام SiteOrigin Page Builder و Block Editor ← حدد SiteOrigin Page Builder.

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

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

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

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

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

في الزاوية اليسرى العلوية ، سترى شريط الأدوات به 4 عناصر. من اليسار إلى اليمين سيفعلون ما يلي.

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

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

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

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

أداء SiteOrigin Page Builder على Cloudways

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

- نتائج SiteOrigin على GTMetrix

- نتائج SiteOrigin على أدوات Pingdom

- نتائج SiteOrigin على WebPageTest

تقييمات مستخدمي SiteOrigin Page Builder

وما هو دائمًا أحد الأشياء التي يجب عليك التحقق منها قبل تثبيت أي مكون إضافي هو المراجعات والتقييمات على مستودع البرنامج المساعد WordPress.org. بالنسبة إلى SiteOrigin ، هناك 922 تقييمًا من فئة 5 نجوم حتى الآن والمراجعات الأخيرة رائعة.

ملخص

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

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

النظام البيئي حول SiteOrigin ليس كبيرًا كما هو الحال بالنسبة لبعض منشئي الصفحات الآخرين ، لكننا نحتاج إلى أن نأخذ في الاعتبار أنه يحتوي على مليون تثبيت نشط للإصدار المجاني و 900.000 لحزمة Widget وبعض الإضافات الخارجية للمؤلفين بها أكثر من 30.000 منشآت نشطة.