Noopener: ما هو وكيف يؤثر على موقع WordPress الخاص بك؟

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

استمر في القراءة لتتعلم كل شيء عن قيمة السمة noopener!

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

• ما هو noopener؟ وما الذي تبدو عليه؟
• ماذا تفعل السمة rel = ”noopener” في الواقع؟
• Noopener مقابل Noreferrer مقابل nofollow
• إيجابيات وسلبيات noopener
• كيفية إضافة ، إزالة ، وإلغاء تنشيط noopener

ما هو noopener؟ وما الذي تبدو عليه؟

Noopener هي قيمة rel="" HTML. تتم إضافته تلقائيًا أو يدويًا إلى أي روابط صادرة تضيفها في WordPress. غالبًا ما تُستخدم لعناصر <area> و <form> في HTML ، يظهر الاستخدام الأكثر شيوعًا لقيمة noopener (خاصة في WordPress) عند تنفيذ عناصر <a> ، ويعرف أيضًا باسم. روابط أو روابط ارتباطات تشعبية.

في حد ذاته ، يسمح لك عنصر الارتباط التشعبي <a href=""> أي شيء تشعبيًا من صفحات الويب إلى عناوين البريد الإلكتروني. هذا كل شيء - لا توجد سمات مضمنة تخبر الارتباط التشعبي بالفتح في علامة تبويب جديدة عند النقر فوقه. ومع ذلك ، يمكن لمستخدمي WordPress تحديد خانة اختيار بحيث يفتح الارتباط التشعبي في علامة تبويب جديدة عند النقر عليه. عند تحديده ، يقوم WordPress بإدراج target=" _blank" في الكود ، مما يطالب المتصفح بفتح الرابط في علامة تبويب جديدة. على سبيل المكافأة ، تنتهي قيمة rel="noopener" أيضًا في الكود للحماية من التهديدات الأمنية.

في بعض الأحيان ، يتم إقران القيمة بـ "noreferrer". سنناقش كيفية عملهم معًا وكيف يختلفون لاحقًا في هذه المقالة.

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

كما ترى من محرر النصوص ، يتم إنشاء عنصر <a href=""> قياسي للارتباط التشعبي بدون rel="noopener" .

يؤدي تحديد خانة الاختيار والنقر فوق الزر Enter لارتباط تشعبي إلى تغيير ذلك بالكامل.

بالتبديل إلى محرر النصوص مرة أخرى ، نرى الآن rel="noopener" قرب نهاية عنصر <a href=> . ستلاحظ أيضًا أن WordPress يضيف سمة target="" (بقيمة _blank ) ، وهي رمز HTML الذي يفرض في الواقع فتح الرابط في علامة تبويب جديدة.

تبدو قيم noopener في WordPress مختلفة قليلاً لمستخدمي محرر Gutenberg المرئي ؛ بدلاً من ذلك ، يعرض كل عنوان URL جديد مفتاح التبديل إلى "فتح في علامة تبويب جديدة".

ينتج عن ترك مفتاح التبديل " إيقاف التشغيل" عنصر <a href=""> أساسي حيث يفتح الارتباط التشعبي في علامة التبويب نفسها (ولا نرى أي rel="noopener" ).

لكن تشغيل المفتاح " On " ينشط الإدراج الآلي للقيمة من WordPress.

تُظهر نظرة سريعة على الرمز هذا الرابط rel="noopener" ، ويتم إقرانه بقيمة noreferrer .

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

ماذا تفعل السمة rel = ”noopener” في الواقع؟

الآن بعد أن عرفنا ما هي rel="noopener" ، وكيف تبدو ، سنشرح ما تفعله بالنسبة إلى الروابط الخاصة بك ، وموقع الويب الخاص بك ، والتفاعل بين موقعك والمواقع التي ترتبط بها.

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

عندما أصبح هذا التهديد بارزًا ، تصرف WordPress بسرعة من خلال تضمين rel="noopener" كلما أنشأ المستخدمون روابط تفتح في علامات تبويب جديدة.

لماذا ا؟ لأن rel="noopener" تمنع الموقع المرتبط من الوصول إلى ميزة window.opener JavaScript ، مما يؤدي إلى إزالة التهديد. يتضمن Gutenberg أيضًا قيمة noreferrer ، التي تمنع المواقع المرتبطة (التي يُحتمل أن تكون ضارة) من رؤية أن موقعك مرتبط بها تمامًا. لذلك ، فإنه يزيل الثغرة الأمنية التي تحدث عند فتح الروابط في علامات تبويب جديدة ، ويخفي noreferrer معلومات موقعك عند فتح الروابط في علامات تبويب جديدة.

قد تكون أيضا مهتما ب:

• هل سرعة موقع WordPress مهمة حقًا لتحسين محركات البحث؟
• كيفية تحسين الصور لموقع الويب الخاص بك وجعلها تعمل على جميع الأجهزة (الصور المستجيبة للجوال وسطح المكتب والجهاز اللوحي)
• ما المقصود بقصد البحث؟ كيفية تحديد النية لتحسين محركات البحث

Noopener مقابل Noreferrer مقابل nofollow

تعد كل من Noopener و noreferrer و nofollow قيمًا محتملة لإدراجها في rel="" ، وغالبًا عند إنشاء ارتباطات تشعبية.

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

إليك كيفية التمييز بينهما:

noopener

• قيمة HTML يمكنك وضعها في rel="" .
• يغلق فجوة أمان JavaScript window.opener ، مما يحمي المواقع التي قد ترتبط عن غير قصد بعناوين URL الضارة.
• يضيف WordPress تلقائيًا rel="noopener" عندما ينشئ مالك الموقع رابطًا لفتحه في علامة تبويب جديدة (مع القيمة target="_blank" ).
• سترى غالبًا القيمة جنبًا إلى جنب مع قيمة noeferrer داخل rel="" . إنهم يكملون وظائف مختلفة لكنهم يعملون من أجل نفس النوع من الأمان.
• القيمة تساعد في الأمن. على عكس الشائعات ، فإنه لا يؤثر على مُحسنات محركات البحث بأي شكل من الأشكال.

نوريفيرر

• قيمة HTML يمكنك وضعها في rel="" .
• توقف المتصفح عن إرسال عنوان صفحة الويب المشار إليها إلى موقع الويب المرتبط. هذا يعني أن المواقع الضارة بها حاجز آخر عند محاولة الوصول إلى موقعك.
• في Gutenberg ، يضيف WordPress تلقائيًا قيمة noreferrer عند إدراج رابط لفتحه في علامة تبويب جديدة. يجب عليك إضافة أو إحالة يدويًا إذا كنت تستخدم المحرر التقليدي.
• غالبًا ما يتم إدراج قيمة noreferrer مباشرةً قبل قيمة noopener داخل rel="" ، مثل هذا: rel="noreferrer noopener" .
• تساعد قيمة noreferrer في توفير الأمان أيضًا عن طريق إخفاء عنوان URL المُحيل الخاص بك من المواقع الأخرى. لا تؤثر القيمة على مُحسّنات محرّكات البحث ، ولكنها قد تزيد من أعداد الزيارات المبلغ عنها لحركة المرور المباشرة إذا تم النظر إلى الموقع عبر برنامج التحليلات.
• يعتقد العديد من المسوقين بالعمولة أن القيم غير المرجعية تضر بنتائج تحسين محركات البحث لأن محركات البحث تريد رؤية إخلاء المسؤولية حول الروابط التابعة (حتى لا تخفي أنك توصي بشيء لمجرد أنك تحصل على أموال). ومع ذلك ، لا يوجد دليل على أن نورايرفير يؤثر على مُحسنات محركات البحث للروابط التابعة.
• ومع ذلك ، فإن ما يؤثر عليه فيما يتعلق بالروابط التابعة هو أنه بناءً على شريكك التابع ، قد لا يتمكنون من إسناد الزوار الذين أشرت إليهم إلى حسابك. المعلمة noreferrer تمنعهم من القيام بذلك. لذلك ، إذا كنت تريد أن تكون على يقين من أنه يتم تعقب الروابط التابعة الخاصة بك بشكل صحيح ، فلا يجب أن يكون لديك أي إشارة إليها.

لا اتباع

• قيمة HTML يمكنك وضعها في rel="" .
• يخبر محركات البحث بعدم إرسال "عصير الارتباط" إلى موقع الويب الذي ترتبط به. يمكن لعصير الارتباط عالي الجودة تحسين تصنيفات محرك البحث لموقع الويب الذي ترتبط به. ذلك لأن محركات البحث ترى قيمة في الكثير من المواقع المرتبطة بمحتوى معين. يرفض مشرفو المواقع إرسال عصير الارتباط إلى مواقع / صفحات معينة لأسباب مختلفة.
• يتم فرضه بشكل شائع عند وضع الروابط في التعليقات والمنتديات ، نظرًا لأنك لا تريد مجموعة من الروابط الضارة في قسم التعليقات.
• تستخدم بعض المواقع قيمة nofollow مع الروابط الداخلية ، حتى لا تخبر محركات البحث أنها تنشئ عددًا كبيرًا جدًا من الروابط الداخلية. ومع ذلك ، لا يوجد دليل على أن هذا مهم.
• تتأثر مُحسّنات محرّكات البحث بـ nofollow ، ولكن فقط عند استخدام الروابط التابعة أو إعادة التوجيه إلى محتوى برعاية ، أو أي شيء تدفعه مقابل الترويج. في الأساس ، لا تريد محركات البحث إعطاء عصير الارتباط للمواقع لمجرد أنها تدفع مقابل حركة المرور. لذلك ، من الجيد استخدام سمات rel="nofollow" عند الارتباط بصفحات تابعة.

