ما هي أفضل طريقة لإعداد مكون أيقونات twemoji؟

manuel · 30 يونيو 2023، 5:19م

أنا أعمل على سمة حيث أرغب في استخدام الرموز التعبيرية كأيقونات في بعض الأماكن. المظهر المقصود هو أكثر أو أقل مثل هذا:

أود تغليف هذا كمكون، بشكل أساسي عن طريق إضافة ورقة sprites لـ Twemoji. لذلك يمكن اختيار الرموز التعبيرية لقائمة الشريط الجانبي وكأيقونات فئة. لا أريد تجاوز أيقونات النظام بالكامل.

هذا يعمل بشكل عام، ومع ذلك، أود أن أسمع آراء حول قضيتين:

المجموعة الكاملة تحتوي على أكثر من 3000 أيقونة. سيكون حجم الملف 8 ميجابايت. لقد وجدت ورقة sprites محدودة عبر الإنترنت تحتوي على 2 ميجابايت. المجموعة الكاملة لم تعمل في الواقع، المجموعة المخفضة عملت. ما هي الحدود التي يجب أن أستهدفها بمجموعة أيقونات؟
افتراضيًا، تمتلك الرموز التعبيرية قيمة Unicode السداسية عشرية كمعرف. لذلك ستحتاج إلى استخدام منتقي رموز تعبيرية مثل Twemoji Cheatsheet للعثور على الرمز التعبيري الخاص بك وقيمته السداسية عشرية، ثم إدخالها. على سبيل المثال:

لقطة شاشة من 2023-06-30 17-54-48364×497 15.8 KB

هل يعرف أحد أفضل طريقة لأتمتة تغيير المعرفات إلى أسماء مختصرة فعلية؟ حتى يتمكن المرء من الاختيار عن طريق كتابة “tw-books”؟

Lilly · 30 يونيو 2023، 5:43م

كل ما يمكنني قوله الآن هو نعم من فضلك أحب هذا

Alexander · 30 يونيو 2023، 5:57م

يبدو أن الصفحة التي ربطتها تستخدم emojibase للحصول على “خريطة رموز تعبيرية” (مع يونيكود، اسم، إلخ)، ربما يمكنك استخدام شيء مشابه؟

روابط ذات صلة:

github.com/ShahriarKh/twemoji-cheatsheet

components/SearchBox.jsx

main

import { useEffect, useState } from "react";
import css from "./SearchBox.module.scss";
import Fuse from "fuse.js";

export default function SearchBox({ setAvailabeEmojis, emojis }) {
    const fuse = new Fuse(emojis, {
        threshold: 0.1,
        keys: ["label", "tags", "emoji", "hexcode", "emoticon"],
    });

    const [query, setQuery] = useState("");

    function handleSearch(query) {
        if (query == "") {
            setAvailabeEmojis(emojis);
            return;
        }
        let results = fuse.search(query);
        let flatResults = Object.keys(results).reduce(function (r, k) {
            return r.concat(results[k].item);

This file has been truncated. show original

بالمناسبة، تبدو رائعة

manuel · 1 يوليو 2023، 4:12م

شكراً لك ألكسندر! يبدو أنني كنت بحاجة إلى دفعة هنا

إذًا، هذا يعمل الآن لقد أضفت المجموعة الرئيسية من الرموز التعبيرية، بدون متغيرات (مثل لون البشرة والجنس). هذه مجموعة من 1869 أيقونة (من أصل 3689 ملف SVG في مجلد أصول Twemoji). لقد استخدمت tw- كبادئة، بالإضافة إلى الرمز المختصر الإنجليزي لتسمية الأيقونات. قد يحتاج المرء إلى استخدام موقع مرجعي للعثور على الرمز التعبيري الصحيح حيث أن الأسماء لا تتضمن أي علامات. على سبيل المثال، هذه الأيقونة لا تظهر إذا كتبت golf في أداة اختيار الأيقونات:

سأشارك المكون في theme-components عندما أنتهي من الثيم. إذا أراد أي شخص تجربته بالفعل، فإن المستودع هو GitHub - nolosb/discourse-twemoji-icons: Use twemojis as icons in Discourse.

system · 31 يوليو 2023، 4:12م

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

الموضوع		الردود	مرات العرض
Twemoji Icons Theme component	4	840	20 يوليو 2023
New Emoji picker feedback Announcements new-feature	41	5843	15 أكتوبر 2017
Emoji selector and custom Emoji Feature emoji , rfc , spec	35	19692	3 مارس 2015
Convert Unicode standard emojis to selected emoji set Feature	2	2260	14 يوليو 2015
Emojis update Announcements emoji	58	1723	30 نوفمبر 2025

ما هي أفضل طريقة لإعداد مكون أيقونات twemoji؟

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