라공

[라공에디션] 메인 게시판 스킨

20,000원

라공에디션개인홈갠홈메인스킨메인게시판홈페이지꾸미기

코드? CSS? 그게 뭔데...
몰라도 메인을 예쁘게 꾸미고 싶어!

그에 대한 이해도가 없어도 꾸밀 수 있다! 를 목표로 제작했습니다.

▶직관적인 꾸미기

: 실시간 미리보기, 리사이즈 핸들, 드래그 앤 드랍으로 요소 삽입

2e7f87cf3affc24603e6872722cb81ac_Kw9yCZlf_ecb853f4772db61d20d933caf04f3fa64f118b56.webp
 



예시 영상: 풀

길이가 길기 때문에, 한 파트씩 하단에 설명합니다.


레이아웃: 컨테이너 = 프리셋에 보이는 박스 1개

레이어: 요소 = 이미지, 텍스트 등 우리가 설정해서 넣는 거

레이아웃 1개에 여러 개의 레이어를 넣을 수도 있지만, Z값 없이 '층'으로 쌓입니다!


레이어 타입 : 기본

▼ 보이는 것 외에도 더 있어서, 하나씩 설명하겠습니다😅
clipboard_1766576893964.png


1. 탭 레이어

한 화면 내에서 버튼으로 다른 화면을 오가는 탭(라벨형, 아이콘형, 도형)

*게시판 레이어를 탭 페이지로 사용 중(링크 배너 / 디데이 게시판 스킨)

메인-탭레이어.gif


2. 텍스트 레이어

에디터를 이용하여 텍스트 / html을 사용할 수 있는 레이어


3. 슬라이드 / 4. 게시판 이미지 슬라이드

· 슬라이드
: 1~3개 원하는 이미지에 제목+내용 추가 가능

· 게시판 이미지 슬라이드
: 특정 게시판의 최신글 내 이미지를 1장 추출하여 최대 10장까지 나열
: 이미지는 본문에 업로드 된 이미지 우선, 없을 경우 대표 이미지를 추출
: 게시글의 제목, 내용을 표시할 지 선택할 수 있음
00cb2a9477993426739570671.gif
메인-게시판 슬라이드.gif

5. 단일 이미지

영역 내 원하는 이미지를 '채우기 / 전체 보기 / 원본 사이즈' 중 표시 


6. 갤러리 / 7. 게시판 이미지 갤러리

· 갤러리
: 이미지 여러장을 원하는 열수로 1:1 비율 출력하며, 클릭 시 모달로 표시

· 게시판 이미지 갤러리
: 특정 게시판의 최신글 내 이미지를 1장 추출하여 최대 10열까지 나열
: 이미지는 본문에 업로드 된 이미지 우선, 없을 경우 대표 이미지를 추출
: 클릭 시 게시판으로 이동
0c6c3f6961895814827257376.gif
clipboard_1765600755466.png

8. 카드형 나열

1~3장 설정 가능 / 카드 별 이미지·배경색·내용색·클릭 시 URL 설정 가능

스크린샷 2025-11-11 213328.png


9. 최신글 위젯

· 스킨(기본, 사이드바)

: 전체/특정 게시판의 최신글을 리스트형으로 나열


· 스킨(다이어리)

: 특정 게시판의 최신글 1개의 제목/내용을 출력

clipboard_1765602230019.png
clipboard_1765602233074.png

10. 게시판 전체 페이지 / 11. 외부 콘텐츠

특정 게시판, 사이트를 Iframe으로 imbed(불러오기)
*이때, 특정 게시판의 경우에는 조작을 위한 용도가 아닙니다.
헤더 및 푸터를 '숨기기' 해둔 상태일 뿐이라 페이지 이동이 발생하면 메뉴가 뜹니다.

 

12. 회원 정보 / 13. 회원 카드

· 회원 정보

: 회원 정보 + 알림 + 버튼 탭 표시


· 회원 카드

: 회원 정보 + 관리자 페이지 소개글 + SNS 링크 추가 가능

clipboard_1765603245263.png
clipboard_1765603209171.png



14. 소개글 / 15. 한줄 공지

관리자 페이지와 연동

 fb4c5211205097867136229859.webp



16. 시계 / 17.달력

기본 메인의 시계 및 달력과 유사

시계의 경우엔 다양한 타입이 있음.

clipboard_1765603498030.png


18. 이웃 새글 피드

라공 에디션 1.3.0 이후 추가된 '새글 피드'와 연동되며
사진은 출력하지 않고, 리스트만 출력

clipboard_1766577061147.png



19. 현재 접속자

현재 접속한 멤버의 프로필 사진, 이름, ID를 표시

