[블로그 운영팁]티스토리 다크 모드일 때 방문자 통계 그래프(플러그인) 색상 변경하기

티스토리 기준이며, 같은 그래프를 사용하는 곳이 있다면 비슷한 방식으로 적용하면 될 거 같습니다.

다크모드 or 어두운 테마를 사용 중인 블로그만 해당됩니다.

위치 : 티스토리 관리자 > 플러그인 > 방문자 통계 그래프 적용

위 방문자 통계 그래프를 사용할때 다크모드로 적용했을 경우 수치 색상이 묻혀서 잘 안 보이는 문제입니다.

해당 부분은 CSS로 수정이 가능합니다.

저같은 경우는 다크모드 적용 시 html에 color-thema="dark"가 삽입되도록 했기 때문에 다크모드일 때 CSS에 상속을 시켜서 다크모드일 때만 적용되도록 했습니다.

<html lang="ko" color-theme="dark"><head>

다크모드 버튼 클릭 or 디바이스 시스템 다크모드 (prefers-color-scheme: dark) 선택시 color-thema="dark"가 적용되도록 하는 구조입니다.

다크모드 방식은 본인이 적용한 구조에 맞게 수정해 주시면 됩니다. ex) body class="dark-mode" 등등

1. 티스토리 스킨편집 > CSS를 여시고, 아래처럼 CSS를 수정해 주세요.

[color-theme='dark'] #chartdiv g{
  fill:#ccc;
}

색상을 더 밝게 하고 싶다면 #fff로 주셔도 되며, 입맛 따라 수정하시면 됩니다.

테두리 색상은 아래처럼 수정하시면 됩니다.

[color-theme='dark'] #chartdiv g g{
  stroke:#666;
  stroke-opacity:0.5;
}

기본모드 색상은 굳이 바꾸실 필요는 없을 거 같고, 다크모드 색상만 변경해 주셔도 됩니다.

포인트는 #chartdiv g에 색상을 변경해 주는 것입니다.

1인 기업 라이프