본문 바로가기
Blog

마크쿼리 스파이더웹 4 상단 메뉴 수정하기

by 여행이 좋아. 2015. 6. 4.

티스토리의 장점 중 하나가 자신이 원하는 스킨으로 자유롭게 바꾸어 나만의 개성있는 블로그를 만드는 것이라고 할 수 있습니다.


마크쿼리 스파이더웹 4 상단 메뉴 수정하기


물론 처음 티스토리를 접하는 분들에게는 HTML 태그를 사용하여 직접 수정해가는 부분이 어려울 수 있으나 하나씩 배워가면서 한다면 크게 어렵지 않고 오히려 재미가 있지 않을까 합니다.

티스토리에서 최근 스킨의 대세는 아마다 반응형 스킨이 아닐까 합니다. 기존의 티스토리 스킨은 데스크용 스킨과 스마트폰 스킨의 주소가 따로 있었지만 반응형 스킨은 하나를 사용하면서도 사용자의 기기(데스크탑, 모바일)에 따라 알아서 스킨이 바뀌는 것이죠.



티스토리에서 어렵게 초대장을 받고 드디어 블로그를 개설하여 하나씩 내용을 채워가면서 나만의 블로그를 만드는 것은 재미를 더해주고 있죠. 그중에서도 가장 먼저 수정해야 하는 부분이 아마도 메뉴부분이 아닐까 합니다.


티스토리 반응형 스킨 마크쿼리 스페이더웹 4.0 상단 메뉴 수정 전(前) 후(後) 비교

아래 두 사진을 비교해보면 빨깐 박스 안의 메뉴가 달라진 것을 볼 수 있습니다. 수정전의 마크쿼리 스파이더웹의 기본 메뉴는 Archives, Tags, Guestbook, admin 등으로 되어 있는데 수정후에는 Toctoccaster, Tour, Blog, IT, Life, Goods, Guestbook, admin으로 바뀌었죠.




티스토리 반응형 스킨 마크쿼리 스페이더웹 4.0 상단 메뉴 수정하는 방법



1. 티스토리 관리화면 HTML/CSS 편집

티스토리 상단 메뉴를 수정하기 위해서 먼저 티스토리 관리화면으로 들어가 HTML/CSS 편집화면에서 키보드에서 Ctrl + F (찾기)를 눌러 'navigation'을 검색하여 아래과 같은 화면을 찾습니다.




2. 메뉴 태그 수정하기

기존 태그에서 주소와 메뉴 이름을 수정해주어야 하는데 아래 태그에서와 같이 파란 부분을 변경해 주면 됩니다.

수정 전(前) : <li class="drawer-menu-item"><a href="/category">Archives</a></li>

수정 후(後) : <li class="drawer-menu-item"><a href="/category/Tour%20Cast(링크할 주소)">Tour</a></li>



지금까지 티스토리 반응형 스킨 스파이더웹 4.0의 메뉴를 수정하는 방법에 대해 알아보았는데 생각만큼 어렵지 않아 누구나 쉽게 바꿀 수 있지 않을까 합니다.

728x90