clipboard_1766577084999.png


레이어 타입 : 특수

특정 게시판, 특정 위젯이 있을 경우 출력되는 레이어 타입

clipboard_1765603580660.png
스크린샷 2025-12-17 125335.png

특수 타입이 출력되지 않을 땐!
해당 스킨이나 위젯의 폴더명을 원본 상태로 만들어주시면 됩니다.
ex. diary_up_251224_0 (X) / diary_up (O)

① 투두리스트 위젯

투두리스트의 할일 중 '최신'을 뽑아 최대 50개까지 출력

*위젯이므로, 게시판 내에서 체크를 반영할 수는 X

clipboard_1765603714600.png


다이어리 스킨

1. 미니 달력형

: 일반 달력처럼 출력되며, 할 일 및 투두가 있는 날짜에 지정 색상으로 표시

: 클릭 시 달력으로 이동


2. 미니 투두형

: 오늘 날짜의 '투두'만 출력하며, 지정 색상 라벨로 표시

: 실제 체크도 반영되나, 새로고침 필요!

clipboard_1765603986523.png



대화형 백업 스킨 - 모던 아카이브

해당 게시판의 '특정 게시글' 불러와 채팅처럼 표시
'직접 입력' 방식일 경우 메인 내 사용도 가능!

스크린샷 2025-12-17 133619.png





+

251224_0 업데이트 이후

상단 헤더 및 관리 패널이 메뉴, 관리자 메뉴와 겹치는 문제가 있어

토글 레이아웃으로 수정되었습니다.

메인스킨-토글개편.gif


상단 헤더 버튼 -> 토글 버튼으로 수정
토글 버튼: 통합 위젯 툴바 우측에 최초 위치로 배치되며, 드래그 앤 드랍으로 위치 수정 가능

우측 사이드 패널 -> 토글 버튼 오른쪽에서 플로팅 형태로 생성.
토글 버튼의 위치 수정 시 패널도 함께 이동됨.


1. 프리셋 선택

47646310413250325428490651.webp

프리셋 중 마음에 드는 걸 고릅니다.

*예시 영상에서는 'NESTED SECTIONS'를 사용했습니다.


2. 게시판 설정

25a07a12077730873111280496.webp

처음 들어가면 프리셋과 다른 찌그러진 화면에 당황하지 마시고,

토글 버튼 내 '게시판 설정'을 눌러 컨테이너 높이를 90이하로 바꿔줍니다.

가로 사이즈는 1400 이하로 두시면 좋습니다만, 필요에 따라 확장하셔도 됩니다.

100을 초과하는 수치는 px, 이하의 수치는 %로 인식합니다.



3. 섹션(레이아웃) 관리 패널

섹션 내 요소를 편집할 수 있습니다.

0e1b6516027473152347588025.gif


섹션 관리를 눌러 나오는 '리사이즈 핸들'을 통해 직관적인 크기 조절이 가능합니다.

우측의 입력창과 연동되며, %로 입력하는 것도 가능합니다.

섹션 내 요소들의 '정렬: 가로-세로'도 이 패널에서 조정합니다.


모바일 반응형 추가(251107_0)

- 모바일에서는 무조건 '세로형 정렬'로 출력

- 보이지 않게 하고 싶은 섹션이 있는 경우, 섹션 관리-모바일 숨김 체크

4b8ba1220119812070908615.webp


4. 레이어(요소) 패널

a56b9c7337075941535463347.webp

레이어 목록-레이어 추가 시 우측 패널에 편집이 나타납니다.


원하는 레이어 타입을 선택하여, 설정한 후 원하는 섹션(레이아웃)에 드래그 앤 드랍합니다.

3bd0d815906350402215336801.gif

5. 고정섹션 관리

프리셋과 별개의 레이아웃을 추가합니다.

최대 3개까지 추가할 수 있으며, 리사이즈 핸들과 자유로운 위치 이동을 지원합니다.

646ab210396436059641708236.gif


탭 레이어 출력 순서 변경 기능(+251120_0)

clipboard_1763627102712.png


마우스로 직접 핸들을 잡고 드래그 앤 드랍 혹은 위아래 버튼을 클릭하여 순서를 변경합니다.

이때, 페이지 새로고침이 되므로 주의해 주십시오.



레이어 기울기 옵션 추가(+251128_0)

스크린샷 2025-11-28 204714.png

기울기에 -3deg (반시계 방향) 혹은 3deg(시계 방향) 식으로 입력합니다.

*X축, Y축은 3D로 기웁니다.

## 포함 파일

