Fastboot 스킨 상단바, 하단 색깔 바꾸기

2018. 6. 10. 01:19 기타/티스토리


많은 블로거분들이 사용하시는 FASTBOOT 스킨! 스킨의 여러 부분을 바꾸고 싶으신데 잘 모르시겠다는 분들을 위해 만들었습니다. Fastboot 스킨의 상단바 색상 바꾸기를 시작하겠습니다.





Fastboot의 상단바의 기본 색상은 무난한 색상으로 되어 있습니다. 그래서 크게 신경쓰지 않아도 됩니다. 하지만 많은 블로거 분들이 자신만의 블로그이고, 자신이 이야기 하고 싶은 것을 말하는 공간이므로 자신의 개성을 나타내기 위해 또는 여러 이유로 이 색상을 바꾸고 싶어합니다.


저 또한 마찬가지입니다. 제 블로그이기 때문에 제가 하고 싶은 색상을 넣고 싶어서 색상을 바꾸려고 합니다. 


아래의 캡쳐화면이 제 블로그의 상단바입니다. 기본 색이 검정 계열의 색으로 되어 있습니다. html 컬러 코드로는 #43A54로 되어 있습니다. 이 색을 초록 계열의 색으로 바꾸어 보겠습니다.





역시 html 이야기가 나왔으니 html 편집으로 가야겠죠?

관리자 모드에서 스킨편집을 들어가서 css 편집창으로 들어갑니다.




html과 css 편집을 하러 가는 방법은 티스토리가 업데이트 될 때 바뀔 수가 있으므로 스킨편집이라는 부분이 보이지 않고, Html과 css를 편집하는 방법이 티스토리 업데이트로 인해 바뀔 수도 있습니다.


css 편집에서 우리가 찾아야 할 부분은 바로 아래 부분입니다. 우선 css 편집창에서 코드의 아무 부분을 누른 후 ctrl + F를 눌러 'secondnav'라고 입력한 후 엔터를 누르면 css 코드 아랫 부분에 보통 많이 나옵니다. 



secondnav가 많이 모여 있는 부분들중 윗 쪽에 보시면 아래와 같은 코드가 있을 것입니다. 찾기 어려우시면 #43A54를 검색하셔서 찾으시면 편하십니다.


background-color 부분에 있는 코드를 내가 원하는 색상의 html 코드로 바꿔주시면 됩니다. 


만약 내가 원하는 색상의  html 코드를 모르시겠다면 아래 링크를 통해 확인해 주시면 됩니다. 





https://html-color-codes.info/Korean/




위에 빨간 네모 박스로 표시해 둔 부분의 코드를 수정해서 저는 아래와 같이 초록색 계열의 색상으로 코드를 변경했습니다. 







스킨 하단 또한 바꿔 보겠습니다

스킨 하단의 색상 또한 css코드를 수정해서 바꿔야 합니다. 이번에는 footer를 찾습니다. 이 footer가 하단에 있는 부분을 나타내는 것입니다.



이렇게 footer를 찾으면 아래와 같이 background-color가 있습니다. 여기의 색상을 바꾸면 됩니다.




색상을 바꾸는 방법은 상단바 바꾸는 방법과 동일합니다. 저 색상 코드를 다른 색상 코드로 바꾸는 것입니다.


저는 이렇게 아래와 같이 바꾸었습니다.



[티스토리] - 카테고리 페이지 상단에 광고넣기

[티스토리] - Fastboot 스킨 사이드바 넓히기, 넓이 조절

[티스토리] - 티스토리 포스팅 제목 윗부분에 광고넣기


[경제, 금융] - 분식회계란, 분식회계를 하는 이유

[주식] 보통주와 우선주의 차이

극동, 근동, 중동의 차이와 유례



BIG