NoScript 사용자는 테마 커스터마이징에서 사용자 지정 푸터를 볼 수 없음

[adrelanos]

설정 > 사용자 지정 > 테마 > 구성 요소로 이동하여 포럼에 커스텀 헤더와 푸터를 구현했습니다. 여기서 표준 헤더 구성 요소를 설치하고 기본 테마와 연결했습니다. 그런 다음 이 구성 요소를 사용자 지정하여 “Header” 섹션에 특정 헤더 HTML을, “Footer” 섹션에 푸터 HTML을 추가했습니다.

자바스크립트가 활성화된 일반 사용자의 경우, 커스텀 헤더와 푸터가 모두 표시되어 모든 것이 올바르게 보입니다. 그러나 NoScript가 활성화된 상태, 특히 “Safest” 설정으로 Tor 브라우저를 사용할 때 커스텀 헤더가 콘텐츠 아래로 잘못 배치되고, 커스텀 푸터는 완전히 사라집니다—페이지 소스 코드에서도 찾을 수 없습니다.

임시 해결책으로, 구성 요소의 “Body” 섹션 내에 noscript 태그를 통합하고 이 noscript 태그 안에 커스텀 푸터 HTML을 다시 내장했습니다. 하지만 이것은 단순한 우회 조치일 뿐이며, 향후 깨질 가능성이 낮은 더 깔끔한 해결책을 원합니다.

버그 보고 / 기능 요청:

1. NoScript 사용자에게 커스텀 푸터가 표시되고 적절하게 렌더링되도록 보장하십시오.
2. NoScript 버전의 경우, 헤더는 콘텐츠 위에, 푸터는 콘텐츠 뒤에 나타나야 하며, 이는 자바스크립트가 활성화된 일반 페이지의 표시 순서를 따라야 합니다.

[Canapin (Coin-coin le Canapin)]

안녕하세요 Adrelanos

@adrelanos

여기서 표준 헤더 컴포넌트를 설치했습니다.

더 구체적으로 말씀해 주시겠어요? 이 "표준 헤더 컴포넌트"의 정확한 이름이 무엇인가요?

[adrelanos]

@Canapin

이 “표준 헤더 컴포넌트”의 정확한 이름은 무엇인가요?

관리자 → 사용자 정의 → 테마 → 컴포넌트 → 기본 → 컴포넌트 → 헤더 → HTML/CSS 편집 → 헤더

<div class="header-brand-nav">
    <a class="home" href="https://www.example.com">example</a>
    ... 더 많은 유사한 링크 ...
</div>

[Canapin (Coin-coin le Canapin)]

@adrelanos

커스텀 헤더는 콘텐츠 아래로 잘못 배치되고, 커스텀 푸터는 완전히 사라집니다—페이지 소스 코드에서도 찾을 수 없습니다.

재현할 수 있습니다.

[Canapin (Coin-coin le Canapin)]

@merefield

언제부터 테마 컴포넌트를 JavaScript 없이 사용할 수 있었나요?

여기서는 이 방법을 통해 테마의 헤더와 푸터에 HTML을 추가하는 것입니다:

[merefield (Robert)]

일부 테마 요소가 실제로는 사이트의 noscript 버전에도 표시된다는 것은 분명히 사실입니다.

지원될 것으로 의도된 수준에 대해 명확한 설명이 있으면 좋겠습니다.

에셋과 CSS는 다운로드되는 것 같지만, 다른 요소들에 대해서는 확실하지 않습니다.

[Canapin (Coin-coin le Canapin)]

문제를 좀 더 적절하게 정리해 보겠습니다:

1. 새로운 빈 테마 컴포넌트를 생성합니다.

2. Header에 <div style="padding: 30px; background: red;"></div>를 넣습니다.

3. Footer에 <div style="padding: 30px; background: green;"></div>를 넣습니다.

4. 홈 페이지로 이동한 후 페이지를 새로고침합니다.

5. 예상대로 빨간색 헤더가 d-header 위에 표시됩니다.
   

   

6. 아래로 스크롤하여 녹색 푸터가 나타나도록 합니다:
   

   
   
   푸터 부분이 약간 버그가 있는 것 같습니다. 아래로 스크롤하지 않아도 표시되어야 하는데, 스크롤 동작이 이상합니다. 커스텀 푸터에 도달하면 스크롤 움직임이 느려지는 것처럼 보입니다. 현재 문제와 관련이 없을 수 있으므로 새로운 주제에서 다루는 것이 필요할 수 있습니다.

7. 브라우저 개발 도구(Chrome)에서 오른쪽의 (설정)로 이동한 후, Preferences(설정) 탭을 선택하고 “Disable Javascript”(JavaScript 사용 안 함)를 체크합니다:
   

   

8. 페이지를 새로고침합니다: