كيف تجعل موقعك مصدرًا مفضّلًا في Google؟ شرح الميزة وطريقة إضافة الزر إلى Blogger

دليل عملي لإضافة ميزة Google Preferred Sources إلى موقعك، باستخدام الزر الرسمي أو تصميم مخصص مع JavaScript، بالإضافة إلى الرابط المباشر والبادجات العربية.

المصادر المفضلة في Google وطريقة إضافة زر Preferred Sources إلى Blogger — ميزة المصادر المفضّلة في Google وطريقة إضافتها إلى موقعك

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

ما هي المصادر المفضّلة في Google؟

Google Preferred Sources أو المصادر المفضّلة هي ميزة تسمح لمستخدم Google باختيار موقع إلكتروني معين كمصدر يفضله للحصول على المحتوى والأخبار.

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

كما يمكن أن يظهر المحتوى مع شارة مفضّل في وضع AI والنبذات باستخدام الذكاء الاصطناعي عندما تكون هذه الميزات متاحة للمستخدم.

كيف تعمل ميزة Preferred Sources؟

الفكرة بسيطة جدًا:

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

💡 ملاحظة مهمة:

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

هل كل المواقع مؤهلة لاستخدام المصادر المفضّلة؟

لا. هناك شرط مهم يجب الانتباه إليه قبل إضافة الزر.

توضح Google أن المواقع المؤهلة تكون على مستوى النطاق Domain أو النطاق الفرعي Subdomain.

على سبيل المثال:

https://www.example.com/ ✅ مؤهل
https://news.example.com/ ✅ مؤهل
https://www.example.com/blog ❌ ليس نطاقًا مستقلًا للمصادر المفضلة

⚠️ لذلك:

إذا ظهر لك في أداة Google أن موقعك غير مؤهل حاليًا كمصدر مفضّل، فهذا لا يعني بالضرورة أن الكود خاطئ. يجب أولًا التأكد من أن النطاق مؤهل وأن Google تتيح الميزة لهذا الموقع.

ما هي طرق إضافة المصادر المفضّلة إلى موقعك؟

توفر Google ثلاث طرق رئيسية:

JavaScript العادي: وهو التنفيذ الرسمي الموصى به من Google.
JavaScript المتقدم: يسمح لك باستخدام تصميمك وأزرارك الخاصة.
الرابط المباشر Deeplink: مفيد إذا لم تتمكن من استخدام JavaScript.

وفيما يلي سنشرح الطرق الثلاث، مع إعطاء كل طريقة كودًا جاهزًا للنسخ.

الكود الرسمي من Google — الخيار الموصى به

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

📌 الكود الرسمي

<script async src="https://news.google.com/swg/js/v1/publisher.js"></script>

<div google-add-preferred-source-btn></div>

هذا هو الكود الرسمي الذي توفره Google، ويتكون من جزأين:

ملف JavaScript الخاص بميزة المصادر المفضّلة.
عنصر div الذي يخبر Google بمكان عرض الزر.

🌙 تغيير مظهر الزر إلى الوضع الداكن

إذا كان تصميم موقعك داكنًا، يمكنك استخدام السمة data-theme="dark".

<script async src="https://news.google.com/swg/js/v1/publisher.js"></script>

<div google-add-preferred-source-btn data-theme="dark"></div>

كيف أجعل الزر باللغة العربية؟

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

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

<script async src="https://news.google.com/swg/js/v1/publisher.js"></script>

<div google-add-preferred-source-btn data-lang="ar"></div>

✅ متى تستخدم هذا الخيار؟

استخدمه إذا كنت تريد الزر الرسمي من Google كما هو، بدون تصميم خاص أو صورة مخصصة.

الكود المتقدم — إنشاء زر وتصميم مخصص

إذا كنت لا تريد استخدام الزر القياسي الذي تعرضه Google، فيمكنك استخدام JavaScript المتقدم وربط عملية إضافة الموقع كمصدر مفضّل بزر أو صورة أو بطاقة من تصميمك.

