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

لحسن الحظ، يوفر البرنامج الإضافي لبناء السمات Beaver Themer طريقة سهلة لتصميم رؤوس وتذييلات مخصصة، مما يحافظ على اتساق موقعك بالكامل من الناحية المرئية.

في هذا الدليل، سنستكشف أربع خطوات مباشرة لإنشاء الرؤوس والتذييلات باستخدام Beaver Themer. دعونا الغوص في!

جدول المحتويات

• مقدمة إلى سمور Themer
• كيفية إنشاء رؤوس باستخدام Beaver Themer (في 4 خطوات)
• كيفية إنشاء تذييلات باستخدام Beaver Themer (في 4 خطوات)
• الأفكار النهائية
• أسئلة ذات صلة

مقدمة إلى سمور Themer

يأخذ Beaver Themer بناء الصفحة إلى مستوى جديد كليًا من خلال السماح لك بتخصيص مناطق الموقع التي غالبًا ما يتم تحديدها بواسطة السمة الخاصة بك - مثل الرؤوس والتذييلات والمزيد. وهذا يفتح إمكانية الحصول على مظهر متماسك ومميز عبر موقعك بالكامل:

مع سمور Themer، يمكنك:

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

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

احصل على إمكانية الوصول إلى Beaver Themer مع الخطط المميزة

والخبر السار هو أن Beaver Themer متضمن في أي خطة Beaver Builder المتميزة:

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

الآن بعد أن اكتشفنا فوائد Beaver Themer، دعنا ننتقل إلى عملية إنشاء الرؤوس خطوة بخطوة باستخدام Beaver Themer.

كيفية إنشاء رؤوس باستخدام Beaver Themer (في 4 خطوات)

يمكن أن يساعد الرأس المخصص في عرض علامتك التجارية، وتسهيل التنقل في موقعك، وإبراز عبارات الحث على اتخاذ إجراء (CTA) الرئيسية. إليك كيفية إنشاء واحدة باستخدام Beaver Themer:

للبدء، تأكد من تثبيت أداة إنشاء الصفحات Beaver Builder المتميزة ومكونات Beaver Themer الإضافية وتنشيطها وترخيصها. قم أيضًا بإنشاء قائمة لموقعك من خلال الانتقال إلى Appearance > Menus في لوحة تحكم WordPress.

الخطوة 1: إنشاء تخطيط موضوع جديد

لإنشاء تخطيط Themer جديد، انقر فوق Beaver Builder > Themer Layouts من منطقة إدارة WordPress الخاصة بك. ثم اختر إضافة جديد :

هنا، يمكنك إعطاء التصميم الخاص بك عنوانًا :

بالنسبة للنوع ، حدد تخطيط الموضوع . بالنسبة للتخطيط ، استخدم القائمة المنسدلة لاختيار الرأس . انقر فوق إضافة تخطيط Themer للمتابعة.

الخطوة 2: تكوين الإعدادات

بعد ذلك، في صفحة الإعدادات، حدد مكان وكيفية عرض الرأس:

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

انقر فوق نشر لحفظ هذه الإعدادات.

الخطوة 3: تخصيص تخطيط رأسك

الآن بعد أن تم تكوين إعداداتك، انقر فوق Launch Beaver Builder لفتح رأسك الجديد في المحرر:

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

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

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

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

بعد ذلك، اكتب ببساطة عنوانك المفضل في حقل نص العنوان :

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

إذا كنت ترغب في إعادة ترتيب الوحدات في رأسك، فما عليك سوى النقر فوق أيقونة النقل واسحب كل وحدة إلى الموضع المفضل لديك داخل التخطيط:

لتحديث لون خلفية الصف الخاص بك، انقر فوق رمز مفتاح الربط . في القائمة المنبثقة "إعدادات الصف"، انتقل إلى علامة التبويب "النمط"، ثم قم بالتمرير إلى "لون الخلفية" واختر الظل المطلوب:

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

الخطوة 4: إضافة محتوى إلى رأسك

قد تفكر أيضًا في إضافة المزيد من الوحدات إلى رأسك. كما ذكرنا سابقًا، يسمح Beaver Builder بالمحتوى الديناميكي من خلال الاتصالات الميدانية.

لإعداد اتصالات الحقول الخاصة بك، ما عليك سوى النقر على أيقونة + الموجودة بجوار المربع لعرض الحقول المتاحة:

