요약:
- 저희 Discourse의 하이퍼링크에 Robustify 툴팁 팝업을 활성화하기 위해 JavaScript 및 CSS 링크를 통합하는 문제.
- 이전 사례와 몇 가지 유사점이 있지만, Robustify API를 조회하는 단계까지는 가지 않고 있습니다. 최종적으로 이 방향으로 가는 것이 합리적일 수 있지만, 당초에는 올바르게 래핑된 하이퍼링크에 대한 팝업만 활성화하는 것으로 시작할 계획이었습니다.
세부 내용:
저희 Discourse 포럼에 작은 CSS/JS 앱을 구현하는 방법에 대해, 아마도 단순한 질문일 것 같아 문의드립니다. 저희는 Mementoweb이 만든 훌륭한 작은 앱을 사용하려고 합니다. 이 앱은 페이지의 모든 하이퍼링크에 팝업 상자를 붙여, 링크가 더 이상 작동하지 않는 경우 해당 사이트 접근 또는 이전 캐시된 버전의 사이트 보기 중 하나를 선택할 수 있게 해줍니다. 정말 멋진 기능입니다! 몇 년 후 웹사이트로 돌아왔을 때 유지보수되지 않는 페이지로 연결되는 죽은 링크를 발견하는 등 필연적으로 발생하는 문제 중 일부를 해결할 수 있기를 기대하고 있습니다. 처음에는 Robustify 사이트에서(예시) 누군가가 수동으로 코드를 생성했을 때에만 작동하도록 하는 것을 시도해 보려고 했습니다.
이 앱은 몇 줄의 코드로 실행됩니다. 링크는 더 긴 a href 태그로 래핑되며, head 태그에는 CSS 스타일시트와 일부 JavaScript 코드에 대한 링크가 있습니다. Discourse가 JavaScript 커스터마이징을 허용하는지 약간 불확실했지만, 초보자 가이드를 읽고 수정을 위한 폭넓은 가능성을 확인하면서 큰 희망을 가졌습니다. 저희는 원격 테마(Sam’s Simple Theme)를 사용 중이며, 사이트 헤더에 새 컴포넌트로 코드를 추가해 보았습니다:
아직 이 작업을 성공적으로 완료하지는 못했지만, 어제 플러그인에 대해 조사하고 JS type 값을 *“text/discourse-plugin” version=“0.8.13”*으로 변경하면서 해결했다고 생각했습니다. 또한 CSS를 재위치시키는 것(DOI 대신 시트를 직접 링크, 태그를 CSS 공간에 직접 복사, Embedded CSS로 포함 등)에 대한 약간의 변수를 해결하기 위해 시도해 보았지만 성공하지 못했습니다 - 래핑된 링크가 있는 게시물은 여전히 팝업 없이 표시됩니다:
어떤 지침도 감사히 받겠습니다! 그 사이 해결책을 찾게 되면 이 게시물을 다시 올릴 것입니다.
아래 스크린샷을 첨부했는데, 바로 CSP 문제를 찾지는 못했지만 도움이 될 수 있다면 다른 기기로 시도해 볼 수도 있습니다:
