18.04: kolorowe emoji w ogóle nie pojawiają się w Chrome, tylko częściowo w Firefox

Uaktualniłem z 17.10 do 18.04 i liczyłem na lepszą obsługę emoji. W rezultacie Chrome (66) nadal używa starej czarno-białej czcionki emoji, a Firefox (59) potrafi wyświetlać niektóre kolorowe emoji, ale nie inne. Poradziłem sobie, aby zainstalować czcionkę EmojiOne, ale to nie pomogło 😓

Zrzuty ekranu ze strony demonstracyjnej emoji na http://eosrei.github.io/emojione-color-font/full-demo.html :

Chrom:

Firefox:

Na Ubuntu 18.04+ można teraz wystarczy zainstalować jeden pakiet: fonts-noto-color-emoji. Następnie uruchom ponownie Chrome, a zacznie obowiązywać. Nie ma potrzeby tworzenia ręcznej konfiguracji czcionek.

^{Ten pakiet powinien zostać zainstalowany na zwykłym pulpicie Ubuntu 18.04+ (na „zalecanym” poziomie zależności - sprawdź sam z apt rdepends fonts-noto-color-emoji). Niektóre inne smaki, takie jak Kubuntu (KDE), nie mają tego domyślnie i wymagają ręcznej instalacji.}

Naprawiłem to - musiałem postępować zgodnie z tymi instrukcjami od 2016 roku 😧 Musiałem utworzyć ~/.config/fontconfig/conf.d/01-emoji.confz następującym tekstem:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE fontconfig SYSTEM "fonts.dtd">
<fontconfig>
  <alias>
    <family>serif</family>
    <prefer>
      <family>Noto Color Emoji</family>
    </prefer>
  </alias>
  <alias>
    <family>sans-serif</family>
    <prefer>
      <family>Noto Color Emoji</family>
    </prefer>
  </alias>
  <alias>
    <family>monospace</family>
    <prefer>
      <family>Noto Color Emoji</family>
    </prefer>
  </alias>
</fontconfig>

Nieco niepotrzebny był fragment oryginalnej instrukcji instalacji czcionki Noto, ponieważ jest ona domyślnie instalowana jako część 18.04.

Następnie uruchomić:

fc-cache -f -v

Przy następnym uruchomieniu Chrome ma kolorowe emoji.

Wygląda na to, że ten problem może być spowodowany zainstalowaniem wielu niezgodnych czcionek emoji i / lub wyborem niewłaściwej domyślnej czcionki w Chrome.

1. Upewnij się, że masz fonts-noto-color-emojizainstalowany pakiet.

   sudo apt install fonts-noto-color-emoji
   

2. Utwórz / edytuj pliki konfiguracyjne czcionek jak w odpowiedzi @ N3dst4 .

   • Uwaga: Podczas gdy @ N3dst4 umieścił swój plik konfiguracyjny ~/.config/fontconfig/conf.d/01-emoji.conf, ja wstawiłem mój z ~/.config/font-manager/local.confpowodu konfiguracji mojego systemu.

   <?xml version="1.0" encoding="UTF-8"?>
   <!DOCTYPE fontconfig SYSTEM "fonts.dtd">
   <fontconfig>
     <alias>
       <family>serif</family>
       <prefer>
         <family>Noto Color Emoji</family>
       </prefer>
     </alias>
     <alias>
       <family>sans-serif</family>
       <prefer>
         <family>Noto Color Emoji</family>
       </prefer>
     </alias>
     <alias>
       <family>monospace</family>
       <prefer>
         <family>Noto Color Emoji</family>
       </prefer>
     </alias>
   </fontconfig>
   

3. Ustaw domyślne czcionki w Chrome na odmiany „Noto”.

4. Odbuduj pamięć podręczną czcionek + uruchom ponownie chrome.

   fc-cache -f -v
   

5. Jeśli emoji nadal nie są wyświetlane poprawnie, sprawdź, jakie czcionki są używane do ich renderowania right click on emoji -> Inspect -> Computed -> Rendered Fontsi odinstaluj je.

   • Przykład: Moje emoji były renderowane czcionką Twitter Color Emoji, więc musiałem odinstalować pakiet fonts-twemoji-svginot.
   • Może nie być konieczne odinstalowanie czcionek, jeśli grasz więcej z plikami konfiguracji czcionek, ale ja tego nie testowałem.
   • Nie zapomnij odbudować pamięci podręcznej czcionek + uruchom ponownie chrome po odinstalowaniu czcionek.

BTW to również naprawiło dla mnie tekst Zalgo .

Nie używaj tej strony demonstracyjnej do testowania kolorowych emoji. Ta strona pokazuje tylko czcionkę EmojiOne, która nie jest domyślnie instalowana w Ubuntu (chociaż Firefox używa jej odmiany).

Zamiast tego użyj https://unicode.org/emoji/charts/full-emoji-list.html

Spójrz na kolumnę przeglądarki. Domyślnie Ubuntu powinien w większości pasować do kolumny Google. (Z wyjątkiem kolumny Przeglądarka, wszystkie pozostałe kolumny są tylko .pngikonami). Kiedy dzisiaj testowałem, kolumna Google jest trochę nieaktualna, ponieważ Google wprowadziło pewne zmiany w niektórych swoich emoji, które nie zostały włączone do witryny. (Na przykład hamburger ma ser na burgerze.)