المنشورات المضمّنة

تمثل المنشورات المضمنة طريقة بسيطة لتضمين منشورات عامة - بواسطة صفحة أو شخص على فيسبوك - بمحتوى موقعك أو صفحتك على الويب. ولا تتم عملية التضمين إلا للمنشورات العامة من صفحات فيسبوك أو الصفحات الشخصية.

أداة إنشاء الرموز

عنوان URL للمنشور
عرض بيكسل المنشور (ما بين 350 و750)

الإعدادات

الإعداد الوصف القيمة الافتراضية

data-href

عنوان URL المطلق للمنشور.

n/a

data-width

عرض المنشور. الحد الأدنى 350 بيسكل، الحد الأقصى 750 بيكسل. اتركه فارغًا لاستخدام العرض المرن.

العرض المرن

data-show-text

ينطبق على منشور الصور. قم بالتعيين على true لتضمين النص من منشور فيسبوك، إن وجد.

false

الحصول على الرمز من منشور

1. الانتقال إلى منشورك

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

اختر Embed Post من القائمة المنسدلة:

بالنسبة لمنشورات الصور، حدد الزر Embed Post من أسفل اليسار:

2. نسخ الرمز ولصقه

سيظهر مربع حوار به رمز تضمين المنشور. انسخ هذا الرمز والصقه في صفحة الويب في المكان الذي تريد ظهور الفيديو به.

للتعرف على التفاصيل الفنية، يرجى الرجوع إلى قسم إضافة الرمز يدويًا

إضافة الرمز يدويًا

بالإضافة إلى أداة إنشاء الرموز، يمكنك أيضًا تضمين الرمز يدويًا.

1. الحصول على عنوان URL للمنشور

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

يمكنك استخدام نموذج عنوان URL هذا لأغراض الاختبار:

"https://www.facebook.com/20531316728/posts/10154009990506729/"

2. تحميل JavaScript SDK

لاستخدام المكون الإضافي للمنشورات المضمنة، أو أي مكون إضافي للتواصل الاجتماعي، يتطلب الأمر إضافة Facebook JavaScript SDK إلى موقعك على الويب. يجب تحميل مجموعة SDK مرة واحدة فقط بالصفحة، والأفضل أن يكون ذلك بعد علامة <body> الافتتاحية:

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&amp;version=v2.5";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

يمكنك العثور على مزيد من المساعدة لتنفيذ JavaScript SDK في JavaScript SDK - البدء السريع.

3. وضع علامة المنشور المضمن

بعد ذلك، ضع علامة المنشور المضمن في أي مكان بموقعك على الويب، وضع عنوان URL لمنشورك مكان {your-post-url} .

<div class="fb-post" data-href="{your-post-url}"></div>

4. الاختبار

بعد إكمال هذه الخطوات، ستتمكن من اختبار المنشور المضمن. سيبدو التكامل عند اكتماله على نحو مشابه لهذا:

<html>
  <title>My Website</title>
<body>
  <script src="//connect.facebook.net/en_US/sdk.js#xfbml=1&amp;version=v2.5" 
      async></script>  
  <div class="fb-post" 
      data-href="https://www.facebook.com/20531316728/posts/10154009990506729/"
      data-width="500"></div>
</body>
</html>

تظهر نتيجة نموذج الاختبار في لقطة الشاشة أدناه.

5. التخصيص

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

الحصول على عنوان URL للمنشور

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

  1. نسخ عنوان URL للرابط الثابت من شريط عنوان المتصفح.
  2. النقر بزر الماوس الأيمن على وقت نشر المنشور ونسخ عنوان الرابط.

ولقد تم تمييز الطريقتين باللون الأحمر في لقطة الشاشة التالية.

عبر Graph API

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

ستقوم الاستجابة لطلبك الخاص بـ /{page-id}/feed?fields=permalink_url بإرسال رسالة بالتنسيق التالي:

{
  "data": [
    {
      "id": "1234567890_3456789012", 
      "permalink_url": "https://www.facebook.com/1234567890/posts/3456789012"
    }
  ]
}

التنسيق على أجهزة الكمبيوتر

يمكنك ضبط عرض المنشورات المضمنة على أجهزة الكمبيوتر عبر سمة data-width في علامة تضمين المنشور على النحو الوارد بالمثال التالي. اختر قيمة تتراوح بين 350 و750 بيكسل.

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

<!-- WRONG! -->
<style type="text/css">
.fb-post {
  width: 500px;
}
</style>
<div 
  class="fb-post"
  data-href="{your-post-url}">
</div>

<!-- CORRECT -->
<div 
  class="fb-post" 
  data-width="500"
  data-href="{your-post-url}">
</div>

التنسيق على ويب الهاتف المحمول

على ويب الهاتف المحمول، يتم تلقائيًا ضبط حجم المنشورات المضمنة لتناسب عرض الحاوية.

Wordpress

إذا كنت تستخدم Facebook SDK للغة JavaScript مع موقع تم إنشاؤه من خلال Wordpress، يمكنك استخدام المكون الإضافي للمنشورات المضمنة من خلال إضافة علامة fb-post إلى منشورك:

<div class="fb-post" data-href="https://www.facebook.com/20531316728/posts/10154009990506729/" data-width="500"></div>

في حالة عدم استخدام مجموعة Facebook SDK للغة JavaScript وكنت تقوم بتضمين المنشور عبر نسخ جزء من الرمز البرمجي ولصقه، والذي يمكنك الحصول عليه من أي منشور فيسبوك، فلن يتم على الأرجح عرض المكون الإضافي للمنشورات المضمنة حيث يقوم Wordpress بتحويل كل علامات & إلى #038; وبالتالي سيتعطل المكون الإضافي.

بدلاً من ذلك، استخدم الرمز التالي لإضافة المكون الإضافي:

<script>
  window.fbAsyncInit = function() {
    FB.init({
      xfbml      : true,
      version    : 'v2.10'
    });
  }; 
  (function(d, s, id){
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) {return;}
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));
</script>
  
<div 
  class="fb-post" 
  data-href="https://www.facebook.com/20531316728/posts/10154009990506729/" 
  data-width="500"></div>

يتم قريبًا إطلاق ميزة تكامل جديدة وسهلة مع Wordpress.

الأسئلة المتكررة

إذا كنت تستخدم الإصدارات HTML5 أو XFBML، يجب عليك تضمين رمز اللغة عند بدء إنشاء مثيل المكتبة.

عند تحميل SDK قم بتعيين القيمة js.src على استخدام لغتك المحلية، فقط استبدل en_US برمز لغتك المحلية، مثل fr_FR للغة الفرنسية (فرنسا):

// Example 1:
'//connect.facebook.net/fr_FR/sdk.js';

// Example 2:
js.src = "//connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v2.6"; 

اللغات المدعومة موضحة في [ملف لغات فيسبوك بتنسيق XML] (http://www.facebook.com/translations/FacebookLocales.xml). وقد يتطلب الأمر ضبط عرض المكون الإضافي للتواصل الاجتماعي حتى يتوافق مع اللغات المختلفة. يمكنك العثور على المزيد من المعلومات على صفحة التطويع المحلي والترجمة.

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