본문 바로가기
SKIN & CSS

티스토리 레터 스킨 바꾸기

글: 논어일기 2020. 11. 3.
반응형

화려함보다 간단함을 좋아한다. 스킨도 마찬가지다. 티스토리에서 제공하는 스킨 가운데 간단함이 돋보이는 편지(letter)를 하나씩 바꿔 나가려고 한다.

suhak_820.zip
1.36MB

1. 영어로 된 부분을 한글로 바꾼다.

admin -> 관리자; about me -> 이 블로그는; TAG -> 꼬리표

삭제 -> 지우기; 수정 -> 고치기; 확인 -> 남기기; 태그 -> 꼬리표; 인기 포스트 -> 인기글

2. 색을 무채색으로 바꾼다.

이것은 스킨 옵션에서 선택하여 쉽게 바꿀 수 있다. 

3. 이미지를 바꾼다.

이것은 손으로 그렸다.

관리
방명록
태그
쓰기

4. 수식 입력을 가능하게 한다.

<head> 요소 안에 아래와 같이 넣어 주면 라텍($\LaTeX$)으로 수식을 넣을 수 있다.

<script type="text/javascript" async src="cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-MML-AM_CHTML">

$$x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}$$

 

5. 글꼴을 바꾼다.

고딕보다는 명조가 좋아서 Noto Serif KR로 바꾸었다. 글꼴 이름에 세리프가 들어가면 명조체이다. 구글 폰트를 깔지 않은 사람도 제대로 보이도록 웹폰트도 함께 적용한다.

6. 블로그 이미지를 넣었다.

카테고리가 많지 않아 너무 밋밋한 느낌이라 블로그 이미지를 넣었다. 레터 스킨은 블로그 이미지를 따로 넣지 않아서 스킨자를 써서 skin.html에 아래와 같이 넣고 style.css 파일로 고쳤다. 이 그림은 딸이 그렸다.

딸이 그린 그림

<div class="area_menu"> <--! 메뉴를 누르면 왼쪽 옆에서 밀려나오는 부분-->
                <div class=blog_img>
                    블로그 이미지
                </div>   

          ......................................................

</div>

.blog_img img {
    width: 80px;
    margin: 40px 0 0 61px;
    border-radius: 40px; <!--테두리를 둥글게 만들었다.---//>
}

7. 그 밖에

  1. 몇몇 글꼴을 바꿨다. 라토(Lato)를 노토(Noto serif kr나 Noto sans kr)로 바꿨다.
  2. 커버와 리스트에서 더보기 단추를 없앴다.
  3. 본문 제목을 가운데 정렬하였다.
반응형