답변 5개 / 댓글 1개
헤더를 수정한 뒤 빌드하실 때, 앞 답변의 명령 실행 위치와 빌드 대상을 보완합니다. 공식 7.1.2 문서 기준입니다.
php artisan 명령은 artisan 파일이 있는 G7 설치 루트에서 실행합니다. 템플릿 폴더로 이동한 상태에서는 그 폴더에 artisan 파일이 없어 실행에 실패할 수 있습니다.
또한 기존에 설치·활성화한 사용자 템플릿의 TSX를 고친 경우, 기본 빌드가 어떤 폴더를 대상으로 하는지 확인해 주세요. 해당 버전의 template:build는 기본적으로 _bundled 쪽을 우선하고, --active 옵션은 활성 디렉터리를 대상으로 합니다. 다른 폴더의 소스를 빌드하면 화면에 수정이 반영되지 않았다고 느낄 수 있습니다.
# artisan 파일이 있는 G7 설치 루트에서 php artisan template:list php artisan help template:build # 설치 버전에서 --active 지원을 확인한 뒤, # 기존 사용자 템플릿의 활성 디렉터리를 수정한 경우의 예 php artisan template:build myvendor-menu --active
myvendor-menu는 예시이며, template:list에서 확인한 실제 사용자 템플릿 식별자로 바꾸셔야 합니다. 새 템플릿을 처음 만드는 상황은 별도의 build → install → activate 절차를 따릅니다. 번들 원본 수정이나 일괄 업데이트 명령을 메뉴 변경 작업과 함께 적용하기 전에, 어떤 디렉터리를 수정했는지부터 확인하시면 좋겠습니다.
근거: 공식 template:build의 기본 경로·--active 옵션, 공식 템플릿 제작·설치 흐름
공식 문서를 AI 도구로 대조한 보완 답변입니다. 질문자님의 설치 버전과 사용자 템플릿에서 직접 실행해 확인한 결과는 아닙니다.
게시판2 → 게시판1을 먼저 보여주고, 나머지는 API가 준 순서대로 뒤에 남기려면 다음처럼 하시면 됩니다. board2·board1은 게시판 이름이 아니라 실제 슬러그로 바꾸셔야 합니다.
const order = ["board2", "board1"];
const rank = new Map(order.map((slug, index) => [slug, index]));
const orderedBoards = [...boards].sort((a, b) =>
(rank.get(a.slug) ?? order.length) -
(rank.get(b.slug) ?? order.length)
);
const visibleBoards = orderedBoards.slice(0, maxVisibleBoards);
const hiddenBoards = orderedBoards.slice(maxVisibleBoards);
정렬은 보이는 메뉴와 더보기 메뉴를 나누기 전에 해주세요. [...boards]로 복사하는 이유는 원본 배열을 그대로 정렬해서 다른 곳에서 쓰는 순서까지 바뀌는 것을 막기 위해서입니다. 지정하지 않은 게시판끼리는 비교값이 0이라 현대 JavaScript의 안정 정렬에서 기존 순서가 유지됩니다.
이 배열 정렬 예시는 별도로 실행해 지정 순서, 미지정 게시판 유지, 원본 불변, 빈 목록을 확인했습니다. 질문자님의 G7에 직접 적용해 확인했다는 뜻은 아닙니다. 사용 중인 템플릿의 필드명과 boards 타입은 확인하셔야 합니다.
적용 후에는 PC·모바일에서 게시판이 전부 남아 있는지, 더보기 경계에서도 순서가 맞는지, 새 게시판을 하나 추가했을 때 뒤로 붙는지 확인해 보세요. 인기·쇼핑 버튼 자체를 옮기는 작업은 앞에서 안내된 헤더 JSX 수정이 별도로 필요합니다.
배열 정렬 동작 참고: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort
메뉴 순서 변경은 가능합니다.
다만 현재 그누보드7의 기본 sirsoft-basic 템플릿에서는 관리자 화면에서 상단 메뉴 순서를 직접 변경하는 기능은 제공되지 않는 것으로 확인됩니다.
기본 메뉴는 홈 → 인기 → 쇼핑 → 게시판 목록 순서로 구성되어 있고, 게시판 목록은 생성 시점이 오래된 순서로 출력됩니다.
원하시는 '게시판2 → 게시판1 → 인기 → 쇼핑' 순서로 변경하려면 기본 템플릿의 헤더 구성을 수정해야 합니다.
다만 기본 템플릿을 직접 수정하면 업데이트 시 변경 사항이 사라질 수 있으므로, 별도의 사용자 템플릿으로 복사하여 수정하는 방법을 권장합니다.
참고로 관련 커스터마이징 예제를 공유해 주신 분이 있어 아래 링크도 참고하시면 좋겠습니다.
https://github.com/glitter-node/sirsoft-basic_menu_reverse
Board::where('is_active', true)->select(['id','name','slug'])->orderBy('created_at', 'asc')->get();
// Header.tsx
const orderedBoards = [...boards].reverse(); // 생성 역순
const visibleBoards = orderedBoards.slice(0, maxVisibleBoards);
const hiddenBoards = orderedBoards.slice(maxVisibleBoards);
cd templates/_bundled/{템플릿ID}
npm ci
php artisan template:build {템플릿ID}
php artisan template:install {템플릿ID}
php artisan template:activate {템플릿ID}
가능합니다만
현재 기본 sirsoft-basic 템플릿에는 상단 메뉴의 순서를 관리하는 별도의 설정 기능은 없습니다.
기본 헤더 요소에서 메뉴가 홈 -> 인기 -> 쇼핑 -> 게시판 목록 순서로 구성되어 있습니다.
게시판 목록은 보드 메뉴 API에서 가져오며, 현재는 게시판 생성 시점이 오래된 것부터 반환됩니다.
따라서 게시판2 -> 게시판1 -> 인기 -> 쇼핑처럼 게시판과 인기/쇼핑 메뉴까지 포함해서 전체 순서를 변경하려면
헤더를 커스텀해야 합니다.
관리자 레이아웃 편집기에서도 헤더 자체를 하나로 다루기 때문에,
현재는 헤더 안의 개별 메뉴를 선택해서 순서를 변경할 수 없습니다.
계속 커스텀해서 사용하실 거라면
sirsoft-basic을 직접 수정하기보다는 별도의 사용자 템플릿을 만들어 헤더를 구현하는 방안이 적절합니다.
※ 사용 예제 :
sirsoft-basic 원본을 직접 수정하지 않고 별도의 '커스텀 사용자 템플릿'으로 분리하여,
상단 메뉴를 홈 -> 게시판 목록 -> 인기 -> 쇼핑 순서로 구성해 본 예제입니다.
- 참고 페이지 : https://sir.kr/portfolios/482
답변을 작성하려면 로그인이 필요합니다.