إذا كان هناك شيء واحد يُطلب مني غالبًا تخصيصه على شبكة اجتماعية تم إنشاؤها باستخدام نظام إدارة المحتوى (CMS). باديبريس، هذه إدارة جيدة للصورة الرمزية. في الواقع، هناك من ناحية حقيقة أن الصورة الرمزية ترتبط دائمًا بالصفحة المفتوحة بالفعل، وهو أمر غير مفيد في حد ذاته، ومن ناحية أخرى حجمها، الذي لا يمكن تخصيصه بسهولة لغير المبتدئين.

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

1. كيفية ربط الصورة الرمزية بالصورة بالحجم الكامل

أعضاء-header.php

اذهب إلى الملف الخاص بك member-header.php (الموجود في مجلد الأعضاء/المفرد لموضوع Buddypress الخاص بك). بمجرد دخولك إلى هذا الملف، ابحث عن سطر التعليمات البرمجية المطابق لما يلي:

<a href="/ar/ »NO NUMERIC NOISE KEY/" 1000 »>

<?php bp_displayed_user_avatar( ‘type=full’ ); ?>

</a>

استبدل هذا الكود بهذا :

<a href="/ar/ »NO NUMERIC NOISE KEY/" 1000 »>

<?php bp_displayed_user_avatar( ‘type=full&width=150&height=150’ ) ?>

</a>

كما ترون، هنا نستخدم الدالة bp_core_fetch_avatar، مع السمة 'html' => خطأ، والذي يسمح تسليط الضوء على عنوان URL للصورة الرمزية، بدون لغة HTML المصاحبة ( <img src =…).

قم بتحميل ملف member-header.php.

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

2. كيفية تغيير أحجام الصور الرمزية في Buddypress

وظائف.php

للقيام بذلك، لا شيء يمكن أن يكون أبسط، انتقل إلى ملف الوظائف الخاص بك (functions.php) لإضافة هذه الأسطر من التعليمات البرمجية:

إذا (! محدد( 'BP_AVATAR_THUMB_WIDTH' ) )
تعريف( 'BP_AVATAR_THUMB_WIDTH', 50); // ضع العرض الذي تريده لحجم الصورة المصغرة
إذا (! محدد( 'BP_AVATAR_THUMB_HEIGHT' ) )
تعريف( 'BP_AVATAR_THUMB_HEIGHT', 50); // ارتفاع الأحجام المصغرة
إذا (! محدد( 'BP_AVATAR_FULL_WIDTH' ) )
تعريف( 'BP_AVATAR_FULL_WIDTH', 400); // عرض الحجم الفعلي
إذا (! محدد( 'BP_AVATAR_FULL_HEIGHT' ) )
تعريف( 'BP_AVATAR_FULL_HEIGHT', 400); // ارتفاع الحجم الفعلي

باستخدام هذا الجزء من الكود، يمكنك ضبط الحجم الحقيقي للصور الرمزية على 400*400، وحجم الصور الرمزية المصغرة على 50*50.

3. ملحقات وملاحظات

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

علاوة على ذلك، أحيلك إلى سمات الوظيفة bp_displayed_user_avatar( 'type=full&width=150&height=150' ) : كما ترون، اخترنا عرض الصورة الرمزية "بالكامل"، أي بالحجم الحقيقي، ولكن عن طريق تغيير حجم الإخراج، بحيث تكون لدينا صورة متوسطة الحجم في صفحة الملف الشخصي.

بالتأكيد لا يُنصح بهذه الطريقة من حيث سرعة تحميل الصفحة، ولكنها تتجنب إضافة حجم صورة جديد للصور الرمزية. ومع ذلك، يمكنك اللعب بهذه السمات، واختيار وضع "type=thumb" بدلاً من وضع "كامل" في الأماكن التي تريدها.

الخلاصة: تسلط شبكتك الاجتماعية الضوء على صور الملف الشخصي

بفضل هذه الطريقة، ترتبط الصور الرمزية لأعضائك الآن بصور أكبر، وهو أمر أكثر عملية لإدارة الشبكات التي تكون فيها صورة الملف الشخصي مهمة.