ثم انقر فوق "اتصال" لإنشاء المحتوى الديناميكي الخاص بك.

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

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

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

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

قد ترغب أيضًا في تضمين CTA في رأسك. للقيام بذلك، أضف وحدة Button، ثم استخدم علامة التبويب "عام" لتخصيص النص، وإدراج الرابط الخاص بك، وإضافة رمز:

في علامة تبويب النمط، يمكنك ضبط العرض واختيار ألوان النص والخلفية - بما في ذلك ألوان التمرير - وتعديل المحاذاة والحشو:

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

كيفية إنشاء تذييلات باستخدام Beaver Themer (في 4 خطوات)

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

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

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

الخطوة 1: إعداد تخطيط Themer جديد

تمامًا كما هو الحال مع رأسك، ستبدأ بإنشاء تخطيط لتذييلك. انتقل إلى Beaver Builder > Themer Layouts وانقر على "إضافة جديد" .

الخطوات هي نفسها تقريبًا كما كانت من قبل — قم بتسمية التذييل الخاص بك، وحدد Themer Layout للنوع ، ثم اختر Footer للتخطيط :

ثم، انقر فوق إضافة تخطيط Themer .

الخطوة 2: تكوين إعدادات التذييل

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

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

انقر فوق الزر ذي الصلة لإضافة قواعد الموقع والاستبعاد. اختر الصفحة (الصفحات) المحددة التي تريد تضمينها أو استبعادها.

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

الخطوة 3: تخصيص تخطيط التذييل الخاص بك

الآن، حدد Launch Beaver Builde r لفتح المحرر:

كما هو الحال مع الرأس، قدم Beaver Builder قالب تخطيط افتراضي للتذييل الخاص بك:

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

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

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

انقر على حفظ لتطبيق التغييرات الخاصة بك.

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

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

الصق عنوان URL الخاص بك وحدد حفظ . يمكنك أيضًا إضافة رقم الاتصال الخاص بك وعنوان البريد الإلكتروني للشركة بنفس الطريقة.

يتضمن Beaver Builder إشعارًا بحقوق النشر بشكل افتراضي. اضبطه من خلال النقر على الوحدة وإضافة البيان الخاص بك:

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

الخطوة 4: إضافة محتوى إلى تذييل الصفحة

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

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

يتكامل Beaver Builder مع العديد من موفري خدمات التسويق عبر البريد الإلكتروني، مما يسمح لك باختيار الخدمة المفضلة لديك من القائمة المنسدلة:

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

قم بالتبديل إلى علامة تبويب الزر لتحرير نص الزر وضبط الألوان وإضافة الحشو والمزيد:

قد تجد علامة التبويب Captcha مفيدة إذا كنت تريد من المستخدمين التحقق من أنهم ليسوا روبوتات.

فكر في إضافة روابط إلى حساباتك الاجتماعية أيضًا. استخدم وحدة Icon Group واسحبها إلى تذييل الصفحة:

ثم، في علامة التبويب "الأيقونات" في النافذة المنبثقة، انقر فوق "تحرير الأيقونة" :

انقر على تحديد أيقونة لاختيار الرمز المناسب. ستجد أيقونات لمنصات التواصل الاجتماعي الرئيسية مثل Facebook وLinkedIn وTwitter. ثم أضف الرابط إلى ملفك الشخصي:

انقر فوق "حفظ" للعودة إلى حيث يمكنك إضافة بقية روابطك الاجتماعية:

استمر في إضافة وحدات إلى تذييل الصفحة. عندما تصبح راضيًا عن التخطيط، انقر فوق تم > نشر .

الأفكار النهائية

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

فيما يلي ملخص سريع لكيفية إنشاء الرؤوس والتذييلات باستخدام Beaver Themer:

1. قم بإنشاء تخطيط Beaver Themer جديد.
2. قم بتكوين الإعدادات الخاصة بك.
3. تخصيص تخطيطات رأس وتذييل الصفحة الخاصة بك.
4. أضف محتوى إلى رأسك أو تذييلك.

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

أسئلة ذات صلة

ما هي فوائد استخدام Beaver Themer للرؤوس والتذييلات؟

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

كيف يمكنك استخدام سمور Themer؟

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

كيف أجعل رأسي متوافقًا مع الهاتف المحمول؟

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

نبذة عن ويل موريس

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