حالياً في صفحات قائمة المواضيع الخاصة بنا، يتم عرض صور المشاركين الرئيسيين في كل موضوع، بالإضافة إلى رابط لصفحة ملف المستخدم. يمكن رؤية ذلك هنا:
عندما لا يكون المستخدم مسجلاً دخوله، لن يكون هذا الرابط قابلاً للنقر لأنه سيعيد توجيهاً إلى صفحة تسجيل الدخول.
المشكلة هي أن مستشار تحسين محركات البحث (SEO) لدينا قد حدد أن هذه مشكلة بالنسبة لنا، ويريد ألا يكون رابط صفحة الملف الشخصي مرئياً لجوجل على الإطلاق.
هناك مشاكل مماثلة في أشياء مثل منشورات الموضوع، ولكن كل هذه كانت في أدوات (widgets) وكان حلها سهلاً نسبياً باستخدام api.reopenWidge() وما شابه ذلك.
ليس الأمر كذلك بالنسبة لصفحات قائمة المواضيع، حيث نحتاج إلى تغيير محتويات raw-templates/list/posters-column.hbr!
سأصف الآن الأشياء التي جربتها. لا تتردد في التخطي إلى النهاية إذا كنت ترغب في ذلك وتعرف الإجابة بالفعل.
في البداية، حاولت تحميل أداة (widget) وفقاً لتعليمات دليل المبتدئين.
<script type="text/x-handlebars" data-template-name="list/posters-column">
<td class='posters topic-list-data'>
{{#each posters as |poster|}}
{{#if poster.moreCount}}
<a class="posters-more-count">{{poster.moreCount}}</a>
{{else}}
{{mount-widget widget="custom-list-avatar"}}
{{/if}}
{{/each}}
</td>
</script>
لم يبد أي من هذا أي تأثير على الإطلاق. في النهاية، وجدت في سمة (theme) كان شخص ما يستخدم امتداد .raw في قيمة data-template-name، لذلك أفترض أن الدليل قديم. لم يذكر شيئاً عن القوالب الخام! استخدام .raw يسمح بعرض التغييرات أعلاه، باستثناء أن أداتي المخصصة رفضت التحميل.
هذا غريب، لأن list/posters-column يتم الإشارة إليه فقط بواسطة topic-list-item.hbr، وهو أيضاً قالب خام، وهو أحد القوالب المستخدمة في هذا الدليل تحديداً. ولكن… مرة أخرى، أعتقد أنه قديم؟ قرأت في النهاية في مكان ما أنه لا يمكنك تحميل أدوات (widgets) في القوالب الخام، لذلك يبدو أن هذا لم يكن سينجح أبداً.
بعد ذلك، اكتشفت الأجزاء (partials) وحاولت استخدامها. اعتقدت أنني قد أحظى بفرصة أفضل، الآن بعد أن لم تعد تلك الأجزاء قالبًا خامًا.
<script type="text/x-handlebars" data-template-name="components/custom-avatar">
<a href="{{poster.user.path}}" data-user-card="{{poster.user.username}}" class="{{poster.extraClasses}}">{{avatar poster avatarTemplatePath="user.avatar_template" usernamePath="user.username" namePath="user.name" imageSize="small"}}</a>
</script>
<script type="text/x-handlebars" data-template-name="list/posters-column.raw">
<td class='posters topic-list-data'>
{{#each posters as |poster|}}
{{#if poster.moreCount}}
<a class="posters-more-count">{{poster.moreCount}}</a>
{{else}}
{{partial 'components/custom-avatar'}}
{{/if}}
{{/each}}
</td>
</script>
للأسف، يبدو أنه لا يمكنك استخدام الأجزاء (partials) في القوالب الخام أيضاً، لذا كان هذا النهج غير ممكن.
ثم، وجدت هذا الموضوع الذي بدا أنه قد يحتوي على ما أحتاجه. بناءً على هذا النهج، ومع العلم أن list/topic-list-item (الذي يستدعي list/posters-column) يتم استخدامه بواسطة مكون topic-list-item، توصلت إلى ما يلي:
<script type="text/x-handlebars" data-template-name="list/posters-column.raw">
<td class='posters topic-list-data'>
{{#each posters as |poster|}}
{{#if poster.moreCount}}
<a class="posters-more-count">{{poster.moreCount}}</a>
{{else}}
{{#if hideFromAnonUser}}
<div data-user-card="{{poster.user.username}}" class="{{poster.extraClasses}}">{{avatar poster avatarTemplatePath="user.avatar_template" usernamePath="user.username" namePath="user.name" imageSize="small"}}</div>
{{else}}
<a href="{{poster.user.path}}" data-user-card="{{poster.user.username}}" class="{{poster.extraClasses}}">{{avatar poster avatarTemplatePath="user.avatar_template" usernamePath="user.username" namePath="user.name" imageSize="small"}}</a>
{{/if}}
{{/if}}
{{/each}}
</td>
</script>
<script type="text/discourse-plugin" version="1.1.0">
const settings = Discourse.SiteSettings;
const user = api.getCurrentUser();
const hideFromAnonUser = settings.hide_user_profiles_from_public && !user;
const topicListItemComponent = require('discourse/components/topic-list-item').default;
topicListItemComponent.reopen({
hideFromAnonUser: function() {
return hideFromAnonUser
}.property()
});
</script>
للأسف، hideFromAnonUser لا يظهر أبداً أنه مرئي للقالب الخام. ربما يحتاج hideFromAnonUser إلى حسابه من داخل الدالة المعينة لمفتاح hideFromAnonUser؟ لا يبدو أن الأمر مهم. حتى لو قمت بالتعليق على أول ثلاثة تعيينات const وجعلتها تُرجع False، أو أضفت استدعاء console.log() بداخلها قبل عبارة الإرجاع، يمكنني رؤية أن الدالة لا يتم تنفيذها أبداً بواسطة أي شيء.
في هذه المرحلة، أنا في حيرة من أمري. لم أعمل مع أي من هذا من قبل، وأشعر أنني أغرق. ربما فاتني شيء ما، ولكن يبدو أن الكثير من المعلومات مضللة أو قديمة، أو أنني أبحث في الأماكن الخاطئة، أو أنني ببساطة أساء فهم شيء ما.
كيف يمكنني استبدال علامات <a></a> بعلامات <div></div> للصور الرمزية في صفحات قائمة المواضيع؟ شكراً.
