الزر مشاركة

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

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

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

أداة تكوين الزر مشاركة
مثال على الرمز البرمجي
الإعدادات
الأسئلة المتكررة

الخطوات التفصيلية

1- اختيار عنوان URL أو صفحة

اختر عنوان URL لموقع ويب أو صفحة فيسبوك تريد مشاركتها.

2- أداة تكوين الرمز البرمجي

الصق عنوان URL في أداة تكوين الرمز البرمجي، ثم اضبط layout للزر مشاركة. وانقر على الزر Get Code لإنشاء الرمز البرمجي للزر مشاركة.

3- نسخ جزء رمز HTML البرمجي ولصقه

انسخ جزء الرمز البرمجي والصقه داخل رموز HTML بموقع الويب المقصود.

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

عنوان URL المطلوب مشاركته

التخطيط

button_count

حجم الزر

small

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

مثال على الرمز البرمجي بالكامل

انسخ مثالاً على الرمز البرمجي والصقه في موقعك على الويب. بعد ذلك، اضبط قيمة data-href في عنوان URL لموقعك على الويب. وبعد ذلك، استخدم إشارات التعريف og:*** لضبط معاينة الرابط لديك. ويجب أن يستخدم og:url وdata-href عنوان URL نفسه.

<html>
<head>
<title>Your Website Title</title>
<!-- You can use Open Graph tags to customize link previews.
Learn more: https://developers.facebook.com/docs/sharing/webmasters -->
<meta property="og:url"           content="https://www.your-domain.com/your-page.html" />
<meta property="og:type"          content="website" />
<meta property="og:title"         content="Your Website Title" />
<meta property="og:description"   content="Your description" />
<meta property="og:image"         content="https://www.your-domain.com/path/image.jpg" />
</head>
<body>

<!-- 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=v3.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<!-- Your share button code -->
<div class="fb-share-button" 
data-href="https://www.your-domain.com/your-page.html" 
data-layout="button_count">
</div>

</body>
</html>

الإعدادات

الإعداد	سمة HTML5	الوصف	القيمة الافتراضية
`href`	`data-href`	عنوان URL المطلق للصفحة التي ستتم مشاركتها.	يتم تعيين القيم الافتراضية للإصدارين XFBML وHTML5 إلى عنوان URL الحالي.
`lazy`	`data-lazy`	تشير القيمة `true` إلى استخدام آلية التحميل البطيء في المتصفح من خلال تعيين السمة `loading="lazy"` لإطار iframe. ويتمثل التأثير في عدم قدرة المتصفح على عرض المكون الإضافي إذا لم يكن بالقرب من منفذ العرض وربما لا يمكن عرضه أبدًا. ويمكن أن يكون بالقيمة `true` أو `false` (افتراضي).	`false`
`layout`	`data-layout`	يمكن تحديد أحد التخطيطات المختلفة المتاحة للمكون الإضافي. يمكن أن تكون بالقيمة `box_count` أو `button_count` أو `button`.	`icon_link`
~~`mobile_iframe`~~ الميزات التي تم إيقاف استخدامها	~~`data-mobile_iframe`~~	إذا تم تعيين القيمة إلى `true`، فسيفتح زر المشاركة مربع الحوار مشاركة في إطار iframe (بدلاً من إطار منبثق) أعلى موقعك على الويب عند من خلال الهاتف المحمول. لا يتوفر هذا الخيار إلا للهواتف المحمولة وليس لأجهزة الكمبيوتر. لمزيد من المعلومات، راجع مربع الحوار مشاركة لويب الهواتف المحمولة.	~~`false`~~
`size`	`data-size`	يتوفر الزر بحجمين هما `large` و`small`.	`small`

الموضوعات ذات الصلة

الأسئلة المتكررة حول المكونات الإضافية للتواصل الاجتماعي مربع الحوار مشاركة المشاركة لمسؤولي مواقع الويب مجموعة Facebook SDK للغة JavaScript