ويمكن ملاحظة أنه يتكون من ثلاثة أقسام رئيسية.

• - جذر أي مستند HTML توجد فيه جميع الأقسام الأخرى (يجب أن تكون هذه العلامة في نسخة واحدة ويجب أن تكون موجودة في كل صفحة).
• – رأس يحتوي على معلومات الخدمة وتعليمات للمتصفح لعرض المحتوى.
• - القسم الرئيسي الذي يوجد به المحتوى، أي جميع المعلومات المفيدة (النصوص والصور ومقاطع الفيديو). بالإضافة إلى المحتوى، يحتوي هذا القسم على شبكة الموقع، أو تخطيطه - يتم وصف مواقع الأقسام الرئيسية للموقع، مثل الرأس والتذييل والقائمة الرئيسية والأعمدة الجانبية وما إلى ذلك.

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

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

سيتم عرض العنوان في شريط عنوان المتصفح

هذه العلامة هي العلامة الوحيدة المطلوبة في القسم.

بالإضافة إلى العلامة، يمكن وضع العلامات التالية في هذا القسم: , , , .

بطاقة شعار

تخبر هذه العلامة المتصفح بمكان وجود موارد خارجية معينة، مثل الأنماط الخارجية (CSS). أيضًا، باستخدام العلامة وتحديد سمة rel المقابلة، يمكنك تحديد عنوان موجز RSS والرمز المفضل للموقع والموارد الخارجية الأخرى.

بطاقة شعار

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

بطاقة شعار

باستخدام هذه العلامة، يمكنك إخبار المتصفح بالمكان الذي يجب أن يبحث فيه عن البرامج النصية الخارجية:

أو أدخل البرنامج النصي مباشرة في هذا القسم:

document.write("مرحبا بالعالم!")

بطاقة شعار

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

h1 (اللون: أحمر) p (اللون: أزرق)

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

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

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

مثال HTML: جربها بنفسك

موقع الويب - دروس تعليمية عبر الإنترنت حول HTML وCSS وJavaScript.
المحتوى الرئيسي...
عنصر

باستخدام العنصر، يمكنك تعيين وصف لمحتوى الصفحة والكلمات الرئيسية لمحركات البحث، ومؤلف مستند html، وخصائص بيانات التعريف الأخرى. يمكن أن يحتوي العنصر على عناصر متعددة لأنها تحمل معلومات مختلفة اعتمادًا على السمات المستخدمة.

ترميز صفحة HTML

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

العناصر الفوقية ومحركات البحث

تنظر بعض محركات البحث إلى العناصر التعريفية عند فهرسة الصفحة.
على سبيل المثال، تحدد العناصر التعريفية أدناه وصف مستند HTML والكلمات الرئيسية (يمكن لمحركات البحث استخدام هذه المعلومات عند عرض المستند في نتائج البحث):

وصف محتوى الصفحة والكلمات الرئيسية:

السمات المتاحة للعنصر هي charset، content، http-equiv، name، بالإضافة إلى السمات العامة.

سمات العلامة قيمة السمة/الوصف

