4 طرق سهلة (3 بدون كود)
نشرت: 2022-07-21العنوان هو العنصر الأول في موقع الويب الخاص بك الذي يراه معظم الزوار. عادةً ما يكون هذا هو المكان الذي يتم فيه وضع شعار وقائمة موقعك ، وهو جزء لا يتجزأ من كل صفحة. إذا كنت لا تعرف كيفية تعديل رأس WordPress ، فستواجه صعوبة - تكوين انطباع أول قوي.
يمكّنك WordPress من تعديل رأس موقعك بعدة طرق. يأتي كل موضوع تقريبًا مع تصميم رأس فريد ، يمكنك تخصيصه يدويًا. بالتناوب ، يمكنك استخدام مجموعة من الأدوات التي يوفرها مجتمع WordPress الأكبر.
في هذه المقالة ، سنعرض لك أربع طرق لتعديل رأس WordPress ، سواء مع المكونات الإضافية أو بدونها. هيا بنا إلى العمل!
جدول المحتويات:
- قم بتحرير الرأس باستخدام أداة التخصيص
- استخدام تحرير الموقع بالكامل (وموضوع متوافق)
- قم بتحرير العنوان باستخدام أداة إنشاء صفحات WordPress
- أضف رمزًا مخصصًا إلى العنوان باستخدام مكون إضافي
1. قم بتحرير الرأس باستخدام أداة التخصيص
يعد WordPress Customizer أداة مدمجة تمكنك من تحرير العناصر العالمية لموقعك على الويب. يمكنك استخدام أداة التخصيص لتعديل رأس الصفحة وتذييلها وخطوط الطباعة والقوائم والجوانب الرئيسية الأخرى لموقعك.
للوصول إلى أداة التخصيص ، انتقل إلى لوحة القيادة وانقر على المظهر > تخصيص . سيعرض Customizer قائمة من الخيارات إلى اليسار ومعاينة لموقع الويب الخاص بك على اليمين:

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

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

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

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

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

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

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

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

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


عندما تكون سعيدًا بالتغييرات التي تم إجراؤها على رأس الصفحة ، انقر فوق حفظ e . سيؤدي هذا إلى حفظ التغييرات التي تم إجراؤها على قالب رأس القالب ، وسوف تنعكس على موقع الويب الخاص بك تلقائيًا.
3. قم بتحرير العنوان باستخدام أداة إنشاء صفحات WordPress
تقدم بعض المكونات الإضافية لمنشئ صفحات WordPress خيارات لتحرير رأس WordPress. على سبيل المثال ، يتضمن Elementor Pro أداة Theme Builder التي يمكنك الوصول إليها بترخيص متميز.
إذا لم يكن لديك حق الوصول إلى Elementor Pro ، فيمكنك استخدام امتداد مجاني تابع لجهة خارجية ، مثل المكون الإضافي Elementor Header & Footer Builder في WordPress.org.
سنشرح لك كيفية القيام بذلك باستخدام Elementor Pro وميزة Theme Builder الخاصة به.
في الممارسة العملية ، يعمل Elementor Theme Builder بشكل مشابه لتحرير الموقع الكامل.
للوصول إلى مُنشئ القوالب ، انتقل إلى القوالب > مُنشئ القوالب . حدد خيارات Header ضمن SITE PARTS ، وابحث عن القوالب الموجودة على اليمين. يجب أن يكون هناك قالب رأس واحد فقط ، ويمكنك النقر فوق الزر تحرير بجواره:

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

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

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

ما لم تكن تدفع بالفعل مقابل ترخيص Premium Elementor ، قد لا تبرر أداة Theme Builder الشراء من تلقاء نفسها. إنه يفعل بالضبط ما يفعله تحرير الموقع الكامل ، ولكن بتكلفة أعلى. يتمثل الاختلاف الرئيسي في أنه يمكنك استخدام مجموعة وحدات Elementor الأوسع نطاقًا ، وإذا كنت تستخدم Elementor بالفعل ، فسيكون من الأسهل التأكد من أن تصميم العنوان الخاص بك متوافق مع بقية موقعك.
4. أضف رمزًا مخصصًا إلى العنوان باستخدام مكون إضافي
عادةً ما يكون استخدام المكونات الإضافية هو أسهل طريقة لتنفيذ التخصيصات في WordPress. ومع ذلك ، هذا ليس هو الحال عادةً مع الرؤوس. إذا كنت تريد مكونًا إضافيًا يمكّنك من تحرير الرؤوس بشكل مرئي ، فستحتاج إلى استخدام أداة إنشاء الصفحات. يأتي معظم منشئي الصفحات الذين يقدمون هذه الوظيفة بعلاوة ، كما ناقشنا في القسم السابق.
عادةً ما تقدم المكونات الإضافية المجانية التي تمكّنك من تخصيص الرأس طريقة أسهل لإضافة رمز مخصص إليها. البديل هو تحرير ملفات السمات يدويًا باستخدام سمة فرعية ، والتي يمكن أن تكون مخيفة (ومحفوفة بالمخاطر) ما لم تكن لديك خبرة في تطوير الويب.
أحد الأمثلة الرائعة على هذا البرنامج المساعد هو Header Footer Code Manager. تتيح لك هذه الأداة إضافة مقتطفات HTML و CSS وجافا سكريبت إلى الرأس و / أو التذييل واختيار الصفحات التي سيتم تحميل هذه المقتطفات عليها:
بمجرد تنشيط المكون الإضافي ، انتقل إلى HFCM > صفحة إضافة قصاصات جديدة في لوحة القيادة. يمكنك هنا تحديد نوع المقتطف الذي تريد إضافته ، ومكان عرضه ، وما إذا كنت تريد إضافته إلى الرأس أو التذييل:

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