토픽에 PGN 파일을 임베드하려고 합니다. 이를 위해 토픽에 CSS와 JavaScript를 포함해야 합니다. 토픽에서 CSS와 JavaScript를 어떻게 사용할 수 있는지 알려주시면 감사하겠습니다.
5개의 좋아요
이것은 Discourse에서 불가능합니다. PGN 파일이 무엇인지, 목표를 좀 더 명확하게 설명해 주실 수 있나요?
4개의 좋아요
PGN은 Portable Game Notation(이동용 게임 표기법)을 의미합니다. 일반적으로 체스 게임의 모든 수를 텍스트 형식으로 내보낼 수 있으며, PGN 리더를 사용하여 이를 읽고 게임을 다시 재생할 수 있습니다.
일반적으로 다음과 같은 형태를 띱니다:
[Event "World Championship 28th"]
[White "Spassky, Boris V"]
[Black "Fischer, Robert James"]
[Site "Reykjavik"]
[Result "1–0"]
[Date "1972.08.06"]
[WhiteElo "2660"]
[BlackElo "2785"]
1. e4 c5 2. Nf3 d6 3. d4 cxd4 4. Nxd4 Nf6 5. Nc3 a6 6. Bg5 e6 7. f4 Qb6 8. Qd2 Qxb2 9. Nb3 Qa3 10. Bxf6 gxf6 11. Be2 h5 12. 0-0 Nc6 13. Kh1 Bd7 14. Nb1 Qb4 15. Qe3 d5 16. exd5 Ne7 17. c4 Nf5 18. Qd3 h4 19. Bg4 Nd6 20. N1d2 f5 21. a3 Qb6 22. c5 Qb5 23. Qc3 fxg4 24. a4 h3 25. axb5 hxg2+ 26. Kxg2 Rh3 27. Qf6 Nf5 28. c6 Bc8 29. dxe6 fxe6 30. Rfe1 Be7 31. Rxe6
4개의 좋아요
확실히 재미있는 플러그인이 될 것 같아요! 이 토픽에 “풀 리퀘스트 환영” 태그를 추가하겠습니다.
5개의 좋아요
chess.com 같은 사이트에서 게임 노트를 게시한 후, 웹사이트에 사용할 수 있는 임베드 코드를 가져오는 것이 가능할까요?
6개의 좋아요
Chess.com만 그런 게 아닙니다.
온라인 체스 플랫폼 어디에서든 게임을 할 수 있어요. 내 포럼에 PGN을 복사해서 올릴 수 있어야 합니다.
@codinghorror님,
이런 플러그인이 있으면 정말 좋겠어요 
2개의 좋아요
이 기능이 얼마나 니치한 건지 알고 있나요?
이건 discourse의 기능이 되어서는 안 됩니다. 포럼의 98%는 이걸 절대 사용하지 않을 테니까요.
3가지 옵션이 있습니다:
- 직접 코드를 작성하세요
- 코드를 작성할 사람을 고용하세요
- 제가 13시간 전에 제공한 해결책을 사용하세요. 이걸로 문제가 해결됩니다
1개의 좋아요
@Monkey 님
네, 말씀이 정확히 맞습니다.
저희는 15년 동안 매우 기술적인 포럼(unix, linux)을 운영해 왔는데, 회원 중 체스 플레이어가 꽤 많았지만(저도 포함) 포럼에서는 아무도 체스에 관심이 없었습니다(수년간 체스 관련 플러그인을 여러 개 설치해 보았지만요).
가장 잘 작동했던 방식은 단순히 체스나 체스 전반에 관심이 있는 회원들이 그 유명한 온라인 체스 사이트 중 하나에서 만나게 하는 것이었습니다.
따라서, 훌륭한 대안들이 많이 존재하기 때문에 포럼에서 체스를 두는 것은 매우 작은 니치 시장임을 확인할 수 있습니다.
매우 인기 있는 온라인 체스 사이트 중 하나의 코드를 임베드하는 것이 좋은 방향이라고 생각합니다. 저도 동의합니다.
4개의 좋아요
Hey @neounix,
기술 포럼을 운영하고 계시므로, 당신의 청중은 체스에 관심이 없을 수 있습니다.
저는 체스 플레이어와 애호가들이 체스 수에 대해 많은 시간을 들여 토론하고 논쟁하는 스포츠 및 게이밍 포럼을 운영할 수 있습니다. 이는 당신의 대상 청중이 누구인지에 따라 달라집니다. 스포츠 포럼을 운영한 적이 없기 때문에, 제 요구 사항에 대해 검증하고 확인하려는 당신의 시도는 매우 근시안적이며, 제 요청에 대해 당신의 검증은 타당하지 않습니다.
Hi @Monkey,
PGN을 호스팅하기 위한 자바스크립트 기반 임베드는 이미 많이 있습니다. 그러나 Discourse는 현재 게시글에서 자바스크립트 임베드를 지원하지 않으며, iFrame 임베드만 허용합니다. 따라서 Discourse가 PGN을 위한 플러그인을 제공하고자 한다면, 많은 스포츠 기반 포럼을 유치할 것이라고 확신합니다.
Discourse의 고객 목록에 스포츠 관련 및 게이밍 관련 포럼이 많이 있다면, 체스 관련 플러그인이 니치 기능이 아니라고 생각합니다.
당신이 제공한 솔루션은 우리가 chess.com 스트림을 사용할 수 있게 할 뿐입니다. 그러나 이는 차별화를 이루는 데 도움이 되지 않습니다. 많은 플레이어들이 단순히 Chess.com의 일일 퍼즐을 호스팅할 것이기 때문입니다. 따라서 당신의 제안은 실제로 제 문제를 해결하는 솔루션이 아닙니다.
3개의 좋아요
저는 체스 애호가이고, 핀란드 체스 포럼이 Discourse로 전환하도록 장려해 왔습니다. 그래서 이 주제에 대해 최근 꽤 깊이 파고들어 직접 테스트도 해 봤습니다. 제 최우선 추천은 누군가 이미 언급했듯이 Discourse의 내장 iframe 기능을 활용하는 것입니다. 관리자 설정에서 allowed iframes를 찾아 chess.com, lichess.org, 그리고 몇몇 다른 사이트를 화이트리스트에 추가하면 됩니다. 해당 사이트들은 모두 자체적으로 iframe을 지원합니다. 그러면 사용자가 다음과 같은 문자열을 복사해서 붙여넣기만 하면 됩니다:
iframe src="https://lichess.org/embed/jYSkjcuG?theme=auto&bg=auto" width=600 height=397 frameborder=0></iframe>
정말 멋진 박스가 생성됩니다. 이 박스에는 체스 기판과 게임을 오가며 볼 수 있는 화살표가 표시됩니다. 원본에 댓글이 있다면 그것도 함께 표시됩니다. 만약 상대방이 예를 들어 엔진으로 게임을 분석하기 위해 PGN 파일이 정말 필요하다면, 원본 사이트에서 해당 파일에 접근할 수 있습니다. 사용자에게 조금만 교육해 주면, 그들은 이 기능을 정말 좋아하게 될 것입니다.
6개의 좋아요
@rizka 님, 안녕하세요.
매우 이상한 상황이 발생했습니다.
미리보기에서는 iFrame 임베드를 볼 수 있습니다. 하지만 게시글을 저장하면 iFrame 임베드가 표시되지 않습니다. 제가 놓치고 있는 부분이 있을까요?
게시글 저장 후 스크린샷:
브라우저 콘솔에서 오류가 표시됩니까? (CSP와 관련된 오류일 수 있습니다)
다음과 같은 오류가 발생했습니다:
A cookie associated with a cross-site resource at https://lichess.org/ was set without the `SameSite` attribute. It has been blocked, as Chrome now only delivers cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032.
설정을 SameSite=None으로 변경했는데도 문제가 해결되지 않습니다.
현재 임베딩하고 있는 사이트(https://lichess.org/)가 다른 사이트가 자신의 쿠키를 사용할 수 있도록 허용하기를 원한다면, 해당 설정을 쿠키에 추가해야 한다고 생각합니다. 그렇지만 iframe이 표시되지 않는 이유가 이것이 맞는지 확신은 없습니다(보통 쿠키는 세션이나 광고에 사용되므로, iframe에 세션이 없더라도 로드될 것이라고 생각합니다).
업데이트
해당 사이트가 허용하는 것 같습니다.
또한 미리보기에서도 확인할 수 있으며, 여기 discourse meta에 iframe을 직접 추가하면(브라우저 인스펙터를 통해 HTML에 직접 삽입) 아래 이미지처럼 작동합니다:
브라우저 인스펙터를 사용하여 페이지에 직접 추가해 보시는 것을 권장합니다. 작동하지 않는다면 CSP 규칙이나 discourse가 iframe을 차단하고 있을 수 있습니다(CSP의 경우 브라우저 콘솔에서 오류나 경고가 표시되어야 합니다).
여기 meta에서 iframe을 포함하려고 하면 빈 게시글이 표시됩니다(미리보기조차 볼 수 없으며):
<iframe src="https://lichess.org/tv/frame?theme=wood&bg=light" style="width: 400px; height: 444px;" allowtransparency="true" frameborder="0"></iframe>
업데이트 2
allowed_iframes 사이트 설정이 찾으시는 것일 수 있습니다(해당 도메인에서 iframe을 허용하기 위해):
try.discourse.org에서 lichess.org iframe을 일시적으로 활성화했으니, 누구나 해당 환경에서 동작을 테스트해 볼 수 있습니다:
일일 리셋까지 유지됩니다.
Firefox에서 Chrome보다 더 잘 보입니다:
Chrome:
5개의 좋아요
안녕하세요 @supermathie,
iframe 임베드 대신 다음과 같은 JavaScript 코드를 사용하고 있습니다:
<link rel="stylesheet" type="text/css" href="https://pgn.chessbase.com/CBReplay.css" />
<div class="cbreplay">
[Event "World Championship 28th"]
[White "Spassky, Boris V"]
[Black "Fischer, Robert James"]
[Site "Reykjavik"]
[Result "1–0"]
[Date "1972.08.06"]
[WhiteElo "2660"]
[BlackElo "2785"]
1. e4 c5 2. Nf3 d6 3. d4 cxd4 4. Nxd4 Nf6 5. Nc3 a6 6. Bg5 e6 7. f4 Qb6 8. Qd2 Qxb2 9. Nb3 Qa3 10. Bxf6 gxf6 11. Be2 h5 12. 0-0 Nc6 13. Kh1 Bd7 14. Nb1 Qb4 15. Qe3 d5 16. exd5 Ne7 17. c4 Nf5 18. Qd3 h4 19. Bg4 Nd6 20. N1d2 f5 21. a3 Qb6 22. c5 Qb5 23. Qc3 fxg4 24. a4 h3 25. axb5 hxg2+ 26. Kxg2 Rh3 27. Qf6 Nf5 28. c6 Bc8 29. dxe6 fxe6 30. Rfe1 Be7 31. Rxe6
</div>
이런 종류의 코드를 게시글에 임베드하는 데 사용할 수 있을까요? 제 사용자 중 상당수는 제3자 웹사이트에 가서 iframe을 생성하는 것보다 이러한 스크립트를 단순히 복사해서 붙여넣는 방식을 선호합니다.
네, 가능합니다!
이걸 테마 컴포넌트로 만들기 위해 필요한 모든 요소를 거의 다 갖추신 것 같습니다. (테마 컴포넌트로 이 작업이 가능하다고 생각하지만, 제가 테마 컴포넌트에 대해 매우 익숙하지는 않으므로 이 말을 절대적인 사실로 받아들이지 마세요.)
다음 단계는 @Monkey님이 제안하신 대로 직접 코딩을 하거나, 누군가를 고용해서 작업을 맡기는 것 중 하나일 것입니다.
(테마 컴포넌트에 대해 배우기 위해 이 작업을 직접 해보고 싶지만, 당장 시간을 내기 어렵습니다.)
5개의 좋아요
네, 이 프로젝트 기반으로 할 수 있을 것 같습니다:
GitHub에 몇 가지가 있지만, 이 프로젝트는 그 중에서도 대표적인 하나입니다.
커스텀 BBCode와 결합하세요: Developer's guide to Markdown extensions
Ember 렌더링 파이프라인에 이걸 통합할 때 발생할 수 있는 함정들에는 주의해야 합니다 …
@supermathie 님의 말씀이 맞습니다 - 이 분야에 익숙해지고 구현에 시간을 들일 의향이 있는 열정적인 개발자를 찾거나, Marketplace 채널에서 누군가를 고용해야 합니다.
4개의 좋아요
Hey @merefield,
스크립트를 포함하도록 테마를 커스터마이징했습니다:
<link rel="stylesheet" type="text/css" href="https://pgn.chessbase.com/CBReplay.css" />
CSS "https://pgn.chessbase.com/CBReplay.css"를 화이트리스트에 추가하여 임베드를 허용했습니다.
하지만 스크립트를 게시글에 복사해서 붙여넣으면 Div 태그가 무시되고 텍스트만 표시됩니다.
<div class="cbreplay">
[Event "World Championship 28th"]
[White "Spassky, Boris V"]
[Black "Fischer, Robert James"]
[Site "Reykjavik"]
[Result "1–0"]
[Date "1972.08.06"]
[WhiteElo "2660"]
[BlackElo "2785"]
1. e4 c5 2. Nf3 d6 3. d4 cxd4 4. Nxd4 Nf6 5. Nc3 a6 6. Bg5 e6 7. f4 Qb6 8. Qd2 Qxb2 9. Nb3 Qa3 10. Bxf6 gxf6 11. Be2 h5 12. 0-0 Nc6 13. Kh1 Bd7 14. Nb1 Qb4 15. Qe3 d5 16. exd5 Ne7 17. c4 Nf5 18. Qd3 h4 19. Bg4 Nd6 20. N1d2 f5 21. a3 Qb6 22. c5 Qb5 23. Qc3 fxg4 24. a4 h3 25. axb5 hxg2+ 26. Kxg2 Rh3 27. Qf6 Nf5 28. c6 Bc8 29. dxe6 fxe6 30. Rfe1 Be7 31. Rxe6
</div>
게시글에서 이 스크립트를 사용하려면 추가로 해야 할 일이 있나요? 조언을 부탁드립니다.
지금은 이걸 볼 시간이 없어요. 제가 제안한 대로 해주세요.