위젯

1. 개요

위젯은 레이아웃 또는 특정 영역에 삽입되는 부분적인 확장요소입니다. 위젯을 이용함으로서 직접 코딩해야 하는 영역을 위젯 전용함수를 이용하여 한줄의 코드로 간단히 구현할 수 있습니다.

위젯의 삽입방법
  1. 위젯코드로 삽입 - 위젯삽입 함수를 이용하여 소스코드내에 직접 삽입하는 방식
  2. 위젯 불러오기로 삽입 - 미구현

2. 기본경로 및 공통변수

위젯의 위치 :
$g['path_widget']    (ex)   ./widgets/
추가 정보는 주요변수 페이지에 경로 데이터를 담는 배열 $g = array(); 항목을 참고.

3. 기본구조

위의 구조는 일반적인 위젯 폴더구성이며 파일명은 위의 구조를 따라야 합니다. main.php , admin.php 는 필수파일이며 나머지는 옵션입니다.

4. 기본위젯 만들기

이 과정은 어떤 샘플도 없는 상태에서 위젯을 개발해 가는 과정을 담고 있습니다. 위젯에 대한 구조파악이 된 후에는 위젯 샘플을 다운로드 받아 개발하면 더 빠르게 개발할 수 있을 것입니다.

4-1. 기본폴더 및 파일 만들기

위젯폴더는 영문 대소문자를 포함하여 폴더명으로 사용가능한 모든 문자(한글제외)를 사용할 수 있으나 가능하면 영문소문자를 권장합니다. 다음과 같이 폴더와 파일들을 생성합니다.(파일은 반드시 UTF-8로 생성)

아래에서 단계별 샘플 위젯을 다운로드 받을 수 있으나 샘플을 다운로드 받기 전에 가능한 수차례 위젯 폴더구조를 직접 만들어 보시길 권해드립니다. 몇차례 위젯 폴더와 파일들을 만들어보면 구조를 이해하는데 도움이 될 것입니다.

4-2. 주요파일의 이해

이 페이지 하단에서 샘플파일을 다운로드 받아 압축을 푼 후 다음의 파일들을 확인해 보세요. 각각의 파일들에 대한 역할을 자세히 숙지하시기 바랍니다.

widgets/mywidget/name.txt - 위젯 명칭을 입력합니다.

내 위젯

widgets/mywidget/admin.php - 위젯 설정화면 파일입니다.

위는 일반적인 위젯의 설정화면용 소스코드입니다. 중요한 것은 반드시 widgetCode(n) 과 saveCheck(n) 2개의 javascript 메소드가 포함되어야 한다는 점입니다. 이 메소드들은 위젯 삽입용 소스코드를 리턴하고 위젯을 삽입해 주는 역할을 합니다.

위젯코드 추출만 허용하는 위젯일 경우

위젯에는 두가지 종류가 있습니다. 위젯코드 추출전용 위젯과 위젯불러오기를 통해 드래그앤드롭용으로 사용되는 위젯이 있는데 이중 코드 추출전용 위젯의 경우 위의 admin.php 중 82라인의 saveCheck(n) 메소드를 다음과 같이 작성합니다.

widgets/mywidget/main.php - 사용자 화면용 위젯파일입니다.

위젯 사용자화면용 파일은 $wdgvar 배열을 사용하여 구성합니다. 이때 위젯을 <div> ... </div> 으로 감싸고 id 를 id="widget-<?php echo $wdgvar['widget_id']?>" 으로 지정해 주어야 합니다.

이 경우 위젯아이디가 default/sample 라고 가정할때 id="widget-default-sample" 가 지정되므로 이를 이용하여 CSS 나 Javascript 접근이 용이해집니다.

class 명칭은 rb-widget-중복되지않을명칭 으로 정의해 주고 대응 css 파일에서 해당 class로 접근합니다.

widgets/mywidget/main.css - 사용자 화면용 위젯파일 전용 css 입니다.

4-3. 다국어 지원

언어셋 파일구조

디폴트(DEFAULT)언어를 결정합니다.
기본이 되는 언어를 어떤 것으로 할지 정해야 합니다. 사이트 언어를 한국어로 설정했는데 사용된 위젯이 한국어를 지원하지 않는다면 해당 위젯은 정상적으로 출력되지 않을 것이기 때문입니다.

따라서 한국어든 영어든 일본어든 DEFAULT 언어셋을 지정한 후 타 언어셋을 추가해 주어야 합니다. 반드시 다음과 같이 언어파일을 추가해야 합니다.

언어셋 파일 작성방법

언어셋 파일은 중복을 피하기 위해 반드시 다음과 같은 방식으로 작성해야 합니다. 언어셋 변수는 반드시 $lang 을 사용해야 합니다. 인자 네이밍은 반드시 중복되지 않도록 widget-중복되지않을명칭 으로 정의합니다.

언어셋 호출방법

언어셋을 실제로 사용하기 위해서는 반드시 _LANG() 함수를 사용해야 하며 특수한 경우 변수 자체를 사용할 수도 있습니다.

언어셋 인클루드 방법

언어셋이 포함된 위젯일 경우 자동으로 인클루드되어 admin.php 와 main.php 에서 _LANG() 함수를 사용할 수 있습니다.

4-4. 위젯코드 함수

위젯코드 함수는 getWidget() 이며 다음과 같이 삽입합니다. (위젯코드 추출을 이용하여 자동으로 추출할 수 있습니다)

5. 예제

샘플 위젯
  1. 1. 샘플위젯1 (일반) 코드보기 다운로드
  2. 2. 샘플위젯2 (다국어지원) 코드보기 다운로드
  3. 3. 샘플위젯3 (복수위젯 - 위젯분류폴더 포함) 코드보기 다운로드

6. 패키징 방법

위젯 설치파일은 반드시 rb_widget_위젯분류폴더명_위젯폴더명.zip 이어야 합니다. 개발한 위젯폴더가 mywidget 일 경우 우선 mywidget.zip 으로 압축한후 rb_widget_위젯분류폴더명_위젯폴더명.zip으로 파일명을 변경합니다.

주의 압축파일인 rb_widget_위젯분류폴더명_위젯폴더명.zip 의 압축을 풀었을때 mywidget 폴더가 생성되면 안되며 mywidget 폴더내의 파일들이 최상위에 풀려야 합니다. 위젯분류 폴더와 위젯폴더는 Rb에 설치되는 과정에서 자동으로 생성됩니다.

복수의 위젯을 패키징하려면?

mywidgets 이라는 위젯 분류폴더안에 widget1 , widget2 , widget3 등의 복수위젯이 있을경우 이 위젯들을 한번에 패키징해야 할 경우가 있습니다. 이 경우에는 설치파일을 반드시 rb_widget_위젯분류폴더명.zip 으로 패키징해야 합니다. 이때 패키징할 폴더는 위젯들이 들어있는 분류폴더인 mywidgets 이 됩니다.

주의 압축파일인 rb_widget_위젯분류폴더명.zip 의 압축을 풀었을때 mywidgets 폴더가 생성되면 안되며 mywidgets 폴더내의 위젯들이 최상위에 풀려야 합니다.

7. 활용 팁

위로