공유할 때 링크 아이콘만 대체

[cogdog (Alan Levine)]

디스코urs 인터페이스의 이 부분이 혼란스럽습니다. 에디터에서는 링크 아이콘이 하이퍼링크 삽입에 사용되는데(이건 당연한 것 같고, 다른 인터페이스 99%와 동일합니다)

하지만 게시글을 조회할 때 동일한 아이콘이 링크/소셜 공유에 사용됩니다.

사실 여기서는 더 익숙한 공유 아이콘이 더 합리적이라고 생각합니다.

일단 API 방식을 이용해 아이콘을 변경하는 방법을 사용했습니다.

  <script type="text/discourse-plugin" version="0.8">
    api.replaceIcon('link', 'external-link-tab');
 </script>

하지만 이렇게 하면 에디터의 아이콘도 함께 변경되어, 하이퍼링크 삽입을 나타내기 위해 공유 아이콘을 사용하는 것은 말이 안 됩니다. 이 버튼의 두 가지 컨텍스트를 각각 참조할 수 있는 별도의 API 호출이 있다면, 링크 삽입 아이콘은 그대로 두고 공유 링크 아이콘만 대체할 수 있을 텐데 아쉽습니다.

??? (디스코urs의 내부 작동 방식에 대한 제 지식은 대부분 얕습니다)

[Falco]

@cogdog

하지만 이렇게 하면 에디터의 아이콘이 변경되므로, 하이퍼링크 삽입을 공유 아이콘으로 나타내는 것은 의미가 없습니다. 이 버튼의 두 가지 컨텍스트를 참조하기 위한 별도의 API 호출이 있다면, 공유 링크 아이콘으로는 대체하되 링크 삽입 아이콘으로는 사용하지 않을 수 있어 도움이 될 것입니다.

이것은 Discourse의 변경 사항이 필요합니다. 기본적으로 두 버전 모두 동일한 아이콘을 사용하도록 내부에서 이 아이콘을 복제해야 하며, 이를 통해 다운스트림 사용자가 각각 개별적으로 변경할 수 있도록 해야 합니다.

[cogdog (Alan Levine)]

다시 한번 말씀드리지만, 아이콘을 찾는 것이 아닙니다! 제 사이트에서는 원하는 아이콘을 자유롭게 사용할 수 있습니다.

제가 원하는 것은 discourse에서 API를 통해 아이콘을 오버라이드하는 방법에 명시된 대로, 편집기에서 하이퍼링크 삽입 버튼에 사용되는 아이콘은 변경하지 않으면서 게시물을 공유하는 버튼의 아이콘만 변경하는 메서드입니다.

[supermathie (Michael Brown)]

우리는 정확히 그렇게 하는 것이 가능한지 검토하고 있으며, 유용할 것이라고 동의합니다.

[pmusaraj (Penar Musaraj)]

네, 아래 커밋이 tests-passed 상태가 되는 즉시 원하는 작업을 수행할 수 있습니다:

DEV: Allow replacing share icons separately (#14774)

(tests-passed 상태가 되기까지 약 1시간 정도 걸릴 수 있습니다.)

그래서 게시글 및 토픽 버튼의 공유 아이콘에 새로운 ID를 추가했습니다. 이제 API의 replaceIcon 호출에서 다음과 같이 이를 분리하여 사용할 수 있습니다:

api.replaceIcon('d-post-share', 'share-square');
api.replaceIcon('d-topic-share', 'share-square');

[cogdog (Alan Levine)]

감사합니다, 감사합니다! 메타에서 공유 버튼 아이콘의 클래스 이름이 최신 버전의 디스커스와 다른 이유를 알아내려고 하고 있었습니다.

[cogdog (Alan Levine)]

업데이트에 변경 사항이 반영된 것을 확인하고 저희 사이트에서 실행해 보았습니다. 다른 분들께 참고를 드리고자 말씀드리면, 아이콘을 사용하려면 admin -> settings -> svg icon subset에서 fa-share-square를 추가해야 합니다.

완벽하게 작동했습니다. 저희 공유 아이콘이 다음과 같이 바뀌었습니다:

다음과 같이:

다시 한번 감사합니다.

[cogdog (Alan Levine)]

이미 완료되었습니다! 위의 게시물을 확인해 주세요.

공유할 때 링크 아이콘만 대체

Yep, as soon as the commit below hits tests-passed, you can do what you are looking to do: https://github.com/discourse/discourse/commit/f6a3c22a898069e6e15a4e220fc12b91eba2e15e (It might take an hour or so for that to hit tests-passed.) So I added new IDs for the share icons in the post and topic buttons, so you can isolate them now in the API replaceIcon call, like this: api.replaceIcon('d-post-share', 'share-square'); api.replaceIcon('d-topic-share', 'share-square'); [image]

몇 시간 전에 discourse를 업데이트할 수 있었고, 새로운 기능이 이미 적용되어 있습니다.

[anon73664359]

흥미롭네요. 방금 제 Discourse 인스턴스를 업데이트해 봤는데도 아직 보이지 않아요.

잠깐 디버깅 좀 해볼게요…

[tachibanalolo]

이 변경 사항을 정말 좋아합니다. 아이콘을 변경하려면 어떻게 해야 하나요?

[ondrej]

<script type="text/discourse-plugin" version="0.8">
        api.replaceIcon('d-post-share', 'share-square');
        api.replaceIcon('d-topic-share', 'share-square');
    </script>

테마를 편집할 때 header에 이 코드를 추가하기만 하면 됩니다.

[cogdog (Alan Levine)]

한 가지 더 필요한 단계가 있다는 것을 발견했습니다. 이 font-awesome 아이콘을 svg 아이콘으로 사용 가능하게 만들어야 합니다. 그렇지 않으면 헤더 테마를 조정해도 버튼이 빈 상태로 표시됩니다.

@cogdog

이 아이콘을 사용하려면 admin -> settings -> svg icon subset에서 fa-share-square를 추가해야 합니다.

제 설정은 다음과 같습니다:

[cogdog (Alan Levine)]

이 업데이트는 공유 버튼 아이콘의 클래스 이름만 변경하며, 그 외에는 아무것도 변경하지 않으므로 바로 차이를 느끼지 못할 수 있습니다. 기본값은 이전과 동일한 링크 아이콘을 유지하는 것입니다(link).

브라우저에서 버튼을 검사했을 때 클래스에 d-icon-d-post-share가 포함되어 있으면 업데이트가 완료된 것입니다. (업데이트 전에는 클래스가 d-icon-link였습니다)

여기에 설명된 대로 테마 헤더를 편집해야 합니다: Substitute Link Icon Only For Sharing - #22 by ondrej