티스토리 Magazine 스킨, 메뉴 수정기

티스토리 Magazine 스킨 수정기 두 번째 글입니다. 이 글은 따로 수정하는 방법이나 코드를 적어드리진 않고 바뀐 부분만 소개하는 글입니다. 본격적인 수정을 원하시는 분들에게는 도움이 되지 못할 것 같아서 죄송하네요.

 

티스토리의 다양한 스킨들 중에 Magazine 스킨을 고른 이유는, 제가 사용하고 싶어 하는 형태에 가장 근접했기 때문에, 수정도 그렇게 크게 하지 않아도 될 것 같다는 생각에서였어요.

특히 검색 부분이 별개의 전체 화면처럼 띄워지기를 바랐는데 Magazine 스킨이 딱 그랬습니다.

기존 스킨과 어떻게 다른지는 데모 사이트를 보시면서 비교해보시는 것도 좋을 것 같습니다.

 

티스토리 Magazine 스킨 데모 블로그 : skin-demo-f94f4.tistory.com

 

 

검색과 메뉴가 별도로 분리 된 창으로 띄워진다는 점에서 선택한 Magazine 스킨

 

검색 화면

기본적인 틀은 기존의 Magazine 스킨과는 크게 다르지 않았습니다.

배경색, 검색 아이콘의 위치 정도를 바꿨고 검색 키워드와 비슷한 느낌을 주기 위해 태그 사이드바를 넣을 수 있도록 공간을 추가했습니다.

 

전체적인 틀은 기존 Magazine과 같고, 태그 사이드바를 넣을 수 있도록 수정하였습니다.

 

메뉴 화면

메뉴 화면도 전체적인 틀은 따로 변하지 않았고, 배경 색을 바꾸고 표시된 메뉴를 가운데 정렬한 것 정도밖에 없습니다.

바꾸는 과정에서 검색 화면과 메뉴 화면의 배경색이 별도로 지정이 되도록 수정했습니다.

 

메뉴를 가운데로 정렬하고, 배경색을 수정하였습니다.

메뉴 부분은 일부 웹브라우저에서 제대로 표시가 안 되는 부분만 수정하고 따로 더 건든 것은 없습니다.

사실 이리저리 다른 사이트들을 열심히 참고해가며 수정한거라서, 기존 스킨에 맞게 적용하는 게 어렵긴 했습니다만 그렇게  html이나 css같은 것을 본격적으로 공부하지 않은 저도 기본적인 부분은 수정이 가능하니까 이 글을 보시는 분들도 꼭 원하는 대로 수정하시기를 바랍니다.