환영 링크 배너

커스터마이징 테마 컴포넌트
,
153

자, 이제 배너를 다시 표시할 수 있게 되었습니다. 그런데 이 배너가 채널을 방해하고 있어서 어떻게 우회할 수 있을까요? 채널이 표시될 때 URL이 변경될 것 같아서 CSS로 배너를 숨기는 방법을 고려해 보았지만, 실제로는 URL이 변경되지 않았습니다.

설정 페이지에서 모바일에서 배너를 비활성화하지 않고 이 문제를 해결하는 방법에 대한 팁이 있을까요?

업데이트: URL이 변경되지 않는다고 가정했던 제 생각이 틀렸습니다. URL에 제 카테고리 중 하나인 "General"이 포함되어 있어서 URL이 변경되지 않는다고 생각했던 것입니다. 그래서 ChatGPT의 도움으로 이 부분도 해결했습니다. 관심 있는 분들을 위해 공유합니다. (사실 이것은 모바일에서 채널을 방해하지 않도록 컴포넌트 자체에 포함되어 있을 수도 있는 기능입니다.)

import { apiInitializer } from "discourse/lib/api";

export default apiInitializer((api) => {
  api.onPageChange(() => {
    const chatPath = /^\/chat(\/|$)/;

    let attempts = 0;
    const maxAttempts = 10;

    function hideBanner() {
      const banner = document.querySelector('.welcome-link-banner-wrapper');
      if (banner) {
        banner.style.display = chatPath.test(window.location.pathname) ? 'none' : 'block';
      } else if (attempts < maxAttempts) {
        attempts++;
        setTimeout(hideBanner, 200);
      }
    }

    hideBanner();
  });
});

이 코드를 JS 탭에 Hide Welcome Banner on Channels (mobile)이라는 이름의 새 컴포넌트를 만들어 추가했습니다.

동작하는 것 같습니다. JavaScript에 정통한 분이 보시기에 조정하거나 개선할 수 있는 부분이 보인다면, 꼭 공유해 주세요.

1개의 좋아요
154

(제가 이해를 제대로 하고 있다면) display: block이 의도된 것이라면, 이것을 'block’으로 변경할 수 있습니다. 다만, 그렇게 해서 큰 차이가 날지는 확실하지 않습니다.

1개의 좋아요
155

감사합니다. 방금 변경했는데 여전히 작동하니까 block로 두겠습니다. 스크립트도 여기에서 업데이트했습니다.

1개의 좋아요