안녕하세요
요컬 입니다.
오늘 포스팅할 주제는 바로
티스토리 북클럽 스킨 본문 제목의 배경을 어둡게 하는 방법에
대해서 포스팅 하려고 합니다.
꼭 바꿔야 하는 스킨 변경은 아니지만 가독성을 높이고
깔끔해 보이는 블로그를 원하시는 분들이라면 한번쯤
바꿔 볼만한 내용의 포스팅이니 천천히 따라와 주시면
되겠습니다 !
저희 포스팅 중 하나의 글입니다.
보이시는 것과 같이 포스팅 제목 뒤 배경이 밝아 본문 제목의 내용이
잘 보이지 않고 있습니다.
뒤에 배경을 어둡게해 본문 제목을 잘 보이게 만드는 방법
이제 시작합니다 !
우선 스킨 편집으로 들어가 html 편집으로 들어가 주세요.
CSS 편집 툴에 들어가
Ctrl + F 를 누르신 후 검색창에 post-cover 를 검색해 주세요
( 1052번 줄에서 찾으셔도 무방 합니다. )
사진에 보이시는 것과 같이 post-cover:before 를 찾아주시면 됩니다.
찾으셨다면 빨간 테두리로 표시되어 있는,
사진에 보이시는 것과 같이 뒷부분 0.25 부분을
0.85로 바꾸었습니다.
0 > 1 로 갈수록 어두워 지는 효과를 보실수가 있습니다
저는 0.85가 가장 적당해 0.85로 바꾸었지만
취향에 따라 어둡게, 혹은 밝게 변경해주시면 되겠습니다.
0.85로 바꾼 뒤 본문 제목 배경의 어둡기 입니다.
첫번째 사진과 다르게 확실히 어두워진 배경을 보실 수 있습니다.
여기서 저는 제목 위 아래가 너무 넓어 보이는것 같아 조금 줄이기로
했습니다.
보이시는 부분은 조금 전 편집 했던 1052 번줄 위에
위치한 1041번줄에 있습니다.
( post-cover 검색 하시면 첫번째로 확인되는 곳입니다. )
사진에 보이시는 것과 같이 빨간 테두리로 되어 있는 곳의
340px 부분을 250 px로 변경해주시면 됩니다.
변경 뒤 사진에 보이시는 것과 같이 처음 사진과 확연히 다르게
좁아진 것을 보실수 있습니다.
250px 미만으로 조절하시면 너무 좁아져 오히려 더 보기 싫은것 같아
저는 250px가 적당한 것 같습니다.
본문의 크기를 250px로 줄였지만 제목 밑에 본문 글이 보이기 전까지의
공백이 생긴것을 보실 수 있습니다.
이 부분 또한 줄여 주는 편집을 해보도록 하겠습니다.
이번엔 Ctrl + F 다음 padding를 검색해주세요.
( 440번줄 )
그 다음 사진에 표시해둔 빨간 테두리의 339px 부분을
200px로 변경해주었습니다.
구글 애드센스를 사용하고 계시는 분들은 본문 맨 위에
광고를 사용하시는데 그 광고 크기를 유지하기 위해서는
최소 150px 이상 이여야 하기 때문에 저 같은 경우에는
적당한 200px로 변경 했습니다.
댓글