كيفية تغيير أيقونة المشرف

مطور
1

مرحباً، لقد قرأت هذا: Replace Discourse's default SVG icons with custom icons in a theme

أنشأت ورقة رموز (أعتقد أنني فعلت ذلك بشكل صحيح):

<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
    <symbol id="mod-crown" width="13" height="11" viewBox="0 0 13 11">
        <metadata><?xpacket begin="" id="W5M0MpCehiHzreSzNTczkc9d"?>
            <x:xmpmeta xmlns:x="adobe:ns:meta/" x:xmptk="Adobe XMP Core 5.6-c142 79.160924, 2017/07/13-01:06:39        ">
                <rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
                    <rdf:Description rdf:about=""/>
                </rdf:RDF>
            </x:xmpmeta>
            <?xpacket end="w"?>
        </metadata>
        <defs>
            <style>
                .cls-1 {
                fill: #04b214;
                }

                .cls-1, .cls-2, .cls-3, .cls-4 {
                fill-rule: evenodd;
                }

                .cls-3 {
                fill: #29ec3a;
                }

                .cls-4 {
                fill: #1f8111;
                }
            </style>
        </defs>
        <path class="cls-1" d="M11,5V3h1V5H11ZM10,7v3H9V7H7V8H6V7H4v3H3V7H2V5H5V3H6V1H7V3H8V5h3V7H10ZM8,10H7V8H8v2ZM5,10V8H6v2H5ZM1,3H2V5H1V3Z"/>
        <path class="cls-2" d="M8,10V8H7V7H9v3H8ZM6,10V8H7v2H6ZM5,10H4V7H6V8H5v2Z"/>
        <path class="cls-3" d="M11,3V1h1V3H11ZM10,5V3h1V5H10ZM4,5V3H5V5H4ZM5,1H6V3H5V1ZM2,7H3v3H2V7ZM1,5H2V7H1V5ZM0,1H1V5H0V1Z"/>
        <path class="cls-4" d="M12,5V0h1V5H12ZM11,7V5h1V7H11Zm0,4H2V10h8V7h1v4ZM8,3H9V5H8V3ZM7,1H8V3H7V1ZM6,0H7V1H6V0ZM2,3H3V5H2V3ZM1,1H2V3H1V1ZM0,0H1V1H0V0Z"/>
    </symbol>
</svg>

وأضاف الأصل إلى about.json:

    "assets": {
        "mod-crown": "assets/mod-crown.svg"
    }

وأضاف هذا إلى header.html:

<script type="text/discourse-plugin" version="0.8">
    api.replaceIcon('d-icon-shield-halved', 'mod-crown');
</script>

لكن الأيقونة لم تتغير، ولا تزال أيقونة الدرع موجودة. ماذا أفعل خطأ؟

إعجابَين (2)
2

مرحباً، أهلاً بك!

يجب استبدال اسم المتغير mod-crown بالاسم icons-sprite.

لقد واجهت نفس المشكلة من قبل، أعتقد أن التوثيق يمكن تحسينه في هذا الجزء.

أيضاً،

يجب أن يكون: api.replaceIcon('shield-halved', 'mod-crown');

إعجاب واحد (1)
3

لقد قمت بتعديل هذا ولكن لم يحدث أي تغيير.

    "assets": {
        "icons-sprite": "assets/mod-crown.svg"
    }

هل ورقة الرشاشات الخاصة بي صالحة؟ لاحظت أنها تبدو مختلفة عن أوراق الرشاشات الأخرى مثل assets/spritesheet.svg · main · Manuel Kostka / Discourse / Themes / Heroes · GitLab

لقد حاولت إزالة style="display: none;" من وسم svg في ورقة الرشاشات الخاصة بي ولكن ذلك لم يساعد أيضًا.

4

هل حاولت إزالة البيانات الوصفية، فقط في حالة؟

سأحاول على جانبي.

5

لا يوجد تغيير عند إزالة البيانات الوصفية.

ولكن:

<script type="text/discourse-plugin" version="0.8">
    api.replaceIcon('shield-alt', 'mod-crown');
</script>

هذا يجعله يظهر ولكنني أحصل أيضًا على تحذير مخيف بشأن التوافق:

image
image592×218 71.2 KB

في المفتش أحصل على هذا التحذير: إشعار إيقاف: تم تحديث اسم الأيقونة "shield-alt" إلى "shield-halved".

واستخدام shield-halved بدلاً من d-icon-shield-halved يعمل بشكل صحيح!

شكراً لمساعدتك :grin:

إعجابَين (2)
6

ما كنت على وشك قوله، لاحظته للتو أيضًا!
يسعدني أنه يعمل. :وجه_ضاحك_بعيون_مبتسمة:

إعجاب واحد (1)
7

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.