Twemoji 아이콘

[manuel (Manuel Kostka)]

	요약	Discourse에서 Twitter 이모지를 아이콘으로 사용합니다.
	저장소	GitHub - nolosb/discourse-twemoji-icons: Use twemojis as icons in Discourse. · GitHub
	설치 가이드	테마 또는 테마 컴포넌트 설치 방법
	Discourse 테마 초보자?	Discourse 테마 사용 입문가 가이드

이 테마 컴포넌트 설치

이 컴포넌트는 Twitter 이모지를 아이콘으로 추가합니다. 각 컴포넌트를 사용하여 이모지로 카테고리 및 태그 아이콘을 추가할 수 있습니다. 또한 관리자 모달이나 사용자 정의 테마 코드에서 기본 인터페이스 아이콘을 교체할 수도 있습니다.

아래는 이 컴포넌트를 사용하여 인터페이스 및 카테고리 아이콘에 이모지를 표시하는 Kiosk 테마의 예시입니다:

상세 설명

• 아이콘 이름은 tw 접두어와 케밥 케이스(kebab-case, 모든 단어는 하이픈으로 구분)로 된 이모지 쇼트네임(shortname)에서 생성됩니다.

• 예를 들어, 이모지는 아이콘 이름 tw-sun으로, 은 tw-beach-umbrella로 불립니다.

• 쇼트네임은 Twemoji Cheatsheet에서 확인하세요.

• 관리자 모달에서 아이콘을 사용하세요. 예를 들어 사이드바를 사용자 정의할 때:

  

• 컴포넌트 설정에서 아이콘을 사용하세요. 예를 들어 카테고리 아이콘을 설정할 때:

  

• 테마 코드에서 아이콘을 사용하세요:

  api.replaceIcon('star', 'tw-star');

[Falco]

이모지를 위한 대형 SVG 스프라이트를 배포하고 계시는 것 같은데, Discourse가 이미 모든 Twitter 이모지를 제공하고 있으므로 이를 재사용하는 것은 어떨까요? 이렇게 하면 사용자가 해당 SVG 파일을 설치하고 서빙할 필요가 없어집니다.

[manuel (Manuel Kostka)]

네, 이 컴포넌트의 기능은 원하는데 큰 스프라이트 파일을 서빙하고 싶지는 않아요. 그런데 Discourse는 이모지를 유니코드 시퀀스로 제공하잖아요? svg 아이콘을 교체할 수 있으면 좋겠는데, 제 이해가 맞다면 그걸 위해서는 svg가 필요한 것 같아요.

[Falco]

@manuel

하지만 Discourse는 이모지를 유니코드 시퀀스로 제공하나요?

우리는 https://emoji.discourse-cdn.com/twitter/beach_umbrella.png와 같은 개별 PNG 파일로 제공합니다.

따라서 사이드바에서는 정상적으로 작동하지만, 아이콘에는 사용할 수 없습니다.

[manuel (Manuel Kostka)]

네, 이 컴포넌트가 다양한 스타일과 디자인을 쉽게 탐색할 수 있게 해준다는 가치를 인정합니다. 실제로 프로덕션 환경에서 이모지 아이콘을 사용하려면, 현재 사용 중인 이모지만을 담은 전용 스프라이트 파일을 제공하는 것이 훨씬 낫다고 생각합니다.