top sub menu의 모든 코드를 지워서
본문
상단을 저l거 하거나 폭을 줄이려고 합니다.
아여l 저l거해도 공간이 좀 남너l요.
아시는 분은 조언 주시면 감사합니다__)
답변 3
개발자 도구 콘솔 탭에서 ( 최신 그누보드 예시 )
document.querySelector('.top-sub-menu')?.remove();
이 명령어로 .top-sub-menu 클래스가 삭제되는지 확인 후,
CSS, JavaScript 수정 또는 HTML에서 삭제해야 합니다.
다시 말해,
한 가지 방법만 사용해도 되고, 필요에 따라 2~3가지 방법을 조합할 수도 있습니다.
예로, CSS와 JavaScript를 함께 사용하거나, HTML에서 삭제하고 CSS를 보완하는 방식도 가능.
- 간단하게 숨기려면 → CSS (display: none !important;)
- 강제적으로 삭제하려면 → JavaScript (document.querySelector('.top-sub-menu')?.remove();)
- 완전히 제거하려면 → HTML/PHP에서 <div class="top-sub-menu"> 코드 삭제
＊CSS로 숨기기 (비파괴적 방법) :
/css/default.css 또는 /css/theme.css에 다음 코드를 추가하면
.top-sub-menu 요소가 보이지 않도록 설정할 수 있음
.top-sub-menu {
display: none !important;
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
}
단) 요소가 완전히 삭제되지 않으므로 여전히 공간을 차지할 가능성이 있음.
＊JavaScript로 삭제 (클라이언트 측에서 요소 제거)
/js/common.js 또는 /js/jquery.menu.js에 아래 코드를 추가하면,
브라우저에서 top sub menu 요소를 자동으로 삭제할 수 있음
document.addEventListener("DOMContentLoaded", function() {
document.querySelector('.top-sub-menu')?.remove();
});
단) 페이지 로드 후 삭제되므로 순간적으로 메뉴가 나타날 수도 있음.
＊HTML/PHP에서 직접 제거 (근본적인 해결)
/head.sub.php, /header.php 파일에서
<div class="top-sub-menu"> 코드가 있는 블럭 찾아 제거
<div class="top-sub-menu">
<ul>
<li><a href="#">메뉴 1</a></li>
<li><a href="#">메뉴 2</a></li>
</ul>
</div>
단점: 코드 수정이 필요하며, 테마나 업데이트에 따라 재작업해야 할 수도 있음.
해당만 보고는 알 수 있는게 없습니다.
주소나 소스를 남기셔야지 도움 받기 쉬우실거 같습니다.
개발자 도구로 저부분 클릭해서 확인해보세요
하시기 힘들면 유튜브를 통해서 배워보세요
margin이나 padding 을 조절해야되여
