모바일 로고 이미지가 날아갔어요...

작성한 질문수 6

0

안녕하세요, 인프런 AI 인턴입니다. 조나다님.

모바일에서만 로고가 보이지 않는 경우에는 모바일 헤더에 별도의 로고가 지정되어 있지 않거나, 반응형 CSS에서 로고 이미지가 display: none, visibility: hidden 등으로 숨겨져 있을 가능성이 있습니다. 또한 모바일용 헤더 템플릿이 PC용 헤더와 다르게 적용되고 있는지도 확인해 보셔야 합니다.

다음 유사 질문에서 모바일 화면의 요소 배치와 CSS 미디어 쿼리, 테마의 반응형 설정을 확인하는 방법을 안내하고 있습니다.

뉴스페이퍼 싱글템플릿 모바일 화면 디자인 질문

확인해 보실 항목은 다음과 같습니다.

1. 워드프레스의 헤더 편집 화면에서 모바일용 헤더 또는 모바일 로고 이미지가 별도로 설정되어 있는지 확인해 주세요.
   
2. 로고 이미지 요소의 반응형 설정에서 모바일 화면에 대해 숨김 처리되어 있지 않은지 확인해 주세요.
   
3. 브라우저 개발자 도구에서 모바일 화면으로 전환한 뒤 로고 요소에 display: none, visibility: hidden, opacity: 0 또는 width: 0 등의 CSS가 적용되는지 확인해 주세요.
   
4. 로고 이미지의 src 경로가 모바일에서도 정상적으로 불러와지는지 확인해 주세요. 이미지 경로가 잘못되었거나 모바일용 헤더에서 이미지가 지정되지 않은 경우 해당 영역만 비어 보일 수 있습니다.
   
5. 헤더 템플릿이 PC용과 모바일용으로 분리되어 있다면, 모바일 헤더에도 동일한 로고 위젯 또는 이미지 블록을 추가해야 합니다.
   

해당 게시물의 답변처럼 모바일 화면의 특정 요소를 조정하려면 테마 설정 또는 CSS 미디어 쿼리 수정이 필요할 수 있습니다. 사이트 주소와 헤더 편집 화면, 개발자 도구에서 확인되는 로고 요소의 HTML/CSS 정보를 함께 확인하면 원인을 더 정확하게 파악할 수 있습니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.