_common.php
ajax.create_layer.php
ajax.delete_border_image.php
ajax.delete_file.php
ajax.delete_fixed_section.php
ajax.delete_layer.php
ajax.load_layer_form.php
ajax.load_layer_list.php
ajax.remove_layer_from_section.php
ajax.save_board_settings.php
ajax.save_fixed_section.php
ajax.save_section_config.php
ajax.toggle_section.php
ajax.update_gallery_order.php
ajax.update_layer.php
ajax.update_layer_order.php
ajax.update_layer_section.php
ajax.update_preset.php
ajax.update_section_size.php
ajax.upload_border_image.php
ajax/
└── get_posts.php
board_iframe.php
layer_config.php
layer_functions.php
layer_options.php
layout_functions.php
layout_functions_fixed.php
list.skin.php
list.skin.preset.php
list.skin.script.php
style.css
style.preset.css
widgets/
├── archive_view.php
├── calendar_script.php
├── clock_script.php
├── diary_calendar.php
├── diary_todo.php
├── member_card.php
├── member_info_logged_in.php
├── member_info_login_form.php
├── notification_list.php
└── widget_todoup.php
write.script.js
write.skin.php

**총 44개 파일**

테스트 환경

라공 에디션용

php 8.2 / 라공 에디션


구매 전 확인 사항

무조건 새 게시판을 만드셔야 합니다.

기존에 사용하던 게시판에 덮으시면 안 됩니다. 날아갈 수도 있습니다.

주의사항

스킨 오류 외 스타일 커스텀 및 기능 추가에 대한 문의는 답변하지 않습니다.

외에, 커스텀이 많이 들어간 홈페이지의 경우엔 답변이 어렵습니다 ㅠㅠ

추가적인 안내가 생길 경우 갱신하겠습니다!

스킨 설치 방법

링크: URL


스킨 적용게시판 관리 

2e7f87cf3affc24603e6872722cb81ac_y0RsVmFA_5ffc1301dacf0e668b8392def4e0c8cf6e660589.webp 

게시판 타입: 일반 게시판

분류: 카테고리! 사용하지 않습니다. 체크를 풀어줍니다.

비밀글 사용: 사용하지 않음

DHTML 에디터 사용: 체크해 줍니다.

파일 업로드 개수: 갤러리에 사용할 갯수만큼 (20개 전후 권장)

스킨 디렉토리: 다운로드 후 설치하신 메인 스킨 폴더로 변경(main_up)해 줍니다.


2e7f87cf3affc24603e6872722cb81ac_KuvThGYV_7b08d7346b10155dd3d8b3b22fc171a9e7d85185.webp 

디자인 관리-메인페이지 설정에서 '게시판 제목'을 방금 설정한 게시판으로 바꿔줍니다. (main.php 아님)

궁금한 사항이 해결되지 않으셨나요? QnA 게시판에서 문의하실 수 있습니다.

251104_0 발행
-
251104_1 업데이트
  • 최신글 타입 '기본' 스킨 파일 추가
251105_0 업데이트
  • '존재하지 않는 게시판입니다.' 출력 문제 (라공에디션 0.4.2 업데이트)
  • 슬라이드, 카드 타입: 기존 이미지 미리보기 및 삭제 지원
  • 갤러리 타입: 이미지 순서 변경 = 출력 순서에 반영되도록 수정
251106_0 업데이트
  • 상단바: 기본 상태를 접힘으로 변경
  • 카드 타입 링크 추가 시에도 균등하게 나오도록 수정
  • 회원 정보: 로그인 창 박스 삭제 후 중앙 정렬로 변경
251108_0 업데이트 (7_0 파일은 경로 오류가 있습니다!)
  • 컨테이너 섹션(내부 섹션을 감싸고 있는 컨테이너)에 비율지정
    • 길이가 화면을 넘어갔을 때, 헤더나 푸터 등이 밀려나던 문제 수정
    • 보다 유연한 반응형 제공
  • 모바일 반응형 추가
    • 모바일에서는 무조건 '세로형 정렬'로 출력
    • 보이지 않게 하고 싶은 섹션이 있는 경우, 섹션 관리-모바일 숨김 체크 
  • 카드 타입: 이미지가 카드 바깥을 뚫는 등 비율 외로 깨지는 문제
  • 단일 이미지: 이미지가 둥글기 적용을 받지 않는 문제 
251115_0 업데이트
  • 라공에디션 v1.0.3 호환 / 라공 에디터 지원
  • 메인 스킨 상단의 여백 삭제
