XE독학하기 그 28번째 걸음-모바일 레이아웃의 수정

안녕하세요?

이번 포스팅에서는 지난번에 모바일 레이아웃으로 설정한 Sketchbook5mobile이 그다지 좋지 않다는 유저들의 의견이 많아서, 하는 수 없이 이번에는 다른 레이아웃으로 바꾸고자 합니다.

우선 XE관리자 페이지에서 [사이트 편집/제작]탭으로 가서 [사이트 디자인 설정]항목을 눌러서 아래의 그림과 같은 화면을 불러 오도록 합니다.

여기서 모바일 설정으로 가서, 다른 레이아웃 설치를 눌러서, 새로운 레이아웃 중에서 괜찮은 것이 있는지 여부를 알아 보도록 합니다.

여기서 우선 Sweet mobile 레이아웃이라고 하는 레이아웃을 선택해서, 우측에 있는 다운로드 명령을 눌러서, 설치에 들어가도록 합니다. 설치는 순조롭게 진행이 되었고, 이제 상세 설정에 들어가서, Sweet Mobile 레이아웃의 세세한 부분을 설정하다록 합니다.

사용자 정의 항목으로 가서 위 스크린샷과 같이 설정을 하고, 다음은 아래로 내려가서 메뉴를 어떻게 할 것인지를 결정하도록 합니다.

사이트 메뉴를 미리 설정한 Main_menu로 설정을 하도록 하고, 이제 스마트폰 상에서 어떻게 나오는 지를 보고서 성공인지 실패인지를 가려보도록 합니다.

일단 스마트폰의 화면상으로는 다른 건 다 괜찮은데, 최신글과 제일 첫 페이지에 나오는 화면이 완전히 가려진 형태로 나오게 되었습니다. 물론 이를 수정하면 어떻게 가능하기는 가능합니다만, 문제는 제가 할 수 있는 범위를 많이 넘어갔기에, 하는 수 없이 다른 모바일 레이아웃을 설치하기로 하였습니다.

이번에는 저니 2010모바일 레이아웃이라는 것을 선택해서 설치를 하고자 했습니다. 하지만 이번에는 XE관리자 페이지상에서 쉬운 설치로 설치가 제대로 되지 않아서 하는 수 없이 XE 공식 자료실로 가야만 했습니다.

여기서 설치경로를 미리 알아두도록 하고, 하드 디스크 드라이브에 레이아웃의 압축파일을 다운로드 받아서 압축을 풀었습니다. 그 다음에는 알FTP를 이용해서, 홈페이지상의 설치경로에다가 업로드 시킨 다음 다시 XE 관리자 페이지로 돌아 갔습니다.

이번에는 저니 모바일 레이아웃을 선택한 다음, 상세 설정을 불러와서, 주로 사용할 칼라톤과 표시할 메뉴에 대해서 지정을 하도록 합니다. 그리고 나서 모바일 설정 저장을 누른 다음에, 이제 스마트폰 상에서 어떻게 나오는 지를 살펴 보도록 했습니다.

이번에는 제대로 모바일 레이아웃이 적용된 것을 볼 수 있었습니다. 한번의 시행착오가 있기는 했지만, 어떻게 해서 다른 모바일 레이아웃으로 교체를 하는 데는 성공하였다는 생각이 듭니다.