본문으로 바로가기



[Flatinum 스킨 상단 '메뉴' 설정]


Flatinum 스킨 수정 시리즈

[애드센스] 티스토리 블로그 사이드 메뉴에 애드센스 광고 넣기

[티스토리] Flatinum 스킨 '스크롤 네비게이션 바' 크기 설정

- [티스토리] Flatinum 스킨 '메뉴 토클' 설정

- [티스토리] Flatinum 스킨 상단 '메뉴' 설정 (이번 포스팅) 

[티스토리] Flatinum 스킨 하단 '페이징' 설정




상단 '메뉴'가 정확히 어디를 의미하나요?


▲ 상단 '메뉴' 위치


상단 '메뉴'는 위에서 표시한 공지사항 부분을 의미합니다. 따로 별도의 메뉴나 페이지를 구성하고 싶을 때 사용하는 것입니다. 이번 포스팅에서는 이 메뉴를 설정하는 방법을 알아보도록 하겠습니다. 





상단 '메뉴' HTML 소스 수정


그럼 실제로 수정 및 적용하기 위해서 [티스토리] Flatinum 스킨 '스크롤 네비게이션 바' 크기 설정 글의 '[html 편집] 화면 이동'에서 설명한 경로를 통해 소스 편집 화면으로 이동합니다.(관리자 메뉴 - 꾸미기 탭의 [스킨 편집] - 우측 화면에서 [html 편집])


▲ 상단 '메뉴' 부분 소스


소스 편집 화면에서 지난 포스팅인 [티스토리] Flatinum 스킨 '메뉴 토클' 설정 에서 설정한 소스의 바로 윗부분이 상단 '메뉴' 부분에 해당하는 소스입니다. 'nav navbar-nav'라는 키워드로 검색해야 되겠네요. 처음 편집하시는 분들은 notice로 검색하여도 될 것 같습니다. 여하튼 상단 '메뉴'를 수정하기 위해서 이 부분을 이리 저리 뜯어 고치면 되겠습니다. 소스를 살펴보시면 [티스토리] Flatinum 스킨 '메뉴 토클' 설정 포스팅에서 설명한 것과 마찬가지로 'a href= ' 부분에 메뉴를 누르면 연결할 주소를 입력하면 됩니다. 현재 공지사항의 경우, harvith.tistory.com/notice에 해당하기 때문에 "/notice"라는 주소를 갖게 됩니다. 개인적으로 이 부분에 본인의 티스토리 메뉴가 아니라 외부 링크를 입력하면 어떻게 될지 궁금하여 'www.naver.com'을 입력해보았으나 주소를 찾지 못하였습니다. html 소스 어딘가에 제 블로그 주소인 harvith.tistory.com을 지정해놓아서 'harvith.tistory.comwww.naver.com'의 형태로 주소가 넘어 갔을 것으로 추측됩니다만 당장 제게 중요한 이슈가 아니기에 나중에 필요하게 되면 파악해보는 것으로 하겠습니다.


▲ 상단 '메뉴' 소스 수정 결과 비교


[티스토리] Flatinum 스킨 '메뉴 토클' 설정에서 수정했던 '메뉴 토글'에 비해 간단하지만 소스를 수정할 때 한가지 주의 사항이 있습니다. 바로 위의 그림에서 보듯 소스를 어떻게 하느냐에 따라 '메뉴'가 보여지는 형태가 달라지게 됩니다. 이 점만 주의하여 설정하면 되겠습니다.


▲ 상단 '메뉴' 주석 처리 결과


저는 이번 포스팅을 작성하는 현재 상단 '메뉴'가 필요하지 않다고 판단하여 주석으로 '메뉴'를 사용하지 않도록 처리해놓았습니다. '메뉴'를 사용하고 싶지 않은 분들은 저와 같이 처리하여 [저장]을 하시면 되겠습니다.





관련 포스팅


Flatinum 스킨 수정 시리즈


[애드센스] 티스토리 블로그 사이드 메뉴에 애드센스 광고 넣기

[티스토리] Flatinum 스킨 '스크롤 네비게이션 바' 크기 설정

- [티스토리] Flatinum 스킨 '메뉴 토클' 설정

- [티스토리] Flatinum 스킨 상단 '메뉴' 설정 (이번 포스팅) 

[티스토리] Flatinum 스킨 하단 '페이징' 설정


유익한 시간되셨다면 하단에 공감 버튼을 눌러주세요.

여러분의 공감은 저에게 큰 힘이 됩니다.