إيجابيات وسلبيات noopener

كثير من الناس يخلطون بين noopener و nofollow ، وهذا هو سبب اعتقادهم أن rel="noopener" ضرورية إذا كنت ترغب في تحسين مُحسّنات محرّكات البحث أو استخدام الروابط التابعة. لكنها لا يمكن أن تساعد في أي من هؤلاء. ومع ذلك ، لديها العديد من الفوائد الأخرى.

الايجابيات

• تمنع قيمة noopener المواقع الضارة من الوصول إلى كائن JavaScript window.opener . يوفر window.opener وصولاً جزئيًا إلى الموقع المرتبط عند فتحه في علامة تبويب جديدة ، لذا فهو يساعد في القضاء على هذا التهديد.
• إنه يحسن الأمان مع السماح لك بفتح روابط في علامات تبويب جديدة ، والتي يشعر الكثير من الناس أنها تجعل تجربة المستخدم أكثر متعة.
• يقوم WordPress تلقائيًا بإدراج السمة عند إنشاء رابط يفتح في علامة تبويب جديدة. يقوم بذلك إذا كنت تستخدم محرر Gutenberg أو محرر WordPress التقليدي ، مما يؤدي بشكل أساسي إلى إزالة أي عمل يدوي من جانبك.
• يمكنك دائمًا إدراج السمة في الرمز إذا كنت تريد ذلك.
• لا يؤثر على مُحسّنات محرّكات البحث أو ارتباط الشركات التابعة أو الأداء على موقع الويب الخاص بك.

سلبيات

• إنه أمر محير عند محاولة التمييز بين noopener و noreferrer و nofollow. حتى أن بعض المستخدمين يبدأون في إضافة قيم noopener إلى جميع الروابط ، على أمل تحسين مُحسّنات محرّكات البحث. لكن هذا مجرد مضيعة للوقت.
• هناك طريقة بسيطة لتجنب ثغرة أمان window.opener تمامًا ، وذلك ببساطة عن طريق فتح الروابط الخاصة بك في علامة التبويب نفسها. لذا ، فإن القيمة ليست ضرورية لأن التهديد يمكن تجنبه في المقام الأول.
• من الناحية الفنية ، فإن noreferrer تقيد بالفعل الوصول إلى window.opener ، لذلك يجادل الكثير من الناس بأن noopener زائدة عن الحاجة.

كيفية إضافة وإزالة وإلغاء تنشيط noopener في WordPress

يمكنك استخدام مفتاح "فتح في علامة تبويب جديدة" لإضافة أو إزالة قيمة noopener من ارتباط تشعبي فردي في WordPress.

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

للوصول إلى Code Editor في Gutenberg ، انقر فوق زر الخيارات (ثلاث نقاط رأسية) ، ثم زر Code Editor .

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

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

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

لإضافة noopener ، حدد المربع " فتح الارتباط في علامة تبويب جديدة ". لإزالة noopener من الارتباط السابق ، قم ببساطة بإلغاء تحديد هذا المربع.

يوفر محرر WordPress الكلاسيكي علامة تبويب نص لتعديل الصفحة / الرمز البريدي. هذه طريقة أخرى لإضافة أو إزالة قيم noopener للروابط. انقر فوق علامة التبويب نص وحدد الرابط الذي تريد تحريره. إما أن تضيف rel="noopener" قبل قوس الإغلاق لـ <a href=""> ، أو احذف نص noopener لإزالته من الرابط.

قم بإزالة وظيفة noopener من موقع WordPress بالكامل

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

ومع ذلك ، إذا كان لديك سبب وجيه لإلغاء تنشيط noopener على موقعك بالكامل ، فابحث عن ملف function.php الخاص بالسمة والصقه في الكود التالي:

add_filter( 'tiny_mce_before_init' , 'wpb_disable_noopener' ); function wpb_disable_noopener ( $mceInit ) { $mceInit[ 'allow_unsafe_link_target' ]= true ; return $mceInit; }
 لغة الكود: PHP ( php )

هذا يمنع WordPress من إضافة rel="noopener" متى اخترت فتح رابط في علامة تبويب جديدة.

ملخص

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

لقد أبرزنا أيضًا الفرق بين noopener و noreferrer و nofollow ، لا سيما كيف أن nofollow هي قيمة rel="" الوحيدة التي لها أي علاقة بـ SEO أو التسويق بالعمولة. أخيرًا ، شرحنا كيفية استخدام وإضافة وإزالة قيم noopener من موقع WordPress الخاص بك.

إذا كانت لديك أي أسئلة أو أفكار حول استخدام rel="noopener" في WordPress ، فاترك لنا ملاحظة في قسم التعليقات أدناه!