مجموعة محارف	يحدد ترميز الأحرف لمستند HTML الحالي:
محتوى	يحدد قيمة الإرجاع للخاصية. يحتوي على نص عشوائي يحدد القيمة المرتبطة بسمة http-equiv أو name.
http-equiv	يتحكم في إجراءات المتصفح على صفحة ويب معينة (أي ما يعادل رؤوس HTTP). عند عرض الصفحة، سيتبع المتصفح الإرشادات المحددة في السمة: النمط الافتراضي - يحدد النمط المفضل لاستخدامه في الصفحة. يصف محتوىيجب أن يحتوي على معرف العنصر الذي يشير إلى ورقة أنماط CSS، أو معرف العنصر الذي يحتوي على ورقة الأنماط. التحديث - يشير إلى الوقت بالثواني قبل إعادة تحميل الصفحة أو الوقت قبل إعادة التوجيه إلى صفحة أخرى، إذا كان في السمة محتوىبعد الوقت هناك خط "عنوان URL=page_address". إعادة تحميل الصفحة تلقائيًا بعد فترة زمنية محددة، في هذا المثال بعد 30 ثانية: إذا كنت بحاجة إلى نقل الزائر فورًا إلى صفحة أخرى، فيمكنك تحديد عنوان URL في معلمة url:
اسم	يوفر وصفًا إضافيًا للعلامة. إذا تم حذف هذه السمة، فسيتم اعتبارها مكافئة للسمة http-equiv. لا ينبغي استخدامه إذا كان العنصر يحتوي بالفعل على مجموعة سمات http-equiv أو charset أو itemprop. اسم التطبيق - يحدد اسم تطبيق الويب المستخدم في الصفحة. المؤلف - يستخدم للإشارة إلى اسم مؤلف صفحة الويب: الوصف - هو وصف للصفحة، وغالبًا ما تستخدمه محركات البحث لتحديد ما هو مخصص له، على سبيل المثال: المولد - يحدد إحدى حزم البرامج المستخدمة لإنشاء المستند، على سبيل المثال: الكلمات الرئيسية - تحتوي على قائمة مفصولة بفواصل من الكلمات الرئيسية المطابقة لمحتوى الصفحة، على سبيل المثال: pragma - تمنع المتصفح من تخزين الصفحة مؤقتًا، على سبيل المثال: انتهاء الصلاحية - يمكن استخدامها للإشارة إلى متى يجب أن تنتهي صلاحية الصفحة (وإزالتها من ذاكرة التخزين المؤقت)، على سبيل المثال: الروبوتات - يشير إلى ما إذا كان يجب على محركات البحث تضمين هذه الصفحة في نتائج البحث. على سبيل المثال، تحدد القيمة nofollow أنه يمكن لمحركات البحث تضمين هذه الصفحة في نتائج البحث، ولكن لا ينبغي لها إظهار الصفحات المرتبطة بها: إطار العرض - يسمح للمطورين بالتحكم في حجم إطار العرض الأصلي على أجهزة مختلفة: width=device-width- يطلب من المتصفح ضبط عرض إطار العرض بما يعادل عرض شاشة الجهاز، مهما كان؛ المقياس الأولي = 1.0- يضبط مستوى التكبير/التصغير الأولي عندما يقوم المتصفح بتحميل الصفحة لأول مرة.

عنصر

يخبر أحد العناصر الموجودة في مستند HTML المتصفح بمكان وجود ملف CSS الخارجي المستخدم لتنسيق الصفحة.
يجب أن يستخدم العنصر السمات الثلاث التالية:

• href - يحدد المسار إلى ملف CSS، والذي غالبًا ما يكون موجودًا في مجلد باسم المغلقأو الأنماط;
• النوع - يحدد نوع المستند الذي يشير إليه الارتباط. يجب تحديد قيمة النص/المغلق;
• rel - يحدد العلاقة بين صفحة HTML والملف المرتبط بها. عند الارتباط بملف CSS، يجب تحديد قيمة ورقة الأنماط.

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

يمكنك تضمين قواعد CSS في صفحة HTML عن طريق وضعها داخل العنصر، والذي يوجد عادةً داخل العنصر.

عنصر

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

مثال HTML: جربه بنفسك عنصر البرنامج النصي الخارجي لجافا سكريبت

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

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

تخدم علامات العناوين غرضين مهمين:

• الإبلاغ عن معلومات حول صفحة html إلى المتصفح؛
• توفير معلومات لمحركات البحث حول صفحة html محددة؛

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

يمكن تقسيم هذه العلامات إلى 4 مجموعات.

• بطاقة شعار
• العلامات
• العلامات
• بطاقة شعار

دعونا ننظر إلى كل مجموعة على حدة.

1. العلامة

- عنوان الصفحة. هذه هي علامة الرأس الوحيدة المرئية للمستخدمين. له أهمية كبيرة لمحركات البحث من حيث تحسين محركات البحث (SEO). يتم عرض عنوان الصفحة هذا في نتائج البحث عند تحديد عناوين الصفحات.

...عنوان الصفحة...

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

2. العلامات

- هذه مجموعة من علامات الخدمة التي تحتوي على معلومات حول الصفحة. دعونا نفكر في كل واحد منهم على حدة.

2.1. نوع محتوى التعريف

بناء جملة هذه السمة كما يلي:

... ...

تحدد هذه العلامة ترميز الصفحة. تتم كتابة القيمة المحددة من خلال سمة مجموعة الأحرف. في هذه الحالة، يكون الترميز هو windows-1251. في أغلب الأحيان، تستخدم مواقع الويب ترميز UTF-8.

في حالة عدم تطابق ترميز الموقع مع صفحة html محددة (أو في قاعدة البيانات)، فقد يتم عرض الموقع من خلال الحروف الهيروغليفية في بعض المتصفحات.

2.2. ميتا الوصف... ...

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

2.3. كلمات دلالية... ...

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

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

2.4. تحديث ميتا ... ...

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

2.5. إطار العرض التعريفي ... ... 3.3. الرابط rel=Alternate ... ... 4. علامة ‹script›

- ربط ملفات جافا مع البرامج النصية.

... ...

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

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

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

