nathank
(Nathan Kershaw)
41
제안해 주신 대로 진행하여, 원하지 않는 버튼들을 다음과 같이 숨겼습니다:
// MD Composer Extras TC에서 불필요한 버튼 숨기기
.d-editor-button-bar {
.superscript_button,.subscript_button, .align_center_button,.align_right_button, .align_justify_button {
display: none;
}
}
하지만 이 기능의 TC 설정에서 어떤 버튼을 포함할지 선택할 수 있다면 정말 좋겠습니다. 버튼 설정에 텍스트가 없으면 해당 버튼이 생성되지 않도록 하는 방식으로 구현할 수 있을지 궁금합니다.
직접 시도해 보았지만 제 초보적인 실력으로는 감당이 되지 않았습니다. 각 부분이 해당 설정에 따라 조건부로 동작하도록 만드는 방법을 찾지 못했습니다.
1개의 좋아요
Heliosurge
(Dan DeMontmorency)
42
스티븐님, 안녕하세요! 아주 좋은 컴포넌트인데 작은 버그를 발견했습니다. 상첨자(Superscript)에 약간의 오류가 있습니다. 아래를 참고해 주세요.
/sub 대신 /sup으로 닫아야 합니다.
2개의 좋아요
Heliosurge
(Dan DeMontmorency)
43
고급 버전에서 설정 토글을 사용하여 올인원(all-in-one) 기능을 구현할 수 있을 것 같습니다.
예를 들어, bbcode 플러그인을 사용 중인지 여부를 나타내는 토글을 두면, 양쪽 모두에서 버튼을 숨기거나 바에 버튼을 추가하는 옵션을 가질 수 있습니다. 관리자가
드롭다운에서 옵션을 제외하기를 원할 때도 동일한 방식을 적용할 수 있습니다.
저는 아직 css를 배우는 단계라 초보이지만, 드롭다운을 캐스케이딩 드롭다운으로 정리하기 위해 추가적인 장식 효과를 위한 보조 컴포넌트를 만들 수 있을 것입니다.
예를 들어, 색상 옵션 선택기가 있는 메인 드롭다운 기어입니다.
 |
. |
| 투표 삽입 |
|
| 표 삽입 |
|
| 텍스트 색상. > |
빨강 |
|
초록 |
|
파랑 |
|
주황 |
드롭다운과/또는 툴바에 다른 서식 옵션을 그룹화하여 서식 옵션을 선택할 수 있는 메뉴를 만들 수도 있습니다.
1개의 좋아요
감사합니다. 해당 문제에 대한 수정 사항을 push했습니다.
2개의 좋아요
Heliosurge
(Dan DeMontmorency)
45
Heliosurge
(Dan DeMontmorency)
46
선택적 브랜치 설치 방법을 포함하도록 Op Post를 업데이트하는 것을 권장합니다. "color"와 “simple” 브랜치 대안을 확인했습니다.
color 브랜치에서 bbcode_color에 작은 변경 사항을 적용했습니다.
“Desktop\Head” - 65행과 “*€Mobile\Head**” - 96행에서
**“[color=##233]”**를 **“[color=name]”**으로 변경했습니다. WiP 사이트에서 이름(color name)을 색상으로 변경하는 가이드를 만들 예정이기 때문입니다.
16진수 값은 원래 사용했던 값이 아닙니다. 그것이 어떤 값이었는지에 대한 참고용으로만 넣어두었습니다.
아직 초보 단계라 GitHub 계정을 만들고 풀 리퀘스트(Pull Request) 방법을 배우는 데 시간이 좀 걸릴 것입니다.
이렇게 간편하면서도 기능이 풍부한 컴포넌트를 만들어 주셔서 정말 감사합니다. 정말 감사드립니다.
그리고 작은 제안 하나 드리고 싶은데요, 더 긴 태그 대신 이것과 같은 마크다운 관례를 사용해 취소선을 만들 수 있을까요?
1개의 좋아요
jrgong
(jrgong)
48
이 주제에 대해 한마디 보태겠습니다 
MD composer extras를 특정 그룹에만 표시할 수 있는 네이티브 옵션이 있으면 좋겠습니다. 저희 경우, 지금은 스태프에게만 추가 버튼들을 테스트해 보고 싶거든요.
지금은 nathan님의 코드에 body:not(.staff)를 추가해서 임시로 숨겼습니다:
// Hides unneeded buttons from the MD Composer Extras TC from non-staff users
body:not(.staff) .d-editor-button-bar {
.superscript_button,.subscript_button, .align_center_button,.align_right_button, .align_justify_button {
display: none;
}
}
다음 단계로는 각 개별 버튼에 대한 권한 설정이 있으면 좋겠습니다. 
2개의 좋아요
Lilly
(Lillian )
49
@jrgong 이 컴포넌트와 몇 가지 CSS를 추가하면 가능합니다.
CSS 예시로 제 그룹 내비게이션 메뉴 섹션 TC를 확인해 보세요. 사용자 카드에 링크가 있습니다.
5개의 좋아요
jrgong
(jrgong)
50
이게 아직 코어에 왜 안 들어갔지?
공유해줘서 고마워, 정말 감사해.
3개의 좋아요
Plugin이 이 테마 컴포넌트보다 여전히 장점이 있다는 말인가요?
저는 여전히 플러그인이 더 좋다고 생각하지만, 여기에 제시된 옵션이 마음에 드신다면 괜찮습니다.
2개의 좋아요
빠른 답변 감사합니다. 이유를 설명해 주시겠어요?
개인적인 의견이지만, 컴포넌트에 버튼을 너무 많이 추가한 것 같습니다.
플러그인은 기본 기능에 더 초점을 맞추고 있으며, bbcode 시스템도 더 간단합니다([wrap="center"] 대신 [center]를 사용). 하지만 컴포넌트는 확실히 설치하기가 더 쉽습니다.
4개의 좋아요
nathank
(Nathan Kershaw)
55
혹시 아직 보지 못하셨을 수 있으니 공유합니다:

3개의 좋아요
jrgong
(jrgong)
57
모든 버튼에 md-composer-extras CSS 클래스를 추가할 수 있을까요? 제 목표는 스태프가 아닌 사용자에게 모든 버튼을 한 번에 숨기는 것이며, 이렇게 하면 CSS 타겟팅이 훨씬 간단해질 것입니다.
이것이 가능한지 확실하지 않습니다. 플러그인 API 파일의 예제 코드를 보면, 이러한 모든 아이콘에 대해 일종의 루트 클래스를 추가하는 방법을 찾을 수 없었습니다. 제가 잘못 이해하고 있을 수도 있지만요.
api.onToolbarCreate(toolbar => {
toolbar.addButton({
id: 'pop-text',
group: 'extras',
icon: 'bolt',
action: 'makeItPop',
title: 'pop_format.title'
});
});
staff 클래스가 <body> 요소에 적용됩니다.
따라서 다음과 같이 모든 버튼을 대상으로 할 수 있습니다:
body:not(.staff) .d-editor-button-bar {
/* 모든 것 숨기기
* (팝업 메뉴 버튼을 포함한 표시되는 버튼)
*/
button,
.toolbar-popup-menu-options {
display: none;
}
}
body:not(.staff) .d-editor-button-bar {
/* 특정 버튼 숨기기 */
button {
/* 인라인 버튼 */
&.align_justify_button,
&.align_right_button
/* ... */
{
display: none;
}
/* 팝업 메뉴 */
&.toolbar-popup-menu-options {
[data-name="Float left"],
/* ... */ {
display: none;
}
}
}
}
도움이 될까요?
참고로, 이 컴포넌트에 관심이 있을 수 있습니다:
jrgong
(jrgong)
61
Hey Arkshine! 정말 도움이 됩니다! 그런데 제 생각에는 각 버튼에 md-composer-extras라는 CSS 클래스를 추가하는 것이 더 효율적인 방법일 것 같습니다. 그렇게 하면 모든 요소를 숨기기 위한 CSS 마크업이 매우 간단해집니다 
감사합니다! 사실 이미 그것을 사용 중입니다 