안녕하세요 라이믹스로 커뮤니티 사이트 구축중인데요 위젯 페이지의 레이아웃 관련하여 해결되지 않는 부분이 있어 문의드립니다.
현재 equeer 레이아웃을 이용중이어서 레이아웃이 반응형으로 모바일 레이아웃/PC 레이아웃이 지원되는데요.
다만 위젯 페이지의 위젯의 경우 모바일/PC 를 별도로 설정해놓았는데 이 부분은 반응형으로 지원이 되지 않습니다.
PC 의 경우 2:1 비율로 좌우를 나누어 각각 위젯을 배치하였고, 모바일의 경우 모든 위젯이 풀사이즈로 나오게 배치하였는데요.
PC 브라우저 크기를 줄이면, 레이아웃은 모바일 레이아웃으로 바뀌지만 위젯 페이지가 모바일 버전으로 변경되지 않으니 이상하게 나오는 것 같아 이 부분을 해결하고 싶습니다.
본론은
웹 브라우저 크기를 자동으로 인식해서 800px 이상 → PC 레이아웃 표시 / 799 px 이하 → 모바일 레이아웃 표시
이런 식으로 기능 구현하는 방법이 어떻게 있을까요?
XE TOWN 의 홈페이지의 경우 메인 페이지가 반응형으로 위젯 배치가 자동으로 변하더라고요,
이 부분을 계속 검색해보고 찾아보았는데도 잘 나오지 않아 문의드립니다.
도움주신다면 매우 감사드리겠습니다.
아래 이미지는 제 웹사이트의 PC 버전, 작은 브라우저 크기일 때 입니다.
우선 메인 배너가 모바일에서는 사라지도록 되어있지만 반응형의 경우 이 기능이 제대로 작동되지 않고, 위젯 배치의 경우도 비율이 작아져 이상하게 나옵니다.
반면 XE TOWN 홈페이지의 경우 같은 PC 브라우저임에도 브라우저 크기에 따라 레이아웃이 자동으로 바뀝니다.
이런 기능이 필요합니다.