كيفية إنشاء أقسام موقع ويب Hero في Gutenberg بالموضوع الإجمالي

يأتي موضوع Total WordPress مع مجموعة كاملة من الأدوات التي قد يحتاجها موقع الويب الخاص بالعمل.

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

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

مع وصول Gutenberg ، محرر WordPress القائم على الكتلة ، يمكن تخصيص أي سمة WordPress ، بما في ذلك Total ، بشكل أكبر. يمنحنا اختيار عناصر المحتوى (الكتل) حرية التخصيص التي لم نشهدها من قبل في جوهر WordPress ، ومن الصعب إنكار ذلك.

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

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

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

لتعزيز إمكانيات التخصيص في Gutenberg ، سنستخدم المكون الإضافي Getwid WordPress Blocks الذي نوصي به لمستخدمي السمات الإجمالية. نحن على يقين من أن بعض مستخدمي Total قد جربوا بالفعل توزيعهم على Getwid.

ولكن بالنسبة لأولئك الذين يتساءلون عن ماهية Getwid ، فإن ما يلي هو وصف موجز.

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

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

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

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

أمثلة على قسم البطل والحث على اتخاذ إجراء التي تم إنشاؤها باستخدام Getwid في المجموع

لقد أجرينا هذه الاختبارات التجريبية في نسخة مجانية من موضوع Total ويمكننا القول بأمان أنه لا توجد قيود تقريبًا.

ومع ذلك ، فإن خيارات عرض حاوية موقع الويب الإجمالي محدودة ، لذلك إذا كنت تبحث عن تخطيطات غامرة بملء الشاشة ، فقد ترغب في التفكير في Total Plus.

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

شيء بارز آخر حول حاوية القسم هو أنها توفر لك العديد من أنواع الخلفية: صورة أو لون أو فيديو (من مكتبة WP Media أو YouTube) وتدرج متعدد الألوان والمزيد.

لذا فإن المهام الرئيسية الخاصة بك عند تصميم مناطق موقع الويب مع قسم القسم هي:

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

دعنا الآن نذهب مع الأمثلة.

مثال 1. عرض المنتج

يتم وضع جميع الكتل في هذا المثال داخل كتلة القسم:

1. العنوان المتقدم
2. العنوان المتقدم
3. العنوان المتقدم
4. مجموعة الأزرار
5. خلفية القسم: صورة (الموضع> أعلى اليمين ؛ الحجم> تلقائي)

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

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

مثال 2. مقتطف من المحفظة

يتم وضع جميع الكتل داخل كتلة القسم:

1. العنوان المتقدم
2. العنوان المتقدم
3. ثلاثة أعمدة (فقرة ، صورة ، صورة ، صورة)
4. خلفية القسم: الانحدار

يمكنك أيضًا وضع زر الحث على اتخاذ إجراء للربط بصفحة المحفظة الكاملة.

مثال 3. بطاقة ميزة أو حدث

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

تسمح لك مجموعة العناوين المتقدمة باختيار أي خط:

في هذا المثال ، استخدمنا خلفية متدرجة ومقسم للخلفية للشكل السفلي (موجات متعددة الطبقات).

1. عنوانان متقدمان
2. فقرة
3. زر
4. صورة
5. خلفية القسم: التدرج + فواصل الشكل

مثال 4. قسم الحث على اتخاذ إجراء

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

إنه قسم سهل للغاية مع صورة الخلفية وبعض العناوين وزر مركزي.

1. ثلاث كتل عناوين متقدمة
2. كتلة الزر
3. خلفية القسم: صورة ذات عتامة (الحجم> الغلاف)

ستستمتع أيضًا بمدى سهولة ضبط محاذاة المحتوى باستخدام الزوايا القابلة للسحب:

إنه أيضًا اتجاه لإنشاء تخطيطات تعويض عن طريق وضع العناوين فوق الصور:

في Getwid ، يمكنك تحقيق ذلك عن طريق تعيين صورة خلفية مناسبة مع بعض المساحة الفارغة لسطر النص.

مثال 5. أقسام Sub-hero

غالبًا ما توفر أقسام sub-hero مزيدًا من المعلومات حول مشروع أو شخص. إنها مناسبة لعرض سيرتك الذاتية أو قصتك أو أهدافك الرئيسية.

كعنصر مرئي ، استخدمنا مجموعة Image Stack Gallery بواسطة Getwid ، والتي تأتي مع العديد من الأنماط. ومع ذلك ، يمكنك استبدالها بصورة أو مقطع فيديو أو أي عنصر محتوى آخر.

1. عنوانان متقدمان
2. فقرة
3. زر
4. قالب معرض مكدس الصور
5. خلفية القسم: لون خالص

مثال 6. لهجات بصرية

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

على سبيل المثال ، يمكنك استخدام كتلة شريط تمرير الوسائط والنص بواسطة Getwid لإنشاء عرض شرائح بمحتوى نصي اختياري:

1. الوسائط والنص المنزلق
2. خلفية القسم: متدرجة + فواصل علوية وسفلية بارتفاع مخصص

هناك أيضًا العديد من كتل Getwid المستندة إلى النشر والتي يمكن تقديمها في شريط التمرير (سيتم الحصول عليها تلقائيًا من محتوى موقع الويب الخاص بك). هل تريد تقديم بعض أحدث المشاركات أو التي تم تحديدها يدويًا في شريط تمرير أو تنسيق شبكة / قائمة؟ هناك كتلة لذلك.

مثال 7. لافتات

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

الكتلة هي تطابق مثالي لكل من المبيعات المؤقتة والميزات الثابتة.

1. لافتة
2. خلفية القسم: تدرج أحادي اللون

مثال 8. أقسام إعلامية

إذا كنت ترغب في إظهار المزيد من المعلومات بطريقة منظمة ومضغوطة ، فإن Getwid يقدم ثلاث كتل مخصصة لهذا الغرض: علامات التبويب ، والأكورديون ، والتبديل.

إليك تخطيط من عمودين مع كتلة الأكورديون وصورة بجانبه:

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

هناك العديد من الكتل التي يمكن أن تضيف وظائف فريدة إلى أقسام التسويق الخاصة بك ، مثل Image Hotspot لبناء أقسام صور إعلامية ، Icon Box للخدمات ، موجز لمعرض Instagram في الوقت الفعلي والمزيد.

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

للختام

هل تعرف ما هو أفضل شيء في استخدام التحرير والسرد Gutenberg و Getwid في سمة Total المجانية؟ لا ، ليس فقط عدد الكتل هو المهم.

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

حتى لا ينضج محرر الكتلة بدرجة كافية ، يمكن أن يكون الملحق الإضافي الأصلي لـ Gutenberg نقطة انطلاق رائعة.

هل جربت جوتنبرج أو جيتويد؟ اسمحوا لنا أن نعرف في التعليقات.