# 답글 버튼 앞에 배너/HTML(위젯) 추가

**URL:** https://meta.discourse.org/t/add-banner-html-widget-before-reply-button/291404
**Category:** Development
**Created:** [1월 12, 2024, 7:47오전 UTC](https://meta.discourse.org/t/add-banner-html-widget-before-reply-button/291404 "2024-01-12T07:47:49Z")
**Posts on this page:** 6
**Page:** 1

<div class="post-metadata">

### Author: ![OrkoGrayskull](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/orkograyskull/32/275883_2.png) [@OrkoGrayskull](https://meta.discourse.org/u/OrkoGrayskull)
#### Post date: [1월 12, 2024, 7:47오전 UTC](https://meta.discourse.org/t/add-banner-html-widget-before-reply-button/291404/1 "2024-01-12T07:47:49Z")

</div>

현재 저는 스레드의 첫 번째 게시물 뒤에 배너/링크를 표시하기 위해 다음 위젯을 사용하고 있습니다. 지금까지는 잘 작동하고 있습니다:

```plaintext
<script type="text/discourse-plugin" version="0.8">
    const { iconNode } = require("discourse-common/lib/icon-library");
    api.decorateWidget("post:after", helper => {
        const firstPost = helper.attrs.firstPost;
        const h = helper.h;
        if (firstPost) {
            return h("div#support", [
                h(
                    'a.icon', {
                        href:'link',
                        title: 'Support-Icon'
                    }, iconNode('heart')),
                h(
                    'a.link', { 
                        href: "link",
                        title: 'Support-Link'
                    }, 'some text',
                ),
            ]);
        }
    });
</script>

```

하지만 저는 배너/링크를 다른 위치에 통합하고 싶습니다. 즉, 답변 버튼 바로 앞입니다. 아래에서 해당 위치를 빨간색으로 표시해 두었습니다:

 ![banner](https://global.discourse-cdn.com/meta/original/4X/9/5/1/9514cd0623843e35336758af77a8c276f4b4f0d5.png)

이것을 구현하는 방법에 대한 팁을 주실 수 있을까요?

위치가/역할이 이것으로 정의된다는 것은 알고 있습니다. 문제는 이 `NAME:LOCATION`을 어떻게 찾는가입니다:

`api.decorateWidget("NAME:LOCATION", helper => {`

---

<div class="post-metadata">

### Author: ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [1월 12, 2024, 8:17오전 UTC](https://meta.discourse.org/t/add-banner-html-widget-before-reply-button/291404/2 "2024-01-12T08:17:00Z")

</div>

> [@OrkoGrayskull](#):
>
> 첫 번째 게시물 이후

> [@OrkoGrayskull](#):
>
> ![banner](https://global.discourse-cdn.com/meta/original/4X/9/5/1/9514cd0623843e35336758af77a8c276f4b4f0d5.png)

그림에서 표시한 위치는 해당 토픽의 모든 게시물 이후입니다. 따라서 답글이 있는 경우 배너는 첫 번째 게시물 바로 아래가 아니라, 그 답글들 아래에 표시됩니다.

---

<div class="post-metadata">

### Author: ![piffy](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/piffy/32/254198_2.png) [@piffy](https://meta.discourse.org/u/piffy)
#### Post date: [1월 12, 2024, 8:17오전 UTC](https://meta.discourse.org/t/add-banner-html-widget-before-reply-button/291404/3 "2024-01-12T08:17:57Z")

</div>

여기에는 `topic-above-footer-buttons`라는 플러그인 아웃렛이 있습니다.

 ![image](https://global.discourse-cdn.com/meta/original/4X/c/e/5/ce51712b72492e357043b45a835faa1fd18d1034.png)  
이 링크에서 위치를 확인할 수 있습니다: [(deprecated) Plugin outlet locations theme component](https://meta.discourse.org/t/plugin-outlet-locations-theme-component/100673)

그 다음 이 가이드를 따르세요:

> [@Using Plugin Outlet Connectors from a Theme or Plugin](https://meta.discourse.org/t/using-plugin-outlet-connectors-from-a-theme-or-plugin/32727):
>
> Discourse includes hundreds of Plugin Outlets which can be used to inject new content or replace existing contend in the Discourse UI. ‘Outlet arguments’ are made available so that content can be customized based on the context. Choosing an outlet To find the name of a plugin outlet, search Discourse core for “\<PluginOutlet”, or use the [plugin outlet locations](https://meta.discourse.org/t/plugin-outlet-locations-theme-component/100673) theme component. (e.g. topic-above-posts). Wrapper outlets Some outlets in core look like \<PluginOutlet @name="foo" /\>. These allow you…

---

<div class="post-metadata">

### Author: ![OrkoGrayskull](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/orkograyskull/32/275883_2.png) [@OrkoGrayskull](https://meta.discourse.org/u/OrkoGrayskull)
#### Post date: [1월 12, 2024, 9:40오전 UTC](https://meta.discourse.org/t/add-banner-html-widget-before-reply-button/291404/4 "2024-01-12T09:40:51Z")

</div>

감사합니다. 작동했습니다.

Head용 코드 예시:

```plaintext
<script type='text/x-handlebars' data-template-name='/connectors/topic-footer-main-buttons-before-create/team-support'>
	<div id="support">
		<a href="link" title="Support-Icon" class="icon">
			<svg class="fa d-icon d-icon-heart svg-icon svg-node" aria-hidden="true"><use xlink:href="#heart"></use></svg>
		</a>		
		<a href="link" title="Support-Link" class="link">text</a>
    </div>
</script>

```

---

<div class="post-metadata">

### Author: ![OrkoGrayskull](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/orkograyskull/32/275883_2.png) [@OrkoGrayskull](https://meta.discourse.org/u/OrkoGrayskull)
#### Post date: [1월 19, 2024, 6:55오전 UTC](https://meta.discourse.org/t/add-banner-html-widget-before-reply-button/291404/5 "2024-01-19T06:55:52Z")

</div>

안타깝게도 해당 버튼/배너는 사용자가 로그인한 상태일 때만 표시됩니다. 미등록 사용자에게도 버튼/배너가 표시되도록 하려면 어떻게 해야 하나요?

다음 테마 위치를 사용하고 있습니다: `topic-footer-main-buttons-before-create`

---

<div class="post-metadata">

### Author: ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)
#### Post date: [2월 18, 2024, 6:56오전 UTC](https://meta.discourse.org/t/add-banner-html-widget-before-reply-button/291404/6 "2024-02-18T06:56:03Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.