워드프레스 OceanWP 테마 사이드바 모바일에서 숨기기

워드프레스 OceanWP 테마의 사이드바를 모바일 뷰에서 숨기는 방법을 알아 보겠습니다.

사이드바를 모바일에서 숨기는 이유는 여러가지가 있겠습니다만 가장 고려되는 점이 바로 모바일에서의 로딩 속도가 아닐까 합니다.
이 외에도 사이드바에 노출되는 애드센스 광고의 비효율성도 한 가지 이유가 될 수도 있습니다.

워드프레스 관리자로 로그인 한 이후 왼쪽 메뉴 외모 > 추가 CSS로 들어갑니다.

/* Hide your Sidebar on Mobile Globally */
@media (max-width: 767px) {
	.widget-area.sidebar-primary { display: none; }
}

위와 같은 코드를 추가해 줍니다.

OceanWP 테마의 가로폭 기본 설정을 사용하고 있다면 그대로 복사 붙이기를 하면 됩니다만 만약 본문 콘텐츠의 가로폭을 수정을 하였다면 그에 맞는 max-width를 설정해 줘야 합니다.

마지막으로 꼭 OceanWP 테마의 차일드 테마를 등록한 이후 이 차일드 테마 진행하는 것을 추천 드립니다.

• OceanWP 테마를 위한 차일드 테마 (Child theme) 파일
• 워드프레스 블로그 OceanWP 테마 & WP Fastest Cache 플러그인 전자책
• OceanWP 테마 홈페이지

출처