안녕하십니까?
이번 포스팅에서는 티스토리 블로그 북클럽(Book Club) 스킨을 기준으로 헤더(header) 부분의 블로그 이름 글자 폰트 설정 방법에 대해서 소개해드리겠습니다. 평소 티스토리 북클럽(Book Club) 스킨을 이용하시는 분들 중 헤더(header) 부분의 블로그 이름 글자 폰트를 수정하시고 싶으셨던 분들이 이 포스팅을 끝까지 읽어보신다면 많은 도움되실 거라 기대됩니다. 초보자분들도 이해하고 따라하실 수 있도록 하나하나 아주 쉽고 자세하게 설명드릴 테니 그대로만 따라해주신다면 어느덧 헤더(header) 부분 블로그 이름 글자 폰트 설정이 완료되어 있을 겁니다.
-
헤더(header) 부분의 블로그 이름 글자 폰트 종류 설정 방법
1. 티스토리 블로그 홈 화면에서 '관리자' 페이지에 접속해줍니다.
2. 좌측 사이드바의 '꾸미기' 카테고리의 '스킨 편집' 항목을 클릭해줍니다.
3. 좌우로 분할된 화면에서 좌측 '스킨 편집' 화면에서 'html 편집'을 눌러줍니다.
4. 상단의 카테고리 중 'CSS' 카테고리로 접속합니다.
5. '#header h1' 부분을 찾아줍니다.
'CSS' 카테고리 화면상의 임의의 한 지점을 클릭한 후 [Ctrl] 키와 [F] 키를 동시에 누르면 나오는 검색창에 '#header h1' 부분 그 자체 또는 그 일부 'header'를 입력한 뒤 [Enter] 키를 눌러주십시오. 그다음 노란색으로 음영 처리되는 부분을 중심으로 '#header h1' 부분을 찾아주시면 되겠습니다.
6. 'font-family' 부분의 내용을 설치되어 있는 폰트 종류 중 원하는 종류로 설정해줍니다.
이 포스팅에서는 설치된 글씨체 중 '넥슨 배찌체'로 설명을 하기 위해 'Bazzi'로 설정해보겠습니다.
설치된 폰트를 확인하는 방법은 검색창을 이용해서 그림과 같이 'Web Font Load' 부분을 확인해주시면 됩니다.
폰트를 설치하는 방법을 모르시는 분은 아래 포스팅을 참고해주십시오.
티스토리 북클럽(Book Club)스킨 폰트 크기/행간 간격/폰트 종류 일괄 적용 설정하는 방법
티스토리 북클럽(Book Club)스킨 폰트 크기/행간 간격/폰트 종류 일괄 적용 설정하는 방법
안녕하십니까? 티스토리를 개설하고 북클럽(Book Club) 스킨을 사용하면서 발행하는 글 접속 시 보이는 본문을 구성하고 있는 글자를 포스팅마다 일일이 설정하는 것이 아니라 일괄적으로 적용하
whateverallwant.tistory.com
7. 우측 상단의 '적용' 버튼을 누른 뒤 변화된 글자 폰트 종류를 확인해주십시오.
-
헤더(header) 부분의 블로그 이름 글자 폰트 크기 설정 방법
1. 위의 '헤더(header) 부분 블로그 이름 글자 폰트 종류 설정 방법'의 1번 단계부터 5번 단계까지 동일하게 진행해주십시오.
2. 'font-size' 부분을 원하시는 글자 사이즈로 설정해줍니다.
초기에는 '1.75em'으로 설정되어 있을 텐데 'em' 단위는 수치를 조절함에 있어서 컨트롤하기가 개인적으로 힘들어서 저는 'px'단위를 주로 이용합니다. 이 포스팅에서는 '32px'로 설정해보겠습니다. 이 수치가 커질수록 헤더(header) 부분의 블로그 이름 글자 폰트 크기가 커지는 것입니다.
3. 우측 상단의 '적용' 버튼을 누른 뒤 변화된 글자 폰트 크기를 확인해주십시오.
-
헤더(header) 부분의 블로그 이름 글자 폰트 위치 간격 설정 방법
1. 위의 '헤더(header) 부분 블로그 이름 글자 폰트 종류 설정 방법'의 1번 단계부터 5번 단계까지 동일하게 진행해주십시오.
2. 'line-height' 부분과 'padding' 부분을 원하시는 위치 간격이 나오도록 설정해줍니다.
'line-height' 부분은 헤더(header) 부분 블로그 이름 글자의 높이를 의미합니다. 그림상에서 파란색 직사각형의 높이가 되겠습니다.
'padding' 부분은 헤더(header) 부분 위끝 경계선에서 블로그 이름 글자의 위끝 경계선까지의 상하 간격을 의미합니다.
그림상에서 파란색 직사각형 윗 가로에서 초록색 직사각형 윗 가로까지의 상하 간격이 되겠습니다.
이 내용을 바탕으로 본인의 취향에 맞는 위치 간격이 나오도록 수치를 변화시켜가며 자유롭게 설정해주시면 됩니다.
3. 우측 상단의 '적용' 버튼을 누른 뒤 변화된 블로그 이름의 위치 간격을 확인해주십시오.
-
헤더(header) 부분의 블로그 이름 글자 폰트 색상 설정 방법
1. 위의 '헤더(header) 부분 블로그 이름 글자 폰트 종류 설정 방법'의 1번 단계부터 4번 단계까지 동일하게 진행해주십시오.
2. '#header h1 a' 부분을 찾아줍니다.
검색창에 '#header h1 a' 부분 그 자체 또는 그 일부 'header'를 입력한 뒤 [Enter] 키를 눌러주십시오. 그다음 노란색으로 음영 처리되는 부분을 중심으로 '#header h1 a' 부분을 찾아주시면 되겠습니다.
3. '네이버'에서 '색상표'를 검색합니다.
4. '색상 팔레트'에서 헤더(header) 부분 블로그 이름 글자 폰트 색상으로 설정하고자 하는 컬러의 색상 코드를 복사합니다. 이 포스팅에서는 'FFBB00'(주황색)으로 설명해보겠습니다.
5. 'color' 부분의 내용을 4번 단계에서 복사한 색상 코드로 붙여 넣어 설정해줍니다.
6. 우측 상단의 '적용' 버튼을 누른 뒤 변화된 블로그 이름의 색상을 확인해주십시오.
-
마무리
이상으로 티스토리 블로그 북클럽(Book Club) 스킨을 기준으로 헤더(header) 부분의 블로그 이름 글자 폰트 설정 방법에 대한 설명을 마치겠습니다. 하나하나 아주 자세하게 설명드렸으니 초보자분이시라 할지라도 보시고 이해하시는데 큰 무리가 없을 것으로 생각됩니다. 차근차근 그대로 따라해주셔서 헤더(header) 부분의 블로그 이름 글자 폰트 설정을 원하시는 대로 완료하시길 바랍니다. 그동안 분들에게 헤더(header) 부분의 블로그 이름 글자 폰트 설정에 대해 궁금증이나 고민을 가지고 계셨던 분들에게 많은 도움드릴 수 있는 내용의 포스팅이었기를 바랍니다. 다음에 또 유용한 내용의 포스팅으로 찾아뵙겠습니다. 감사합니다.
댓글