لقد كتبت في المقالات السابقة في هذا القسم عن إنشاء ملف فارغ بتنسيق html. في الواقع، تم استخدامه في المقالة حول (حيث تم تطبيق علامات العنوان). الآن سنقوم بتحرير هذا الملف مباشرة مع الأوصاف الكاملة.

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

الآن دعونا نلقي نظرة على معنى كل علامة على حدة. ليس من قبيل الصدفة وجودها في كل مستند HTML.

وظائف العلامة إذن، العلامة عبارة عن حاوية (). فهو يحتوي على كل المحتوى المرئي وغير المرئي لصفحة الويب (بما في ذلك العلامات و). تأتي علامة الافتتاح مباشرة بعد إعلان Doctype، وتأتي علامة الإغلاق في نهاية المستند. وبالتالي يوضح للمتصفح أين يبدأ معالجة المستند وأين ينتهي.

من الناحية النظرية، هو نفسه يستطيع أن يفهم ماذا وكيف. بعد كل ذلك ؟ هذا مترجم HTML ومن غير المرجح أن يبدأ المعالجة من منتصف المستند وينتهي منه قبل الوصول إلى النهاية. السؤال بالطبع مثير للجدل، لكنني كنت أعتقد دائمًا (والآن لا أتخلى عن رأيي) أن كتابة هذا الوسم إلزامي.

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

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

إليك ما ستراه عندما تقوم بالتمرير فوق مستند يحتوي على هذا المحتوى:

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

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

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

النص الموجود بعد الرمز هو محتوى العلامة. الآن دعونا نلقي نظرة على المحتوى، الذي لا يمكننا رؤيته، ولكنه جزء مهم جدًا من إنشاء الموقع والترويج له. بادئ ذي بدء، هذا هو الخط

هذه علامة تعريفية مسؤولة عن نوع محتوى الصفحة (نوع المحتوى). في هذه الحالة، هذا هو كود html بتشفير UTF-8 (content="text/html; charset=UTF-8"). بعد ذلك تأتي علامة العنوان الموضحة أعلاه. ثم هناك أسطر تبدأ بالعلامة. يشير إلى وجود رابط لمستند خارجي. على سبيل المثال، الخط

يشير إلى أن ملف (rel = "stylesheet") مع (type = "text/css") متصل، والموجود في عنوان كذا وكذا (لتقليل طول السطر، قمت باستبدال نصف العنوان بالنقاط) . بعد أن يقوم المتصفح بمعالجة هذه السلسلة، سيحدد مكان الحصول على أوراق الأنماط المتتالية.

بشكل عام، تحتوي علامة الرأس على الكثير من المعلومات التي يمكنك التحدث عنها إلى ما لا نهاية. آخر شيء جدير بالملاحظة (على وجه التحديد في حالة ) هو وجود علامات الوصف والكلمات الرئيسية والأساسية. أستخدم المكون الإضافي All in One SEO Pack، وهذا هو سبب وجوده بداخله.

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

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

يتم عرض جميع محتويات منطقة الرأس على الموقع، باستخدام ملف خدمة wordpress header.php، والذي يمكنك عرض محتوياته بالانتقال إلى لوحة الإدارة/المظهر/المحرر:

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

هيكل ومحتويات الرأس الصحيح

وفقا لمعايير HTML، يمكن وضع عدد قليل فقط من العلامات في قسم الرأس. هذه العلامات هي: و و و و.

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

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

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

إصدار أكثر تقدمًا من All in One SEO Pack. بالإضافة إلى ذلك، يمكنه إضافة علامة nofollow إلى الروابط.

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

تحسين الكتلة الرئيسية لموقع ويب على WordPress

حسنًا، دعونا نحاول إحضار الكود إلى هذا النموذج؟ بكل تأكيد نعم!

التخلص من التعليمات البرمجية غير الضرورية في الرأس

أول ما عليك فعله هو دمج جميع ملفات الأنماط الخاصة بموضوعك في ملف style.css مشترك واحد. للقيام بذلك، افتح ملفات الأنماط الإضافية واحدًا تلو الآخر، وانسخ الكود منها والصقه في نهاية ملف style.css، بعد هذه الخطوات، يمكنك إزالة الكود الخاص بعرض الأنماط الإضافية من header.php. ونتيجة لذلك، في HTML يجب أن يكون لديك سطر واحد فقط لتوصيل أنماط القالب الخاص بك:

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

ولذلك، سيكون من الأفضل ببساطة إلغاء تنشيط الاتصال في منطقة الرأس لأنماط المكونات الإضافية، من خلال ملف الوظائف jobs.php.

مهم جدا! قبل إجراء أي تغييرات على ملف jobs.php، تأكد من عمل نسخة منه.

