반응형 WordPress 테이블에 반복 헤더 추가

워드프레스 테이블은 여러 해 동안의 발전에도 불구하고 양날의 검과 같습니다. 데이터를 표시하기에는 완벽한 후보이지만 이야기를 전달하는 데는 적합하지 않습니다. 그것이 충분히 나쁘다고 생각한다면 스마트폰과 태블릿에 대해 들어보십시오. 이러한 장치에서는 데이터를 표시할 공간이 더 적습니다. 살아가야 할 몇 가지 테이블 단점이 있지만 반응성은 그 중 하나가 아닙니다.

마지막으로 WP Table Manager에 대한 주요 업데이트에서는 추가적인 반응형 옵션이 있는 테이블에 대한 새로운 반응형 디자인을 도입했습니다. 이제 반응형 테이블과 그 동작을 사용자 정의하는 데 도움이 되는 새로운 반응형 모드와 새로운 옵션을 추가한 더 새롭고 더 나은 버전의 워드프레스 테이블 관리자가 있습니다. 반복되는 헤더입니다.

반복되는 헤더가 있는 반응형 테이블

표(table)를 표시할 공간이 충분하지 않으면 어떻게 될까요? 이전 업데이트에서 WP Table Manager 는 반응형 옵션 두 가지를 제공했습니다. 스크롤 막대를 추가하거나 열을 숨기는 것입니다. 이 두 가지 모드 모두 나름의 용도가 있지만 가로 스크롤이나 데이터 숨기기를 원하지 않는 경우 새로운 세 번째 모드가 적합할 수 있습니다. 바로 반복 헤더입니다.

반복 헤더 반응형 모드는 다른 모든 모드와 마찬가지로 컴퓨터나 노트북과 같은 데스크톱 장치와 같이 공간이 충분한 경우 일반 테이블로 기본 설정됩니다. 공간이 충분하지 않으면 두 개의 열이 있는 더 간단한 테이블(테이블 헤더 및 행 값)로 축소됩니다.

실제로 이것은 테이블에 네 개의 열이 있는 경우 원본 테이블의 각 행이 반응형 버전에서 네 개의 새 행으로 표시됨을 의미합니다. 각 새 행에는 원래 헤더와 해당 데이터 값만 있습니다. 이 체계는 원본 표의 각 행에 적용되므로 항상 데이터 값 옆에 반복되는 헤더가 있습니다.

이 단순한 반응형 동작 덕분에 반복되는 헤더 테이블 모드를 사용하면 모바일 및 태블릿에서 어떻게 표시될지 걱정할 필요 없이 테이블에 원하는 만큼 데이터를 추가할 수 있습니다. 또한 WP Table Manager 는 작은 장치의 행에 대해 교대로 색상을 사용합니다. 원본 테이블의 각 행은 서로 다른 색상을 가져와 문맥을 유지하고 WordPress 독자가 레코드 간을 구분할 수 있도록 합니다.

반복 헤더 모드에서 반응형 테이블 사용자 지정

표를 편집할 때 반복 헤더 모드를 선택할 수 있습니다. 반응형 옵션을 형식 메뉴에서 선택한 다음 첫 번째 드롭다운에서 반복 헤더 모드를 찾습니다. 또한 반응형 중단점과 반응형 최대 높이라는 두 가지 방법으로 반복 헤더 표를 사용자 정의할 수 있습니다.

반응형 중단점은 WordPress 테이블 관리자 플러그인이 일반적인 방법으로 테이블 렌더링을 중지하고 대신 반응형 반복 헤더 모드로 전환하는 너비 이하입니다. 이 값은 WordPress 테마와 열 수에 따라 추정할 수 있습니다. 특정 너비 아래에 테이블이 맞지 않는다고 생각되면 중단점으로 사용합니다.

행이나 열이 많은 경우 반복되는 헤더 모드로 인해 페이지가 매우 길어질 수 있습니다. 반응형 최대 높이 기능은 반응형 모드에서 반복되는 헤더 테이블의 높이를 제한하여 이 문제를 해결합니다. 반응형 테이블이 너무 길면 WordPress 독자는 스크롤바를 사용하여 평소와 같이 더 많은 데이터를 볼 수 있습니다.

반응형 테이블에 대한 마법의 해결책은 없지만 WordPress 테이블에 대한 반복 헤더 모드가 근접합니다. 작은 테이블이 있거나 많은 행과 열이 있는 큰 테이블이 있든 WP Table Manager의 새로운 반복 헤더 모드를 통해 데이터가 장치에 관계없이 항상 적합합니다.