وهذا هو الأسلوب الذي استخدمناه لإنشاء زر مخصص لـ Dora Tech.

🔧 ما الذي يمكنك تخصيصه؟

الصورة أو البادج.
حجم الزر.
مكان ظهوره.
النص البديل للصورة.
اللغة.
الألوان والتصميم بالكامل.

📌 الكود المخصص الجاهز

ملاحظة: إذا كنت تريد استخدامه لموقع آخر، فهناك مكان واحد أساسي يجب تغييره: رابط موقعك داخل href وداخل إعدادات الرابط.

<!-- Google Preferred Source Script -->
<script async preferred-sources-control="manual"
  src="https://news.google.com/swg/js/v1/publisher.js"></script>

<script>
(self.PREFERRED_SOURCE = self.PREFERRED_SOURCE || []).push(function(preferredSource) {

  preferredSource.init({
    theme: 'light',
    lang: 'ar'
  });

  document.addEventListener('click', function(e) {
    var target = e.target;

    if (target && target.closest) {

      var button = target.closest('#dora-preferred-source');

      if (button) {
        e.preventDefault();
        preferredSource.addPreferredSource();
      }

    }
  });

});
</script>


<!-- =====================================================
     CUSTOM GOOGLE PREFERRED SOURCE BUTTON
     ===================================================== -->

<div id="dora-preferred-source"
     style="max-width:100%;margin:20px auto;text-align:center;cursor:pointer;">

  <a
    href="https://www.google.com/preferences/source?q=https%3A%2F%2Fwww.bbkiwi2011.com"
    target="_blank"
    rel="noopener"
    aria-label="أضف درة تك كمصدر مفضل في Google"
    style="display:inline-block;">

    <img
      src="ضع هنا رابط صورة البادج الخاصة بك"
      width="200"
      height="60"
      alt="أضف درة تك كمصدر مفضل في Google"
      loading="lazy"
      style="display:block;height:auto;max-width:100%;border:0;">

  </a>

</div>

🛠️ أين تعدّل الكود المخصص؟

المكان	ما الذي تعدله؟
`bbkiwi2011.com`	استبدله بنطاق موقعك.
`ضع هنا رابط صورة البادج الخاصة بك`	ضع هنا رابط صورة الزر أو البادج الذي صممته.
`أضف درة تك كمصدر مفضل في Google`	يمكنك تغييره إلى اسم موقعك.
`lang: 'ar'`	اتركه `ar` إذا أردت استخدام العربية.

⚠️ تنبيه مهم حول الكود المخصص

لا تحتاج إلى تعديل رابط مكتبة Google: https://news.google.com/swg/js/v1/publisher.js. هذا رابط مكتبة Google الرسمية ويجب تركه كما هو.

الرابط المباشر بدون JavaScript

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

بالنسبة إلى موقع Dora Tech، يكون الرابط:

https://www.google.com/preferences/source?q=https%3A%2F%2Fwww.bbkiwi2011.com

رابط نصي جاهز

<a
  href="https://www.google.com/preferences/source?q=https%3A%2F%2Fwww.bbkiwi2011.com"
  target="_blank"
  rel="noopener noreferrer">
  أضف Dora Tech إلى المصادر المفضّلة في Google
</a>

ويمكنك كذلك وضع الرابط خلف صورة أو بادج خاص بك.

تحميل شارات Google الرسمية

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

🏷️

تحميل شارات Google الرسمية

حزمة رسمية من Google تحتوي على أصول شارات المصادر المفضّلة بجميع اللغات المتاحة.

``` ⬇️ تحميل الشارات الرسمية ```

ملف Google الرسمي — جميع اللغات

شارات عربية بتصميم جاهز

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

🇸🇦

تحميل التصميمات العربية الجاهزة

ملف مضغوط يحتوي على مجموعة من التصميمات العربية الجاهزة.

``` ⬇️ تحميل التصميمات العربية ```

📌 ملاحظة:

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

أين أضع الأكواد في Blogger؟

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

الخيار الأول: الزر الرسمي

افتح المقال في Blogger.
انتقل إلى وضع HTML.
ضع كود JavaScript في المكان المناسب، ويفضل في القالب إذا كنت تريد استخدامه في عدة صفحات.
ضع عنصر الزر: <div google-add-preferred-source-btn></div> في المكان الذي تريد ظهور الزر فيه.

الخيار الثاني: الزر المخصص

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

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

الخيار الثالث: الرابط المباشر

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

أين يفضل وضع زر المصادر المفضّلة؟

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

ومن الأماكن المناسبة:

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

💡 اقتراح عملي لـ Dora Tech:

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

هل المصادر المفضّلة تحسن ترتيب الموقع في Google؟

يجب التفريق بين أمرين.

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

لكن لا ينبغي التعامل مع الميزة باعتبارها عاملًا مباشرًا يرفع ترتيب موقعك في نتائج Google لجميع المستخدمين.

الخلاصة:

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

ماذا أفعل إذا ظهر موقعي على أنه غير مؤهل؟

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

الكود مسؤول عن تشغيل واجهة Google أو توجيه المستخدم إليها، لكنه لا يجعل الموقع مؤهلًا بحد ذاته.

تحقق أولًا من:

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

أي طريقة تختار؟

الطريقة	سهولة الاستخدام	التخصيص	مناسبة لمن؟
JavaScript الرسمي	⭐⭐⭐⭐⭐	محدود	أغلب المواقع
JavaScript المتقدم	⭐⭐⭐	⭐⭐⭐⭐⭐	المواقع التي تريد تصميمًا خاصًا
الرابط المباشر	⭐⭐⭐⭐⭐	⭐⭐⭐⭐	المواقع التي لا تستطيع استخدام JavaScript

الأسئلة الشائعة حول Google Preferred Sources

هل يجب أن أستخدم الكود الرسمي؟

لا. يمكنك استخدام التنفيذ الرسمي الموصى به، أو التنفيذ المتقدم إذا كنت تريد تصميمًا مخصصًا، أو الرابط المباشر إذا لم تتمكن من استخدام JavaScript.

هل يمكنني استخدام صورة خاصة بي بدل زر Google؟

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

هل يمكن استخدام الميزة في Blogger؟

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

هل الزر يجعل موقعي يتصدر نتائج Google؟

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

هل يمكنني استخدام الرابط المباشر مع صورة؟

نعم. يمكن وضع رابط Google خلف أي صورة أو بادج ترويجي خاص بك.

لماذا يظهر موقعي غير مؤهل؟

قد يكون السبب مرتبطًا بأهلية الموقع للميزة وليس بالكود نفسه. Google توضح أن المواقع على مستوى النطاق أو النطاق الفرعي هي المؤهلة، بينما الأدلة الفرعية ليست مؤهلة ككيانات مستقلة للمصادر المفضلة.

⭐ اجعل موقعك ضمن المصادر التي يفضلها قراؤك

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

⭐ أضف Dora Tech كمصدر مفضّل

الخلاصة

ميزة Google Preferred Sources من الميزات المفيدة للناشرين الذين يريدون منح قرائهم طريقة مباشرة لاختيار موقعهم كمصدر مفضّل داخل Google.

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

والأهم هو عدم الخلط بين الميزة وبين تحسين ترتيب الموقع بشكل مباشر؛ فالقيمة الأساسية هنا هي السماح للمستخدم بإخبار Google بأنه يفضّل محتوى موقعك كمصدر.

📚 المصدر الرسمي

للاطلاع على طريقة تنفيذ ميزة المصادر المفضّلة وجميع الخيارات الرسمية التي توفرها Google، يمكنك الرجوع إلى توثيق Google Search Central:

🔗 توثيق Google الرسمي — المصادر المفضّلة