نحن نستخدم الخوارزمية التالية:

1). قبل أن تبدأ في تعطيل إضافة المكونات الإضافية إلى الرأس، انسخ كود html الذي تضيفه.

2). قم بإنشاء كتلة إضافية في منطقة الجسم، على سبيل المثال، تسمى الرأس:

وهنا هو رمز البرنامج المساعد

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

3). تحتاج إلى مراجعة ملف PHP الرئيسي للمكون الإضافي الذي تخطط لإزالة خطافاته بعناية. باستخدام اختصار لوحة المفاتيح Ctrl+F، ابحث عن البنية التالية هناك:

Add_action("wp_head", "plugin_function_here");

4). للتخلص بشكل صحيح من هذا الاستدعاء، تحتاج إلى إضافة السطر التالي إلى ملف jobs.php:

Remove_action("wp_head", "plugin_function_here");

5). نحفظ القالب ونتحقق مما حصلنا عليه.
هناك أيضًا حالات فريدة لا يعمل فيها استخدام Remove_action لـ wp_head(). اسمحوا لي أن أقدم لكم مثالاً على WP-PageNavi (الإصدار 2.5.0)، لا يوجد استدعاء دالة صريح في wp_head()، على الرغم من ذلك، يقوم المكون الإضافي بتحميل ملف الأنماط الخاص به. قم بإلقاء نظرة فاحصة على كود wp-pagenavi.php الأصلي، حيث توجد وظيفة "Enqueue PageNavi Stylesheets"، والتي تضيف الأنماط من خلال:

Add_action("wp_print_styles", "pagenavi_stylesheets");

أضف السطر التالي إلى نهاية ملف الوظيفة fuctions.php قبل ?> للتخلص من هذا الاستدعاء:

Add_action("init", "remheadlink"); وظيفة remheadlink () (remove_action("wp_print_styles"، "pagenavi_stylesheets")؛ )

هناك مبدأ معين في التعامل مع المكالمات والخطافات غير الضرورية - فأنت تبحث عن الوظيفة التي تحتاجها وتقوم بتعطيلها.

يمكنك أيضًا التخلص من العناصر الأخرى غير الضرورية التي لا تستخدمها باستخدام hacks for function.php، على سبيل المثال:

Add_action("init", "remheadlink"); وظيفة remheadlink () (remove_action("wp_head"، "feed_links_extra"، 3)؛ // روابط إلى rss إضافية Remove_action("wp_head"، "feed_links"، 2)؛ // روابط إلى RSS الرئيسية والتعليقات Remove_action("wp_head" " ,"rsd_link"); // لخدمة الاكتشاف البسيط حقًا Remove_action("wp_head"، "wlwmanifest_link")؛ // لـ Windows Live Writer Remove_action("wp_head"، "wp_generator")؛ // يزيل إصدار Wordpress)

Add_action("init", "remheadlink"); وظيفة remheadlink () (remove_action("wp_head"، "start_post_rel_link"، 10،0)؛ Remove_action("wp_head"، "index_rel_link")؛ Remove_action("wp_head"، "rel_canonical")؛ Remove_action("wp_head"، "adjacent_posts_rel_link_wp_head" "، 10، 0)؛ Remove_action("wp_head"، "wp_shortlink_wp_head"، 10، 0)؛ )

في أحدث إصدارات WordPress، يظهر نص غريب في كتلة الرأس:

نافذة جافا سكريبت نوع النص. wpemojiSettings baseUrl http: s.w.org الصور الأساسية emoji 72x72 ext png مصدر concatemoji http: medicinahouse.ru wp-includes js wp-emoji-release.min.js؟ الإصدار 4.2.4! وظيفة أ، ب، ج وظيفة د أ فار ج b.createElement Canvas d c.getContext c.getContext 2d return d d.fillText؟ د.textBaseline أعلى

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

Add_action("init", "remheadlink"); وظيفة remheadlink () (remove_action("wp_head"، "print_emoji_detection_script"، 7)؛ Remove_action("admin_print_scripts"، "print_emoji_detection_script")؛ Remove_action("wp_print_styles"، "print_emoji_styles")؛ Remove_action("admin_print_styles"، "print_emoji_styles") ;)

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

وظيفة _remove_script_version($src)( $parts =تفجير("؟", $src); return $parts;) // هذا لإخفاء إصدار البرنامج النصي add_filter("script_loader_src", "_remove_script_version", 15, 1); // هذا مخصص للأنماط add_filter("style_loader_src", "_remove_script_version", 15, 1);

هذا كل شيء بالنسبة لي. شكرًا لكم على اهتمامكم.