[티스토리 오디세이 스킨] 달력 커스텀 꾸미기, 일요일 빨간색/토요일 파란색

 

포스트 페이지의 글꼴 변경에 이어서 오디세이 스킨의 우하단에 위치한 달력을 마저 꾸며볼까요

칙칙쓰

일반적으로 달력이라하면 토요일은 파란색, 일요일 등 공휴일은 빨간색으로 표시되는게 기본인데, 오디세이 스킨에서는 모든 일자가 빨간색으로만 보여집니다. 이 부분이 거슬리니 바꿔봅시다!

 

티스토리 블로그에서 무언가를 꾸미고자 한다면 [블로그 관리 > 스킨 편집 > HTML 편집]으로 이동하셔야합니다. 여기 말곤 아무데서도 수정이 안됩니다.

HTML 편집화면으로 이동하셨으면, 우상단에 보이는 HTML | CSS | 파일업로드 중에서 CSS를 선택해 CSS 편집 모드로 들어갑니다.

CSS 편집 화면

 

CSS 편집기 내에서 [Ctrl + F] 키를 누르면 원하는 문자열을 검색할 수 있는데요, 여기서 [ .area-aside .box-calendar .inner-calendar table th ]를 검색해줍니다.

검색 결과

검색 결과 위와 같은 내용으로 검색한 문자열을 노란 배경색으로 표시해서 화면에 보여질건데요, 여기에 이제 일요일과 토요일에 색깔을 표시해주는 아래의 CSS를 추가해줍니다.

.area-aside .box-calendar .inner-calendar table td.cal_day.cal_day_sunday {
    color: red;
}
.area-aside .box-calendar .inner-calendar table td:last-child {
    color: blue;
}

추가 완료

만약 빨간색, 파란색 외의 다른 색상으로 변경하고자 할 경우 원하는 색상의 rbg값으로 변경해주면 된다. 예를 들면 #25abca으로 변경할 경우 예쁜 청록색이 된다. 네이버에서 rgb색상표를 검색하거나 그림판 프로그램 내에서 어렵지 않게 원하는 색상의 rgb값을 얻어올 수 있다.

 

728x90

 

모든 변경을 완료한 후 화면 우상단에 있는 [적용] 버튼을 누른 후 확인을 해보면 예쁘게 변경된 달력을 볼 수 있다! :)

이제 좀 달력같다