251120_0 업데이트
  • 고정 섹션 삭제가 불가능 했던 문제(404 출력)
  • 다른 고정 섹션 내 동일한 레이어가 출력되는 문제
  • 고정 섹션 내의 레이어를 수정할 시 섹션 내 레이어가 사라지는 문제
  • 탭 레이어 혹은 탭 내부의 레이어를 수정할 시 해당 섹션 내 탭 레이어가 사라지는 문제
  • 탭 내부의 레이어 순서를 변경할 수 있도록 기능 추가
  • 레이어 투명도 0%를 인식하지 못하는 문제 
  • 폼 색상이 홈페이지와 연동되어있어, 밝은 색일 경우 보이지 않음
251128_0 업데이트
  • 레이어 기울기 옵션 추가
  • 슬라이드 레이어 '전환-확대'가 적용되지 않던 문제
  • 달력 레이어 '년-월 헤더'가 적용되지 않던 문제
  • 갤러리 레이어-이미지 링크가 적용되지 않던 문제
  • 메인스킨 상단의 설정-가로 폭 변경 기능 추가
251204_0 업데이트
  • 달력 레이어 설정: - 년-월 헤더 체크 해제 시에도 헤더가 표시되던 문제 수정
  • 헤더에서 현재 버전 표시
251208_0 업데이트

  • 메인 스킨에서 '텍스트 레이어' 사용 시 양식이 적용되지 않는 문제
  • 한줄 공지 영역의 텍스트 색상이 흰색으로 출력되는 문제
  • 섹션 컨테이너의 높이 or 너비 값도 변경할 수 있도록 추가
  • 레이어 설정-테두리 이미지 추가(업로드, 외부 링크 모두 지원)
  • 슬라이드/이미지 레이어 내 파일 삭제 시 즉시 반영되도록 수정
  • 모바일 숨김 처리가 된 고정섹션이 모바일에서 보이는 문제
  • 카드 타입 설정의 텍스트 색상이 제목에도 적용되도록 수정

251213_0 업데이트
  • 라공 에디션 v1.1.9 호환 (최신글)
  • 레이어 타입 출력 순서 변경
  • 레이어 타입 추가
    • 게시판 이미지 슬라이드
    • 게시판 이미지 갤러리
    • 회원 카드
    • 최신글 위젯: '다이어리' 스킨 추가
    • DIARY_UP 스킨 보유 시 : 미니 달력, 미니 투두 타입 출력
    • TODOUP 위젯 보유 시 : 투두리스트 위젯 타입 출력
251214_0 업데이트
  • 3840*2160 해상도에서 관리 창이 튀어나와 보이는 현상 수정
  • 섹션 관리가 저장되지 않던 부분 수정
251217_0 업데이트
  • 대화형 백업 스킨: 모던 아카이브(archive_up)가 존재할 경우 레이어 타입 추가
    • 해당 게시판의 '특정 게시글' 불러오기
    • 메인 화면에서 직접적인 채팅 방식으로 사용도 가능!
  • 게시판 이미지 슬라이드, 게시판 이미지 갤러리가 '링크로 추가한 이미지'도 인식하도록
251224_0 업데이트

  • 작동 방식(토글 레이아웃) 수정
    • 상단 헤더 및 관리 패널이 메뉴, 관리자 메뉴와 겹치는 문제가 있어 다음과 같이 수정되었습니다.
    • 상단 헤더 버튼 -> 토글 버튼으로 수정
    • 토글 버튼: 통합 위젯 툴바 우측에 최초 위치로 배치되며, 드래그 앤 드랍으로 위치 수정 가능
    • 기존 헤더 내부 '편집모드, 프리셋 변경, 게시판 설정, 섹션 관리, 고정 섹션 관리, 레이어 목록'은 토글 버튼을 통해 진입
    • 우측 사이드 패널 -> 토글 버튼 오른쪽에서 플로팅 형태로 생성. 토글 버튼의 위치 수정 시 패널도 함께 이동됨. 레이어 추가/삭제 등의 변경 시에도 닫히지 않으며, 닫기 버튼을 통해서만 종료.
  • 레이어 목록 추가
    • 새글 피드 레이어
    • 현재 접속자 목록
  • 오류 수정
    • 카드형 나열 레이어에서 이미지 등록이 번호대로 들어가지 않는 문제
    •  F-PATTERN 프리셋 선택 시 주요 섹션들의 가로사이즈를 조절할 수 없던 문제
    • 편집 모드 저장 시 레이아웃이 날아가는 문제
    • 탭 레이어에 로그인 페이지(회원 정보 - 로그인 폼)를 하위 레이어로 넣으면 보이지 않는 문제

251225_0 업데이트
  • 편집 완료 버튼을 누르면 섹션에 배치된 레이어가 사라지는 현상
  • 첫 번째 이미지만 출력되는 현상(슬라이드, 카드형 모두)


×