# 테마 컴포넌트에서 원본 콘텐츠를 접근하는 방법?
**URL:** https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252
**Category:** Development
**Created:** [5월 3, 2020, 4:37오후 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252 "2020-05-03T16:37:14Z")
**Posts on this page:** 19
**Page:** 1
### Author:  [@magjac](https://meta.discourse.org/u/magjac)
#### Post date: [5월 3, 2020, 4:37오후 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/1 "2020-05-03T16:37:14Z")
테마 컴포넌트를 개발 중인데, 다음과 유사한 작업을 수행하고 싶습니다:
```plaintext
[code]
main() {
printf("Hello World!\n");
}
[/code]
```
위 코드는 다음과 같은 결과를 반환합니다:
```plaintext
main() {
printf("Hello World!\n");
}
```
이를 위해 [`api.decorateCooked()`](https://meta.discourse.org/t/developer-s-guide-to-discourse-themes/93648#heading--4-c-12)를 사용하고 있지만, 콘텐츠가 이미 쿡(cooked) 상태이므로 “불필요한” 공백이 제거되어 있습니다. 예를 들어, 위 예시에서 `printf` 앞의 공백이 사라진 것입니다.
**사용자가 입력한 “미쿡(uncooked)” 텍스트에 접근하는 방법은 무엇일까요?**
명확히 하자면, 제 테마 컴포넌트로 지원하고자 하는 기능은 사용자가 다음과 같은 내용을 작성할 수 있도록 하는 것입니다:
```plaintext
[mytag]
main() {
printf("Hello World!\n");
}
[/mytag]
```
제 테마 컴포넌트는 이를 이해하고 `[mytag] ... [/mytag]` 내부의 텍스트를 변환된 결과로 대체합니다.
---
### Author:  [@sam](https://meta.discourse.org/u/sam)
#### Post date: [5월 4, 2020, 2:48오전 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/2 "2020-05-04T02:48:23Z")
raw에 접근하려면 플러그인을 사용해야 합니다.
다만, `wrap` 헬퍼를 사용하면 div 요소를 활용할 수 있습니다.
```plaintext
[wrap=test]
hello world
[/wrap]
```
다음과 같이 렌더링됩니다:
```plaintext
```
---
### Author:  [@magjac](https://meta.discourse.org/u/magjac)
#### Post date: [5월 4, 2020, 4:22오전 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/3 "2020-05-04T04:22:23Z")
감사합니다.
무료 플랜으로 Discourse가 호스팅하는 Discourse 인스턴스에 커스텀 플러그인을 설치할 수 있을까요? 방법을 찾지 못했습니다.
테마 컴포넌트에 대한 raw 지원 구현이 가능할까요? 가능하다면, 이를 위한 PR을 받아 주시겠습니까?
wrap 헬퍼는 제가 요청한 기능을 수행하지 않습니다. 이 역시 들여쓰기를 제거합니다.
---
### Author:  [@sam](https://meta.discourse.org/u/sam)
#### Post date: [5월 4, 2020, 4:33오전 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/4 "2020-05-04T04:33:39Z")
아쉽게도 무료, 표준, 비즈니스 플랜에서는 사용자 정의 플러그인을 사용할 수 없습니다. 여러 고객을 호스팅하는 클러스터를 사용 중이며, 특정 고객만을 위해 플러그인을 실행할 수 있는 메커니즘이 없습니다.
테마 구성 요소를 통해 마크다운 확장 기능을 주입할 수 있는 기능을 지원할 수 있는지에 대해서는 과거에 생각해 본 적이 있지만, 이를 추가할 구체적인 계획은 없습니다. 구현하기가 매우 어려울 것입니다.
이중 래핑(double wrapping)은 어떨까요? 이는 بالتأكيد 모든 들여쓰기를 유지할 수 있습니다.
````plaintext
[wrap=test]
```
1
1
3
```
[/wrap]
````
아니면 다음과 같은 방법을 사용하는 것만으로도 작동할 수 있습니다. 이렇게 하면 작업할 수 있는 고유한 요소를 갖게 됩니다:
````plaintext
```custom
test
```
````
---
### Author:  [@magjac](https://meta.discourse.org/u/magjac)
#### Post date: [5월 4, 2020, 4:46오전 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/5 "2020-05-04T04:46:36Z")
저한테도 엄청 어려운 건가요, 아니면 구현에 대한 사전 지식이 없는 저 같은 사람에게만 그런 건가요? 난이도의 핵심은 어디에 있나요? 전체 마크다운 확장 기능보다는 원시 데이터에 대한 읽기 전용 접근처럼 더 간단한 것을 구현하는 게 더 쉬울까요?
네, 그건 하나의 선택지가 될 수 있겠네요. 감사합니다.
---
### Author:  [@sam](https://meta.discourse.org/u/sam)
#### Post date: [5월 4, 2020, 5:06오전 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/6 "2020-05-04T05:06:02Z")
> [@magjac](#):
>
> 완전한 마크다운 확장 기능 대신 raw 데이터에 대한 읽기 전용 접근과 같이 더 간단한 방식으로 구현하는 것이 더 쉬울까요?
프론트엔드에는 `raw` 게시글 내용이 전달되지 않습니다. 조리된(cooked) 버전만 전달됩니다. 이는 클라이언트로 전송되는 페이로드 크기를 줄여줍니다. 또한 서버가 최종적으로 마크다운에서 HTML로의 변환을 담당합니다. 만약 이 모든 작업을 브라우저에서 런타임에 수행한다면, 상당한 추가 비용이 발생하고 복잡한 보안 벡터에 대한 우려도 커질 것입니다.
---
### Author:  [@magjac](https://meta.discourse.org/u/magjac)
#### Post date: [5월 4, 2020, 11:44오전 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/7 "2020-05-04T11:44:50Z")
@sam 도움을 주셔서 감사합니다. 당신의 제안이 잘 작동했고, 사용자 입장에서도 꽤 괜찮은 구문을 제공해 주었어요:
🕶
---
### Author:  [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [5월 4, 2020, 12:01오후 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/8 "2020-05-04T12:01:49Z")
정확히 말하자면, 당신이 실제로 원하는 것이 커피라면 코드 블록을 세 개의 백틱(```)으로 감싸면 된다는 걸 알고 있죠? 당신의 예시가 어느 정도까지 비유인지 판단하기 어렵습니다.
---
### Author:  [@magjac](https://meta.discourse.org/u/magjac)
#### Post date: [5월 4, 2020, 12:09오후 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/9 "2020-05-04T12:09:02Z")
@pfaffman '커피 블록’이 무슨 뜻인지 모르겠지만, 세 개의 백틱(```)이 코드 블록을 생성한다는 것은 알고 있습니다.
제 예시가 왜 비유여야 하는지 모르겠네요. 대체 무엇을 위한 비유인가요? 제가 올린 이미지는 주어진 코드로 제 테마 컴포넌트가 어떤 것을 생성하는지 보여주기 위한 스크린샷입니다.
---
### Author:  [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [5월 4, 2020, 12:22오후 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/10 "2020-05-04T12:22:13Z")
죄송합니다. 제 모바일 키보드에서는 coffee와 code가 거의 같아서 문장을 쓸 때마다 항상 잘못 입력되고 있어요!
여러 번 살펴봤는데, 예시에서 당신의 이미지와 표준 코드 블록 사이에 어떤 차이가 있는지 알 수가 없네요.
---
### Author:  [@magjac](https://meta.discourse.org/u/magjac)
#### Post date: [5월 4, 2020, 12:27오후 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/11 "2020-05-04T12:27:43Z")
제 테마 컴포넌트가 추가한 그래프입니다.
---
### Author:  [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [5월 4, 2020, 12:31오후 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/12 "2020-05-04T12:31:47Z")
아! 그래프 언어용으로 TeX 대신 수학 플러그인 같은 걸 원하시는 거죠?
---
### Author:  [@magjac](https://meta.discourse.org/u/magjac)
#### Post date: [5월 4, 2020, 12:33오후 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/13 "2020-05-04T12:33:06Z")
네, 그런 것 같습니다. 수학 플러그인은 직접 확인해 보지는 못했지만, 개념적으로는 비슷해 보입니다. [Discourse Graphviz](https://meta.discourse.org/t/graphviz-plugin/97554) 의 기본 기능과 동일하지만, 이 플러그인은 그래프 사이의 애니메이션 전환과 같은 훨씬 고급 기능을 지원하며, 스타일과 동작을 제어할 수 있는 다양한 옵션을 제공합니다.
---
### Author:  [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [5월 4, 2020, 12:36오후 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/14 "2020-05-04T12:36:04Z")
또한 [Discourse Graphviz](https://meta.discourse.org/t/graphviz-plugin/97554) 도 있지만, 플러그인을 설치할 수 없으므로 이 문제가 해결되지 않을 것 같습니다.
---
### Author:  [@magjac](https://meta.discourse.org/u/magjac)
#### Post date: [5월 4, 2020, 12:43오후 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/15 "2020-05-04T12:43:01Z")
관심 있으시면 [GitHub 저장소](https://github.com/magjac/discourse-d3-graphviz)를 확인해 보세요. 사용법에 대한 상세한 문서를 먼저 작성해야 하기 때문에 아직 공식적으로 어디에도 배포되지 않았습니다.
---
### Author:  [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [5월 4, 2020, 12:45오후 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/16 "2020-05-04T12:45:09Z")
그렇게 하면 작동하는 것 같고, 아마도 제가 놓친 부분이 있는 것 같지만, 해결책은 변경 사항을 PR로 제출한 후 비즈니스 플랜에서 사용 가능하도록 하는 것입니다.
---
### Author:  [@magjac](https://meta.discourse.org/u/magjac)
#### Post date: [5월 4, 2020, 12:57오후 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/17 "2020-05-04T12:57:22Z")
죄송합니다, 말씀하신 내용을 잘 이해하지 못하겠습니다. 이것은 테마 컴포넌트이며, 어떤 플랜을 사용 중이든 웹 인터페이스를 통해 관리자라면 어떤 Discourse 인스턴스에든 설치할 수 있습니다.
---
### Author:  [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [5월 4, 2020, 1:44오후 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/18 "2020-05-04T13:44:45Z")
아마 내가 제대로 이해하지 못한 것 같습니다. 하지만 당신이 하려는 일은 graphviz 플러그인을 확장하여 더 많은 graphviz 기능을 지원하고, 그 기능들이 해당 플러그인에 통합되는 것이 더 합리적이라는 것 같다는 인상을 받았습니다.
하지만 정확히 무엇을 원하시는지 잘 모르겠어서, 제 추측이 완전히 틀렸을 수도 있습니다.
---
### Author:  [@magjac](https://meta.discourse.org/u/magjac)
#### Post date: [5월 4, 2020, 1:55오후 UTC](https://meta.discourse.org/t/how-to-access-the-uncooked-content-from-a-theme-component/150252/19 "2020-05-04T13:55:25Z")
이제 말씀하신 내용을 이해했습니다. 아니, 무료 플랜을 사용 중이므로 해당 플러그인을 사용할 수 없었고, 그래서 대신 테마 컴포넌트를 개발했습니다. 추가 기능은 기존 플러그인과 다른 라이브러리를 기반으로 하기 때문에 쉽게 추가할 수 있는 일종의 보너스였습니다.
플러그인과 테마 컴포넌트는 매우 다르기 때문에 두 사이에서 코드를 재사용하는 것은 불가능하다고 생각합니다. 하지만 관심이 있는 사람이 기존 플러그인에 동일한 기능을 추가하는 것은 가능할 것 같습니다.