1. 개요
DX 사이드바 위치(dx-aside-position)는 DXCMS의 사이드바(aside)를 본문 왼쪽 또는 오른쪽으로 전환하는 유틸리티 플러그인입니다.• CSS order 속성만 사용 — JavaScript DOM 조작 없음
• 깜빡임(FOUC) 완전 방지 — dx_top 훅(priority 1)에서 CSS 선행 출력
• 전역 설정 + 게시판별 + 페이지별 개별 설정 지원
• DXCMS 기본 settings 테이블 사용 — 별도 DB 테이블 불필요
2. 설치
1. plugins/dx-aside-position/ 폴더를 DXCMS 설치 경로에 복사2. 관리자 → 플러그인 → DX 사이드바 위치 활성화
3. 관리자 사이드바에 레이아웃 → 사이드바 위치 메뉴가 자동 등록됩니다
4. 별도 DB 테이블 설치 없음 — DXCMS 기본 settings 테이블 사용
3. 관리자 메뉴
관리자 → 레이아웃 → 사이드바 위치 또는 /admin/aside-position 접속3-1. 전역 설정
개별 설정이 없는 모든 게시판·페이지에 적용되는 기본 위치를 설정합니다.| 옵션 | 설명 |
| ▶ 오른쪽 (기본) | 본문 왼쪽, 사이드바 오른쪽 — CSS 출력 없음 (오버헤드 0) |
| ◀ 왼쪽 | 사이드바 왼쪽, 본문 오른쪽 — CSS order 속성으로 전환 |
오른쪽이 기본값이므로 CSS가 전혀 출력되지 않아 성능상 이점이 있습니다.
3-2. 게시판별 설정
활성화된 게시판 목록이 표시되며 게시판마다 개별 위치를 설정할 수 있습니다.| 값 | 설명 |
| 전역 따름 | 전역 설정을 그대로 적용 (기본값) |
| ▶ 오른쪽 | 이 게시판만 오른쪽 고정 |
| ◀ 왼쪽 | 이 게시판만 왼쪽 고정 |
3-3. 페이지별 설정
등록된 페이지 목록이 자동으로 표시됩니다. 목록에 없는 페이지는 하단 입력창에 slug를 직접 입력해 추가할 수 있습니다.저장된 페이지 설정은 하단 "저장된 페이지 설정" 카드에서 개별 초기화할 수 있습니다.
4. 동작 방식
4-1. 우선순위 규칙
| 순위 | 조건 | 적용값 |
| 1 | 게시판 페이지 → dxap_board_{board_key} 설정값 조회 | 개별 설정값 (left/right) |
| 2 | 위 값이 "global"이면 | 전역(dxap_position) 사용 |
| 3 | 페이지 → dxap_page_{slug} 설정값 조회 | 개별 설정값 (left/right) |
| 4 | 위 값이 "global"이면 | 전역(dxap_position) 사용 |
| 5 | 결과가 "left"이면 CSS 출력 | "right"이면 CSS 없음 |
4-2. CSS 처리 방식
왼쪽 설정 시 아래 CSS만 출력됩니다. JavaScript 없이 순수 CSS만 사용합니다.
#dx-sidebar {
order: -1 !important; /* 사이드바를 flex 순서상 앞으로 */
}
#dx-main > div > div:not(aside) {
order: 1 !important; /* 본문을 flex 순서상 뒤로 */
}
오른쪽(기본)은 CSS가 전혀 출력되지 않아 오버헤드가 없습니다.
4-3. 훅 등록 순서
| 훅 | Priority | 역할 |
| dx_top | 1 | CSS 선행 출력 — 브라우저가 DOM 렌더링 전에 CSS를 먼저 적용 |
| dx_admin_top | 1 | 관리자 사이드바 링크 등록 + 독립 관리자 화면 진입 |
5. DB 저장 구조
DXCMS 기본 settings 테이블에 저장됩니다. 별도 테이블 불필요.| setting_key | setting_value | 설명 |
| dxap_position | right / left | 전역 기본값 |
| dxap_board_{board_key} | right / left / global | 게시판별 설정 |
| dxap_page_{slug} | right / left / global | 페이지별 설정 |
"global" 값은 전역 설정을 따르며, DB에서 해당 키가 없는 경우와 동일하게 처리됩니다.
6. 개발자 API
다른 플러그인에서 사이드바 위치를 프로그래밍으로 제어할 수 있습니다.| 함수 | 반환값 | 설명 |
| dxap_resolve($ctx) | 'left' | 'right' | 현재 컨텍스트의 최종 위치 반환 |
| dxap_global() | 'left' | 'right' | 전역 설정값만 반환 |
| dxap_save($key, $val) | void | settings 테이블에 키/값 저장 |
| dxap_load_all() | array | dxap_ 로 시작하는 모든 설정 배열 반환 (캐싱) |
사용 예시
// 플러그인 활성화 여부 확인 후 사용
if (function_exists('dxap_resolve')) {
$pos = dxap_resolve($ctx); // 'left' | 'right'
}
// 특정 게시판 왼쪽으로 강제 설정
dxap_save('dxap_board_my_board', 'left');
// 전역 위치 조회
$global = dxap_global(); // 'left' | 'right'
함수는 이 플러그인이 활성화된 경우에만 사용 가능합니다. function_exists()로 확인 후 사용하세요.
7. 파일 구조
| 파일 | 역할 |
| plugin.php | 훅 등록, 설정 함수 정의 (dxap_save, dxap_load_all, dxap_resolve 등) |
| manifest.php | 플러그인 메타 정보 (이름, 버전, 설명) |
| admin/index.php | 관리자 UI — 전역/게시판별/페이지별 설정 화면 |
8. FAQ
Q. 사이드바가 없는 페이지에서 왼쪽 CSS가 출력되면 문제가 생기나요?
#dx-sidebar가 존재하지 않으면 브라우저가 CSS를 무시합니다. 문제없습니다.Q. 페이지 목록에 원하는 페이지가 없어요.
페이지별 설정 탭 하단 입력창에 slug를 직접 입력해 추가할 수 있습니다.Q. 게시판 설정을 전역으로 되돌리려면?
"전역 따름"을 선택하고 저장하면 됩니다.Q. 모바일에서도 적용되나요?
CSS로 적용되므로 모바일에서도 동일하게 작동합니다. 다만 모바일에서는 테마에 따라 사이드바가 본문 아래로 이동하거나 숨겨질 수 있습니다.Q. 다른 플러그인이 사이드바 order 속성을 덮어쓰면?
!important가 적용되어 있어 일반적인 CSS에서는 덮어쓸 수 없습니다. 단, 다른 플러그인이 !important로 order를 설정하면 충돌할 수 있습니다.라이선스
디자인원엑스 라이선스 참고https://designonex.com/notice/view/1787577858493247
