المكون الإضافي للمجموعة

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

المكون الإضافي للمجموعة الخاص بالويب

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

قبل البدء

لتضمين المكون الإضافي للمجموعة في صفحة ويب، ستحتاج إلى ما يلي:

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

التقييدات

لا يمكن استخدام المكون الإضافي للمجموعة الخاص بالويب إلا في صفحة ويب

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

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

الخطوة الأولى. استبدل عنوان URL بعنوان URL مجموعة فيسبوك.

الخطوة الثانية. قم بتحديث عرض البيكسل لزر زيارة المجموعة.

الخطوة الثالثة. أضف بيانات التعريف إذا أردت تضمين المعلومات الإضافية في رمز الزر.

الخطوة الرابعة. انقر على الحصول على رمز.

أداة تكوين الرمز

عنوان URL للمجموعة

عرض بيكسل المكون الإضافي

تضمين بيانات التعريف

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

الخطوة الخامسة. انسخ جزء الرمز البرمجي لـ HTML والصقه في صفحة الويب حيث تريد عرضه.

سمات المكون الإضافي

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

السمة	الوصف
`data-href`	عنوان URL لمجموعة فيسبوك
`data-show-metadata`	عرض بيانات التعريف حول مجموعة فيسبوك، مثل الوصف
`data-lazy`	`true` أو `false`، الإعداد الافتراضي. عند التعيين على `true`، لن يعرض المتصفح المكون الإضافي إذا كانت توجد احتمالية عدم رؤية المكون الإضافي، مثل إذا كان المكون الإضافي قريبًا من منطقة العرض
`data-width`	عرض المكون الإضافي بوحدات البيكسل. 280 هو العرض الافتراضي. يبلغ الحد الأدنى للعرض 180 والحد الأقصى للعرض 500
`data-skin`	سمة اللون لمحتوى المكون الإضافي. فيما يلي الخيارات المدعومة: `light`: يتم عرض المكون الإضافي بنص داكن، الإعداد الافتراضي `dark`: يتم عرض المكون الإضافي بنص باللون الأبيض

مثال على الرمز

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

في عنوان URL js.src، استبدل LATEST-API-VERSION بإصدار Graph API الذي يستخدمه تطبيقك
في عنوان URL js.src، استبدل APP-ID بمعرف تطبيق Meta لتطبيقك
بالنسبة إلى data-href، استبدل GROUP-URL بعنوان URL لمجموعة فيسبوك

<html>

<head>
    <!-- Load Facebook SDK for JavaScript -->
    <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 = 'https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=LATEST-API-VERSION&appId=APP-ID&autoLogAppEvents=1';
            fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));
    </script>
</head>

<body>

    <!--Your Group Plugin for the Web code-->
    <div class="fb-group" 
         data-href="GROUP-URL" 
         data-width="280" 
         data-show-metadata="false">
    </div>

</body>

</html>

المكون الإضافي للمجموعة