워드프레스 아바다 테마 컨텐츠 영역 넓히기

Home//워드프레스 아바다 테마 컨텐츠 영역 넓히기




아바다 테마 Ver 3.6 이후 테마옵션에서 사이트의 넓이를 설정하는 옵션이 추가 되었습니다. 이 이전 버전에 해당되는 글입니다.

100% Width 템플릿을 사용해서 페이지나 포스트를 만들지 않고, 기본적으로 Wide 나 Boxed 의 배경을 사용해서 글을 작성하게 되면 아바다 테마는 컨텐츠의 영역을 940px의 넓이로 표현 합니다.

이 940px의 넓이가 현재의 모니터 보급추세에 맞춘다면 너무 좁다고 생각 할 수도 있습니다. 그래서 이 컨텐츠 영역의 넓이를 커스터 마이징 해 보겠습니다.

어드민 대시보드 – Theme Options – Custom CSS 로 들어가서( 자식테마를 사용하는 경우는 자식테마의 style.css 파일에도 가능)
CSS Code 입력창에

wide 모드인 경우

를 입력하면 되고,

Boxed 모드인 경우는 한줄을 더 추가해서

이렇게 입력하면 됩니다.

(아랫부분의 body#main.width-100 > .avada-row{… 코드는 숏코드중 full width container 코드가 제 역할을 못하는 것을 방지하는 소스입니다.)

* 위에서의 예는 컨텐츠의 넓이를 1200px로 조정한 것입니다.

id=”wrapper” 의 넓이는 원하는 컨텐츠영역넓이에 +60px을 해 줍니다.

현재 avada.kr 사이트는 wide모드에 max-width:1100px로 작업되어있습니다.







|2014. 12. 6|카테고리: 아바다 테마|2 개의 댓글

글쓴이 :

2 댓글

  1. 최성국 2015/01/25 - 10:01 - 답글쓰기

    안녕하세요, 덕분에 제가 고민하던점을 해결하였습니다.
    그런데, 이렇게 설정하면 모바일에서보면 제대로 보이지 않습니다.
    크기가 제대로 보이지 않는데, 모바일에서도 제대로 보이게 할 수 있는 방법이 있는지요.

    • Avada:KR 2015/01/25 - 20:41 - 답글쓰기

      일단 이방식은 현재 아바다 버전에서는 필요가 없는 방법입니다.
      원활하게 작동하지 않는다면 업데이트 하시는것을 권장하고,
      만약 구 버전에서 이방법을 사용하신다면
      모바일에서 어떤 화면이 이상하게 표시되는지 알아야 어떤 말씀을 드릴수가 있을 것 같습니다.
      단순히 사이트의 넓이를 넓혀서 일어나는 현상인지…
      아니면 페이지나 포스트를 작성하면서 내부에 설정한 설정값 때문에 그런것이지.. 등을요

댓글 쓰기