인프런 커뮤니티 질문&답변
작성한 질문수
헤더 질문
작성
·
4
0
헤더설정 질문 드립니다.
헤더를 푸터와 함께 별도로 작업을 해 놓았고. 메인 홈화면에서는 헤더를 만든후 원래 페이지에 만들었던 헤더 페이지를 지워 헤더를 모든 페이지에 활성화 시켰습니다.
당연히 엘리멘터로 편집창에서 보면 홈화면이나 다른 블로그 게시판 이런 페이지에서는 헤더의 모습을 볼수 없지만 홈페이지 주소로 들어가면 헤더가 나옵니다.
하지만모바일 화면에서 활성화 시켜보면 헤더의 메인 햄버거 모양까지 나오고 햄버거 모양을 클릭했을때 팝업창이 활성화 되는 모습이 가려져서 보이지가 않습니다.
조언구합니다.
답변 1
0
안녕하세요, 인프런 AI 인턴입니다. sungwha79님.
모바일 화면에서 헤더의 햄버거 메뉴가 제대로 작동하지 않는 문제는 레이아웃 및 CSS 스타일과 관련된 이슈일 가능성이 높습니다. 이러한 문제를 해결하기 위해 다음과 같은 접근을 시도해 보실 수 있습니다:
CSS 및 반응형 설정 확인: 엘리멘터의 반응형 설정에서 모바일 디바이스에 대해 특정 숨김 또는 보임 설정이 되어 있는지 확인해보세요. 특히, 햄버거 메뉴가 제대로 표시되려면 모바일 모드에서의 레이아웃 구조가 잘 정의되어 있어야 합니다.
자바스크립트 및 jQuery 확인: 모바일에서 작동하는 햄버거 메뉴는 자바스크립트 또는 jQuery에 의존하는 경우가 많습니다. 플러그인이 제대로 작동하고 있는지 및 해당 스크립트가 로드되어 있는지 확인해보세요.
클래스 및 ID 설정: 햄버거 메뉴가 클릭했을 때 팝업이 가려지는 경우, 특정 CSS 클래스나 ID에 대해 z-index 속성을 조정하여 우선순위를 올려볼 수 있습니다. 팝업 레이어가 다른 레이어보다 위에 표시되도록 설정합니다.
테마나 플러그인의 업데이트: 사용 중인 테마나 플러그인이 최신 버전인지 확인하고, 관련 업데이트가 있다면 적용해보세요. 업데이트 시 새로운 기능 추가 및 기존 기능의 오류 수정이 이루어질 수 있습니다.
브라우저의 캐시 초기화: 경우에 따라 브라우저의 캐시 때문에 문제가 발생할 수 있습니다. 캐시를 초기화한 후 다시 확인해보세요.
이와 관련된 문제에 대한 해결 방법은 다음과 같은 게시물에서 더 많은 정보를 참고하실 수 있습니다:
- “워드프레스 엘리먼터 페이지 이동시 깜박임”: 페이지 이동 시 발생하는 문제나 엘리멘터 관련 이슈에 관한 토론을 확인할 수 있습니다.
- “헤더 엘리먼트 편집 오류”: 헤더 편집 시 발생하는 오류와 충돌 문제에 대한 정보입니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.