구글블로그 동적뷰 사이드바 가젯 색상 변경

사진처럼 동적뷰에서 사이드바의 색상을 바꾸려면, 대쉬보드 → 템플릿 → 맞춤설정 → 고급 → Add CSS 에서 아래의 코드를 삽입합니다.

.gadget-icons, .gadget-title, .gadget-content, #gadget-dock, .gadget-menu, .ss{
background: red !important;
color: yellow !important;
}

코드에서 background로는 전체적인 색깔을, color로는 폰트의 색깔을 설정합니다.
색상은 우리가 흔히 알고 있는 6자리의 코드를 대신 입력해도 됩니다.
6자리 코드는 포토샵이나, 아니면 인터넷 사이트에서 찾으실 수 있습니다.
6자리 코드를 직접 입력한 예는 아래와 같습니다.

.gadget-icons, .gadget-title, .gadget-content, .ss {
background: #FF2B2B !important;
color: #FCD927 !important;
}

그림처럼 사이드바의 메뉴를 클릭했을 때 나타나는 문자의 색상 또한 변경할 수 있습니다. 그 변경 코드는 아래와 같고,

.gadget-icons a, .gadget-title a, .gadget-content a, .ss a{
color: white !important;
}

마찬가지로, 대쉬보드 → 템플릿 → 맞춤설정 → 고급 → Add CSS 에서 코드를 추가로 입력하면 됩니다. 색상은 마찬가지로 6자리수의 코드를 대신 입력해도 됩니다.

사이드바에 마우스를 커서를 올릴 때 생성되는 팝업 바의 색상과 폰트 색상도 따로 설정할 수 있습니다. 그 코드는 아래와 같습니다.

.gadget-title, .ss {
background: black !important;
color: white !important;
}

제 블로그는 드래그 방지가 설정되어 있습니다. 드래그 방지 때문에 복사가 힘드신 분들을 위해 구글 docs에 텍스트 파일을 올려두겠습니다.