# Auto-Linkify Words

**URL:** https://meta.discourse.org/t/auto-linkify-words/82193
**Category:** Theme component
**Tags:** official, linkify-words
**Created:** [3월 5, 2018, 7:16오전 UTC](https://meta.discourse.org/t/auto-linkify-words/82193 "2018-03-05T07:16:06Z")
**Posts on this page:** 20
**Page:** 8

<div class="post-metadata">

### Author: ![ErikMH](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/erikmh/32/67551_2.png) [@ErikMH](https://meta.discourse.org/u/ErikMH)
#### Post date: [1월 8, 2020, 4:51오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/150 "2020-01-08T16:51:33Z")

</div>

Linkify가 제가 원하는 방식과 _거의_ 정확히 동일하게 작동합니다:

```
/TBI\s*\W?(\d*)/,https://tbi.example.com/tbi/$1/

```

이 규칙은 사용자가 다양한 형태로 입력하는 “TBI 번호”를 처리합니다:

- TBI 17
- TBI-17
- TBI17
- TBI -17
- TBI\*17
- 등

이러한 유연성을 좋아합니다.

불행히도, 이러한 번호를 입력하는 _공식적인_ 방식은 처리하지 못합니다:

- TBI #17

`#`(해시태그, 해시, 숫자 기호, 옥소포, 해시 마크, 파운드 기호, 틱택토 기호)을 올바르게 매칭하는 방법을 찾지 못하고 있습니다. 물론 아래처럼 시도해 보았지만 작동하지 않았습니다:

```
/TBI\s*#?(\d*)/,https://tbi.example.com/tbi/$1/
/TBI\s*\#?(\d*)/,https://tbi.example.com/tbi/$1/

```

심지어 완전한 와일드카드조차 작동하지 않습니다:

```
/TBI\s*.?(\d*)/,https://tbi.example.com/tbi/$1/

```

제 생각에는 카테고리 팝업 기능이 이 부분을 가로채 Linkify가 매칭 작업을 수행하지 못하게 하는 것 같습니다 — 사용자가 제시된 카테고리 중 하나를 선택하지 않은 경우에도 말이죠.

이것이 의도된 동작인가요, 아니면 버그인가요? 이를 우회하는 방법을 아시는 분이 계신가요?

---

<div class="post-metadata">

### Author: ![danekhollas](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/danekhollas/32/79637_2.png) [@danekhollas](https://meta.discourse.org/u/danekhollas)
#### Post date: [1월 8, 2020, 8:30오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/151 "2020-01-08T20:30:07Z")

</div>

네, HTML 소스 코드를 검사해 보면 Discourse는 해시로 시작하는 모든 텍스트를 별도의 span 요소에 배치하는 것 같습니다. 이로 인해 linkify 테마의 흐름이 깨집니다. 이 문제를 쉽게 해결하는 방법은 없는 것 같아 죄송합니다. ☹ 제 생각에는 테마를 포크한 후 이 특정 사례에 맞게 커스터마이징해야 할 것 같습니다. 다른 분이 더 좋은 아이디어를 가지고 있지 않는 한요.

---

<div class="post-metadata">

### Author: ![eextra](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eextra/32/170266_2.png) [@eextra](https://meta.discourse.org/u/eextra)
#### Post date: [1월 9, 2020, 2:16오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/152 "2020-01-09T14:16:14Z")

</div>

이 플러그인은 잘 작동합니다. 감사합니다. 하지만 abrify와 함께 사용할 때는 작동하지 않습니다.  
이 플러그인이 추가하는 클래스에서도 링크가 작동하도록 할 수 있을까요?  
 [GitHub - metabrainz/discourse-abbrify-words: Discourse theme component for automatically adding \<abbr\> to abbreviations and acronyms · GitHub](https://github.com/metabrainz/discourse-abbrify-words).

---

<div class="post-metadata">

### Author: ![danekhollas](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/danekhollas/32/79637_2.png) [@danekhollas](https://meta.discourse.org/u/danekhollas)
#### Post date: [1월 9, 2020, 2:50오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/153 "2020-01-09T14:50:47Z")

</div>

문제는 abbrify 플러그인이 기본적으로 링크 태그를 건너뛰기 때문인 것 같습니다. 코드를 수정하여 `head_tag.html`의 16번째 줄을 삭제하면 해결할 수 있습니다.

```
'a': 1,

```

> <https://github.com/metabrainz/discourse-abbrify-words/blob/a6651cf1c0a6d5233412f61b486cf256e36ffa1e/common/head_tag.html#L16>

해결되었는지, 또는 추가적인 도움이 필요한지 알려주세요. 🙂

---

<div class="post-metadata">

### Author: ![eextra](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eextra/32/170266_2.png) [@eextra](https://meta.discourse.org/u/eextra)
#### Post date: [1월 9, 2020, 2:54오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/154 "2020-01-09T14:54:14Z")

</div>

감사합니다. 잘 작동하는 것 같습니다.

참고로, GitHub에서 직접 수정하는 대신 CSS/HTML 템플릿에서만 수정하는 경우 차이가 있을까요?

---

<div class="post-metadata">

### Author: ![danekhollas](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/danekhollas/32/79637_2.png) [@danekhollas](https://meta.discourse.org/u/danekhollas)
#### Post date: [1월 9, 2020, 3:05오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/155 "2020-01-09T15:05:41Z")

</div>

네, Github에서 테마 컴포넌트를 업데이트할 때는 주의해야 합니다. 로컬의 CSS/HTML 변경 사항이 덮어쓰기되어 사라질 수 있습니다.

---

<div class="post-metadata">

### Author: ![eextra](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eextra/32/170266_2.png) [@eextra](https://meta.discourse.org/u/eextra)
#### Post date: [1월 9, 2020, 3:11오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/156 "2020-01-09T15:11:06Z")

</div>

감사합니다. abbrify 속성 대신 다른 클래스를 추가하는 방식으로 동일한 효과를 낼 수 있는지 궁금합니다. 예를 들어 dfn data-info나 span aria-label, 또는 이와 유사한 속성을 사용하는 경우 말이죠.

예를 들어 콘텐츠로 attr()를 활용하는 방식입니다.

---

<div class="post-metadata">

### Author: ![danekhollas](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/danekhollas/32/79637_2.png) [@danekhollas](https://meta.discourse.org/u/danekhollas)
#### Post date: [1월 9, 2020, 3:18오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/157 "2020-01-09T15:18:03Z")

</div>

네, 그렇습니다. `createAbbr` 함수(또는 linkify 테마의 해당 함수)를 직접 수정해 보실 수 있습니다.

> <https://github.com/metabrainz/discourse-abbrify-words/blob/a6651cf1c0a6d5233412f61b486cf256e36ffa1e/common/head_tag.html#L32>

---

<div class="post-metadata">

### Author: ![eextra](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eextra/32/170266_2.png) [@eextra](https://meta.discourse.org/u/eextra)
#### Post date: [1월 9, 2020, 3:30오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/158 "2020-01-09T15:30:04Z")

</div>

정말 좋습니다. 조금 더 직접 사용해 봐야겠어요.  
여기서 많은 가능성이 있을 것 같아요. json과 api를 여기서 어떤 방식으로 사용할 수 있는지 혹시 아이디어가 있으신가요?

예를 들어, api를 통해 워드프레스에서 abriffy 단어와 기타 데이터를 표시할 수 있도록 하는 것 같은 경우요?

---

<div class="post-metadata">

### Author: ![danekhollas](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/danekhollas/32/79637_2.png) [@danekhollas](https://meta.discourse.org/u/danekhollas)
#### Post date: [1월 9, 2020, 3:43오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/159 "2020-01-09T15:43:23Z")

</div>

무엇을 말씀하시는지 잘 모르겠습니다. 구체적으로 어떤 것을 이루고 싶으신지 더 자세히 말씀해 주시겠어요? 테마 컴포넌트는 Discourse 내에서만 작동하며, 다른 곳에서 사용하기 위한 API는 없습니다. 하지만 대부분은 JS 코드를 단순히 다른 곳으로 복사하고 Discourse에 특화된 부분을 수정하는 방식으로 사용할 수 있어야 합니다.

---

<div class="post-metadata">

### Author: ![jrgong](https://avatars.discourse-cdn.com/v4/letter/j/c57346/32.png) [@jrgong](https://meta.discourse.org/u/jrgong)
#### Post date: [2월 20, 2020, 12:42오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/160 "2020-02-20T12:42:58Z")

</div>

원박스(oneboxes)의 내용을 링크화되지 않도록 제외할 방법이 있나요?

---

<div class="post-metadata">

### Author: ![danekhollas](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/danekhollas/32/79637_2.png) [@danekhollas](https://meta.discourse.org/u/danekhollas)
#### Post date: [2월 20, 2020, 2:01오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/161 "2020-02-20T14:01:17Z")

</div>

건너뜀 태그 설정에 `<aside>` 태그를 추가해 보는 것도 좋습니다. 다만 모든 원박스가 `<aside>` 안에 배치되는지는 확신이 없습니다. 클래스 이름 기반의 필터가 필요할 수도 있겠네요.

@sam 이 문제에 대해 의견이 있으신가요? ⏫ 이는 합리적인 기본 동작(원박스 내 자동 링크 비활성화)으로 보입니다.

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [2월 21, 2020, 12:28오전 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/162 "2020-02-21T00:28:10Z")

</div>

클래스 기반 필터 설정은 완벽해 보입니다. 기본적으로 하나의 박스를 제외해야 합니다.

---

<div class="post-metadata">

### Author: ![danekhollas](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/danekhollas/32/79637_2.png) [@danekhollas](https://meta.discourse.org/u/danekhollas)
#### Post date: [2월 23, 2020, 7:28오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/163 "2020-02-23T19:28:00Z")

</div>

네, 다음 주에 PR을 제출해 보겠습니다.

---

<div class="post-metadata">

### Author: ![cherrot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/cherrot/32/170573_2.png) [@cherrot](https://meta.discourse.org/u/cherrot)
#### Post date: [2월 24, 2020, 9:52오전 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/164 "2020-02-24T09:52:46Z")

</div>

안녕하세요. 오늘 기본 `Light` 테마에 이 테마 컴포넌트를 성공적으로 설치했습니다. 하지만 제 환경에서는 작동하지 않습니다.

정규식(regex)과 기본 링크파이 단어(`discourse`와 `meta`)를 모두 시도해 보았지만, 모두 실패했습니다.

현재 `v2.3.0.beta2 +256` 버전을 사용하고 있습니다. 이 문제를 디버깅하는 데 도움이 될 팁이 있을까요? 미리 감사드립니다 🙂

---

<div class="post-metadata">

### Author: ![danekhollas](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/danekhollas/32/79637_2.png) [@danekhollas](https://meta.discourse.org/u/danekhollas)
#### Post date: [2월 28, 2020, 6:16오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/165 "2020-02-28T18:16:35Z")

</div>

최근 코드 리팩토링을 진행했으며, Discourse를 업데이트해야 할 수도 있습니다(2.4 버전이 방금 출시되었으므로 업데이트하는 것이 편리합니다 🙂)

---

<div class="post-metadata">

### Author: ![danekhollas](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/danekhollas/32/79637_2.png) [@danekhollas](https://meta.discourse.org/u/danekhollas)
#### Post date: [3월 10, 2020, 4:50오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/166 "2020-03-10T16:50:47Z")

</div>

원박스(Oneboxes)에서 링크 자동 생성(Linkify) 기능이 이제 기본적으로 비활성화됩니다. @jrgong 주제를 업데이트해 보시고 테스트해 주시겠어요?

> <https://github.com/discourse/discourse-linkify-words/pull/16>
>
> As per user request on meta: https://meta.discourse.org/t/linkify-words-in-post/…82193/160?u=danekhollas
> 
> By default, we will not autolink inside oneboxes.
> 
> The easiest way to test this is in quotes, by adding \`quote\` as an excluded class.
> 
> !\[image\](https://user-images.githubusercontent.com/9539441/75583097-46900480-5a6d-11ea-8a59-285350fdf07c.png)
> 
> FYI @SamSaffron

---

<div class="post-metadata">

### Author: ![tomtjes](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tomtjes/32/131271_2.png) [@tomtjes](https://meta.discourse.org/u/tomtjes)
#### Post date: [4월 14, 2020, 2:59오전 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/167 "2020-04-14T02:59:35Z")

</div>

> [@southpaw](#):
>
> 두 번째로 클릭한 바로 그 순간, 첫 번째 클릭이 처리되어 초록색 화살표가 사라졌습니다. 그 자리에 “초기화” 버튼이 나타났고, 이 버튼이 제 두 번째 클릭을 감지했습니다. 그렇게 제 링크 목록 전체가 사라졌고, 🙀 제 판단으로는 항목을 하나씩 다시 추가해야 했습니다.

이 문제가 아직 해결되지 않은 것 같습니다. 관리자 화면에서 구성 요소를 내보내면 백업을 만들 수 있다고 생각했는데, 내보내기 결과에 사용자 설정이 포함되지 않았습니다.

한 가지 아이디어가 있습니다. 모든 행을 포함하는 설정을 더블클릭하면 편집 가능한 텍스트 영역으로 바뀌도록 하면 어떨까요? `CSS/HTML 편집` 편집기와 비슷한 방식입니다. 이렇게 하면 백업/내보내기뿐만 아니라 항목을 한 줄에 하나씩 담아 목록을 가져오는 것도 쉬워질 것입니다.

이전:

 ![Screen Shot 2020-04-13 at 22.48.03](https://global.discourse-cdn.com/meta/original/3X/7/7/77e34da100d50c280a09a5d8068448b909929eb7.png)

더블클릭 시:

 ![Screen Shot 2020-04-13 at 22.51.41](https://global.discourse-cdn.com/meta/original/3X/8/7/87cc5e09f9d378c07ac3170722b79724fcee8742.png)

다른 이야기 하나 더: 이상한 정규식(Regex)을 볼 수 있을 텐데, 이러한 설정 필드에서는 `|`를 사용할 수 없습니다. 아마도 위의 제안으로 이 문제도 해결할 수 있을 것입니다.

---

<div class="post-metadata">

### Author: ![eextra](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eextra/32/170266_2.png) [@eextra](https://meta.discourse.org/u/eextra)
#### Post date: [5월 29, 2020, 2:46오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/168 "2020-05-29T14:46:53Z")

</div>

다시 만났네요, 친구! (linkify/abrify 플러그인)을 사용해 단어/링크를 이미지(들)로 변환하는 방법에 대해 어떻게 생각하세요?

---

<div class="post-metadata">

### Author: ![danekhollas](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/danekhollas/32/79637_2.png) [@danekhollas](https://meta.discourse.org/u/danekhollas)
#### Post date: [5월 29, 2020, 3:04오후 UTC](https://meta.discourse.org/t/auto-linkify-words/82193/169 "2020-05-29T15:04:40Z")

</div>

현재 플러그인으로는 불가능할 가능성이 높지만, `<a>` 대신 `<img>` 태그를 생성하도록 플러그인을 수정하는 것은 어렵지 않을 것입니다.

[이전 페이지](https://meta.discourse.org/t/auto-linkify-words/82193.md?page=7)

[다음 페이지](https://meta.discourse.org/t/auto-linkify-words/82193.md?page=9)