09. XE를 이용한 홈페이지 꾸미기 (5) - Home 화면에 위젯 설정하기!

xe로 홈페이지를 꾸미는데에 있어서 재밌는 점은 위젯을 설정할 수 있다는 점이다.

위젯은 역시 관리페이지의 쉬운설치로 쉽게 설치할 수 있다.

(쉬운설치가 지원되지 않는 위젯이나 모듈의 경우, 다운로드 페이지에 나와있는 경로에 업로드만 하면 설치가 끝난다.)

 

 

 

1. 위젯의 설정

위젯의 설정은 홈화면 우측 하단 페이지수정 을 누르면 설정할 수 있다.

(정확히 말하면 홈화면이 아니라 관리페이지에서 만든 위젯 메뉴 페이지에서 가능하다.)

 

 

1) 투씨 컨텐츠 위젯

나는 투씨 컨텐츠 위젯을 이용하여 게시판별 최신 글이 무엇인지 볼 수 있도록 하였다.

페이지수정을 누르면 우측 하단에서 위젯을 선택하여 만들 수 있다.

(만들어진 위젯 말고도 직접 html을 이용해서도 가능하다.)

 

만들고 나서 위젯에 마우스를 슬쩍 가져다 올리면 좌측 상단에 여러 메뉴가 뜨는데

톱니바퀴 모양을 누르면 위젯의 전체적인 설정이 가능하고

눈모양 버튼을 누르면 위젯 크기를 % 혹은 px 로 설정, 혹은 여백 설정 등이 가능하다.

(특별한 경우가 아니면 이 2가지 메뉴로 다 할 수 있다.)

 

 

 

2) 성경 읽기 위젯

다른 특별한 위젯이 없나 찾아보다 성경읽기 위젯을 발견해서 설치해보기로 했다.
설치해보니 참 익숙한 소스들이 나왔다. 바로 예전에 제자포스 홈페이지 작업할 때 보았던 홀리바이블 성경 검색 소스였다.

기존의 다운받은 성경읽기 위젯에는 성경 읽기밖에 안되었지만 성경 검색도 많이 유용할 것 같아
홀리바이블 사이트에서 제공해주는 소스를 바탕으로 성경 검색부분도 만들어보기로 했다.

성경 검색을 위한 메뉴나 검색창을 집어넣는 것은 어렵지 않았다.

그러나 제일 어려웠던 작업은 글을 집어 넣고 검색을 눌렀음에도 불구하고

내가 쓴 글이 깨져서 새 창으로 전달되는 것이다.

이 문제에 대해 검색해보니 검색 시 utf-8로 한글이 인코딩 된 것을 euc-kr로 변경하여 holybible 사이트로 보내줘야 했는데

내가 쓴 글을 euc-kr로 인코딩 하는 것이 안되는 것이었다.

그래도 참 뿌듯하게 어떻게 해결을 했다.ㅎㅎ

그 작업의 중간과정 및 해결법은 아래 글에 보면 나와있다.

http://www.xpressengine.com/qna/22820824

 

 

 

 

2. 모바일 페이지 위젯

 

모바일 홈페이지의 위젯 설정도 마찬가지로 진행했다.

위젯페이지 우측 하단에 보면 모바일로 볼 수 있는 버튼이 나온다.

그 버튼을 눌러 모바일 홈페이지의 화면으로 들어가 pc와 같이 페이지설정 - 위젯설정을 진행하여

원하는 대로 설정하여 사용하면 된다.

 

다만 레이어를 띄워 공지사항을 출력해주는 위젯을 사용하려 했으나

이상하게 그 공지사항만 띄워지면 메인 페이지의 그림 배너가 사라져 사용하지 않기로 했다.