템하마켓
그누보드 소스 가이드

Temhamarket Source Code Guide v1.0 |
ⓒTemhamarket

그누보드 샘플파일 다운받기

템플릿하우스 구조에 맞춘 그누보드 샘플 파일을 다운로드해, 나만의 디자인을 입혀보세요!

🔗 그누보드 샘플 파일 (전체구조 포함)
페이지 전체

그누보드란?

그누보드는 PHP와 MySQL 기반으로 제작된 오픈소스 게시판 솔루션입니다.
콘텐츠 관리 시스템(CMS)과 게시판 시스템(BBS)의 기능을 함께 갖추고 있어, 다양한 웹사이트를 손쉽게 만들 수 있도록 지원합니다.

그누보드 설치 방법

  1. 그누보드 설치를 위해 https://sir.kr/yc5_pds로 접속 합니다.

  2. 그누보드 설치 매뉴얼에 따라 그누보드(또는 영카트)를 설치합니다.

    🔗 영카트5 설치하기 https://sir.kr/manual/yc5/67
    🔗 그누보드5 설치하기 https://sir.kr/manual/g5/2

그누보드 Readme.txt

  • readme.txt는 기본 설치 방법에 대한 설명으로, 반드시 확인해주세요!

    === [템플릿명] (temha) 그누보드 테마 Readme ===
    Version: 1.0.0
    Maker: temhamarket
    Homepage: https://market.temha.io/

    [템플릿명] 테마는 템하마켓에서 제공하는 그누보드용 템플릿입니다.
    이 문서는 테마 설치 및 사용 방법에 대한 가이드입니다.

    ──────────────────────────────────────

    목차
    1. 테마 정보 및 라이선스
    2. 요구 사양 (제작 환경)
    3. 설치 방법
       - 3.1. 기본 설치 방법 (신규 그누보드)
       - 3.2. 수동 설치 방법 (기존 그누보드)
    4. 주요 기능 및 커스터마이징
       - 4.1. 페이지 구조 (page.php)
       - 4.2. 게시판 스킨 설정
       - 4.3. 신규 페이지 제작 가이드
       - 4.4. 헤더 및 푸터 설정
       - 4.5. 콘텐츠 동적 삽입 (문의폼/최신글)
       - 4.6. 템플릿하우스 에디터 연동
    5. 주의사항 및 추가 안내
    6. 문의 및 지원

    ──────────────────────────────────────

    1. 테마 정보 및 라이선스
    * 테마명: [템플릿명] (temha)
    * 제작자: temhamarket
    * 제작자 URI: https://market.temha.io/
    * 버전: 1.0.0
    * 라이선스: 일반 라이선스 (1프로젝트 1개 사업자만 사용 가능)
    * 라이선스 URI: https://market.temha.io/support/license_charge

    ──────────────────────────────────────

    2. 요구 사양 (제작 환경)
    * 언어 (Language): PHP 5.2.17 이상
    * 데이터베이스 (DB): MySQL 8.0.31 이상
    * 그누보드 버전: 5.5.9 이상 최신 버전

    ──────────────────────────────────────

    3. 설치 방법

    3.1. 기본 설치 방법 (신규 그누보드)
    처음 그누보드를 설치하는 경우 아래 순서대로 진행하세요.

    1. 다운로드한 그누보드 원본 코드를 서버의 /www/ 경로에 업로드합니다.
    2. /www/ 경로에 data 폴더를 생성하고, 웹브라우저에서 사이트에 접속하여 그누보드를 설치합니다.
    3. 설치된 사이트에 관리자 계정으로 로그인 후, 관리자 페이지 (/adm)로 이동합니다.
    4. 좌측 메뉴의 [테마 설정]에서 'temha' 테마를 찾아 적용합니다.
    5. [기본 환경설정] > [회원가입 설정]에서 '회원 스킨'을 (테마) temha_basic으로 변경 후 저장합니다.
    6. 사이트 구조에 맞게 페이지 및 게시판을 생성하고 커스터마이징합니다.

    3.2. 수동 설치 방법 (기존 그누보드)
    이미 그누보드가 설치된 사이트에 테마만 적용하는 경우 아래 순서대로 파일을 업로드하세요.
    (참고: https://sir.kr/manual/yc5/67)

    1. 테마 업로드: 다운로드한 테마 폴더 내의 /theme/temha 폴더를 서버의 /www/theme/ 경로에 업로드합니다.
    2. extend 업로드: /extend/ 폴더 내의 temha.extend.php, temha.form.extend.php 파일을 서버의 /www/extend/ 경로에 업로드합니다.
    3. form 업로드:
       * /form/ 폴더를 서버의 /www/ 경로에 업로드합니다.
       * /adm/form_admin/ 폴더를 서버의 /www/adm/ 경로에 업로드합니다.
    4. 기타 파일 업로드:
       * /page.php 파일을 서버의 /www/ 경로에 업로드합니다.
       * /adm/admin.menu*.php 등 관리자 메뉴 관련 파일을 업로드합니다.
    5. 쇼핑몰 파일 업로드 (영카트 사용 시): js, lib, shop 폴더를 /www/ 경로에 업로드합니다.

    ※ 코드 설명 및 유지보수에 대한 별도 문의는 받지 않습니다.

    ──────────────────────────────────────

    4. 주요 기능 및 커스터마이징

    4.1. 페이지 구조 (page.php)
    page.php는 http://도메인/page.php?id=페이지ID 형태의 URL로 독립적인 페이지를 생성하는 역할을 합니다.
    id 값에 해당하는 skin.php 파일을 동적으로 불러옵니다.

    * 동작 구조:

    <?php
                include_once('./_common.php');
                $id = isset($_GET['id']) ? preg_replace('/[^a-z0-9_]/i', '', $_GET['id']) : '';
                $skin_path = "{$pages_skin_path}/{$id}.skin.php"; // 예: /theme/temha/skin/pages/basic/about.skin.php
                // ... (중략)
                include_once($skin_path);
                // ...
                ?>
    * HTML 연동: 페이지 스킨 파일 (*.skin.php)은 자체 제작 에디터로 만든 HTML 파일을 불러와 <main> 태그 영역만 파싱하여 출력하는 구조입니다.

    4.2. 게시판 스킨 설정
    관리자 페이지에서 게시판 생성 시, 목적에 맞는 테마 스킨을 선택하여 사용할 수 있습니다.

    * 사용 가능한 게시판 스킨:
       * basic_table: 일반 목록형 게시판
       * gallery_grid: 그리드 갤러리 (바둑판식 정렬)
       * gallery_modern: 모던 카드형 갤러리
       * gallery_hor: 가로 목록형 갤러리 (이미지 + 텍스트)
       * gallery_full: 전체 너비 강조형 갤러리
       * notice_card: 텍스트 중심의 공지 카드형

    4.3. 신규 페이지 제작 가이드
    PHP 페이지는 /temha/ 폴더에 위치한 HTML 파일을 불러와 내용을 표시하는 방식으로 제작합니다.

    1. HTML 파일 작성:
       * 위치: /theme/temha/temha/페이지명.html
       * 이 위치에 페이지의 실제 디자인 내용을 HTML로 작성합니다.

    2. PHP 스킨 파일 작성:
       * 위치: /theme/temha/skin/pages/basic/페이지명.skin.php
       * 아래 코드를 사용하여 HTML 파일의 <main> 영역을 불러옵니다.

    <?php
                if (!defined("_GNUBOARD_")) exit;
                
                // 1. 불러올 HTML 파일 경로 지정
                $file_path_main = G5_THEME_PATH . '/temha/about.html';
                if (!file_exists($file_path_main)) {
                    die("파일을 찾을 수 없습니다: " . $file_path_main);
                }
                $html = file_get_contents($file_path_main);
                
                // 2. <main> 태그 영역만 추출
                preg_match('/(<main class="th-layout-main">.*?<\/main>)/s', $html, $block);
                $content = isset($block[1]) ? $block[1] : "내용을 찾을 수 없습니다.";
                
                // 3. 추출한 내용 출력
                echo $content;
                ?>

    4.4. 헤더 및 푸터 설정
    헤더와 푸터는 모든 페이지에 공통으로 적용되며, main.html 파일에서 <header>와 <footer> 태그를 각각 추출하여 구성합니다.

    * 헤더 파일: /theme/temha/head.php
    * 푸터 파일: /theme/temha/tail.php
    * 공통 리소스 관리: /theme/temha/head.sub.php
       * 이 파일에서 모든 페이지에 필요한 공통 CSS, JS 파일, 메타 태그, 파비콘 등을 관리합니다.
       * 특히 <base href="..."> 태그를 이용해 리소스의 상대경로 문제를 해결합니다.

    head.sub.php 주요 기능:
    1. <base href>로 모든 상대경로의 기준 URL을 임시 지정 (404 오류 방지)
    2. <meta> 태그를 통한 웹페이지 정보 설정
    3. 테마 전용 파비콘과 CSS 파일 로드
    4. JavaScript를 통한 경로 처리 및 <base> 태그 제거
    5. 로그인 메뉴 토글 기능

    4.5. 콘텐츠 동적 삽입 (문의폼/최신글)
    HTML 파일 내에 특정 주석 마커(<!--마커명-->)를 삽입하면, PHP가 해당 위치에 문의폼이나 최신글 목록을 동적으로 삽입합니다.

    * 사용 방법:
       1. HTML 파일에 마커 삽입: <!--board-latest--> 또는 <!--contact-form-->
       2. PHP 파일 (예: index.php)에서 form() 또는 latest() 함수로 콘텐츠를 생성합니다.
       3. str_replace() 함수를 사용해 마커를 생성된 HTML 콘텐츠로 치환합니다.

    * 예시 코드:
    // 최신글 HTML 생성
                ob_start();
                echo latest('theme/temha_basic', 'notice', 4, 23);
                $latest_html = ob_get_clean();
                
                // 문의폼 HTML 생성
                ob_start();
                echo form('theme/contact', 'main');
                $form_html = ob_get_clean();
                
                // $content의 마커를 실제 HTML로 치환
                $content = str_replace('<!--board-latest-->', $latest_html, $content);
                $content = str_replace('<!--contact-form-->', $form_html, $content);
    * 주의: 주석 마커의 이름을 임의로 변경하거나 삭제하면 콘텐츠가 표시되지 않습니다.

    4.6. 템플릿하우스 에디터 연동
    이 테마는 템플릿하우스에서 자체 제작한 에디터와의 연동을 위해 특별히 설계되었습니다.

    * 에디터 연동 방식:
       * 에디터에서 제작한 HTML 페이지는 FTP를 통해 /theme/temha/temha/ 폴더에 업로드됩니다.
       * /theme/temha/skin/pages/basic/*.skin.php 또는 /theme/temha/index.php는 해당 HTML 파일을 불러와 <main> 태그 기준으로 파싱하여 출력합니다.
       * HTML에는 CSS, JS, 이미지 등의 리소스가 포함되며 /temha/resources/ 하위에 위치합니다.
       * 파비콘을 업로드할 경우 /temha/resources/ 하위에 업로드하세요.
       * 리소스의 경로 문제를 방지하기 위해 /theme/temha/head.sub.php 내 <base href="..."> 선언을 통해 상대경로를 일괄 처리합니다.

    * 에디터 사용 시 주의사항:
       * 게시판 및 문의폼 블록에 사용된 <article class="board_blank"> 요소는 에디터에서 영역 보호를 위한 용도입니다.
       * 해당 페이지 내에서 이 요소를 제거하는 코드(preg_replace)를 삭제하면 숨겨진 레이아웃이 그대로 출력될 수 있으니 주의해 주세요.
       * CSS/JS 수정 시에는 FTP로 연동되므로 에디터에서 직접 수정이 불가능합니다.

    ──────────────────────────────────────

    5. 주의사항 및 추가 안내
    * G5_TEMHA_RESOUCES 상수: 테마의 CSS, JS 등 리소스 경로를 담고 있는 핵심 상수입니다. extend/temha.extend.php 파일이 누락되면 화면이 깨질 수 있습니다.
    * board_blank 클래스: 게시판/문의폼 블록에 포함된 <article class="board_blank"> 요소는 에디터 영역 보호용입니다. 관련 제거 코드를 삭제하면 숨겨진 레이아웃이 노출될 수 있으니 주의 바랍니다.
    * 메인 및 서브 페이지에 게시판 또는 폼 요소를 중간에 삽입하려면, 해당 페이지에 관련 함수를 추가한 후, 버퍼 함수를 사용해 생성된 HTML을 주석 마커 위치에 삽입하는 방식으로 구현해야 합니다.
    * 코드 설명 및 유지보수에 대한 개별 문의는 받지 않습니다.

    ──────────────────────────────────────

    6. 문의 및 지원
    테마 관련 문의 및 업데이트 정보는 아래 공식 사이트에서 확인해 주세요.

    * 템하마켓: https://market.temha.io/

그누보드 디렉토리 및 주요 파일 구조

  • 그누보드에 추가된 파일 설명

  • 아래의 디렉토리 구조는 그누보드 기본 파일을 템하 구조에 맞게 수정한 내용입니다.
    그누보드의 원본 디렉토리 구조는 그누보드 공식 사이트, 또는 Github 저장소 에서 확인하실 수 있습니다. 🔗 참고사이트 : https://github.com/gnuboard/gnuboard5

  • page.php

    페이지 스킨을 불러오는 파일

  • temha.extend.php

    템하 디렉토리 설정 및 페이징 처리 파일

  • temha.form.extend.php

    문의폼 관리 설정

  • form_admin, form

    문의폼을 사용하기 위한 파일

  • js, lib, shop

    쇼핑몰 템플릿에서 사용하기 위한 파일

사용자 정의 : temha.extend.php

  • temha.extend.php

    • temha.extend.php 는 테마에서 공통으로 사용하는 경로 설정과 함수들을 모아둔 파일입니다.
    • 필요한 상수 (G5_URL 등) 가 없을 경우 오류를 막기 위해 실행을 중단하며, 페이지 경로 설정이나
      페이지네이션 함수 (get_paging_new()) 같은 기능이 이 안에 포함되어 있습니다.

  • temha.extend.php 코드 설명

    NO.
    Description
    1
    • 필수 상수(G5_THEME_URL, G5_URL)가 정의되지 않았을 경우, 실행을 중단하여 무한 로딩이나 오류,
      레이아웃 깨짐 방지하는 안정장치 역할
    2
    • temha 테마 리소스 폴더 경로를 URL로 정의
    3
    • theme/basic 경로에서 pages 스킨의 실제 경로와 URL 정의
    4
    • 페이지네이션 함수 정의
    • get_paging_new($페이지수, $현재페이지, $전체페이지, $이동URL, $추가쿼리);
    • 사용예시 get_paging_new(5, 2, 10, “list.php”,”&bo_table=board”);

사용자 정의 폼 : temha.form.extend.php

  • temha.form.extend.php

    • temha.form.extend.php 는 폼을 화면에 표시하고 설정을 불러오는 역할을 하는 파일입니다.
    • 이 파일에선 지정된 폼의 디자인(스킨)을 불러오고, 폼에 필요한 경로와 데이터(DB) 정보를 설정하여 폼 기능이 제대로 동작할 수 있도록 처리하는 파일입니다.

  • temha.form.extend.php 코드 설명

    NO.
    Description
    1
    • 경로 및 URL 상수 정의
    2
    • DB 테이블 이름 등록
    3
    • 폼 출력 함수 :
      form($skin, $id) 지정한 폼 ID 의 설정을 불러오고, 해당 스킨이 존재하면 스킨을 불러와 폼을 출력합니다.
    • echo form(‘스킨 폴더 이름’, ‘폼 ID’);
    • 사용예시 echo form(‘theme/contact’,’sample’)

페이지 연결 : page.php

  • page.php

    • page.php 는 페이지 ID에 따라 원하는 스킨 파일을 불러오고,
      필요할 경우, 페이지마다 인터넷 브라우저 탭에 표시되는 타이틀을 설정할 수 있습니다.

  • page.php 코드 설명

    NO.
    Description
    1
    • ID 파라미터 가져오기 + 보안 처리 (경로조작, 스크립트 삽입 방지)
    2
    • 불러올 스킨 경로 설정 예시:
      id=’about’ 이면 → /skin/pages/about.skin.php
    • id에 따라 원하는 페이지 스킨을 동적을 불러올 수 있게 처리합니다.
    3
    • 타이틀 설정 (필요 시 사용)
      페이지마다 다르게 타이틀을 지정하고 싶을 때 쓰는 부분으로, ‘사용예시’와 같이 페이지별로 타이틀을 설정할 수 있습니다.

디자인 페이지 : page.skin.php

  • page.skin.php

    • page.skin.php 는 지정된 HTML 파일을 불러와 <main> 태그 기준으로 내용을 출력하는 파일입니다.

  • page.skin.php 코드 설명

    NO.
    Description
    1
    • 해당 HTML 파일을 불러와 <main> 태그 기준으로 내용을 출력합니다.
    • 주의사항 및 게시판 삽입 방식은 <index.php> 파일과 동일합니다.
    • 접속 경로는 /page.php?id=about 형식이며, 자세한 동작 방식은 page.php 코드 설명을 참고해 주세요.

메인 : index.php

  • index.php

    • index.php 는 상단(헤더)•하단(푸터) 공통 영역을 포함하고, HTML 파일을 불러와
      <main> 태그 기준으로 화면에 출력하는 메인 페이지입니다.

  • index.php 코드 설명 1 : 레이아웃 구조와 사용방법

    NO.
    Description
    1
    • 공통 헤더 파일을 포함시켜 상단 구조, 스타일시트, 메타 정보 등을 출력합니다.
    2
    • 해당 HTML 파일을 불러와 <main> 태그 기준으로 내용을 출력합니다.
      템플릿하우스 에디터와의 연동을 위한 파싱으로, 연동이 필요없을 경우 해당 HTML코드를 .php에 바로 입력하셔도 무방합니다.

      📌 HTML 위치를 변경하면 ‘$file_path_maiin’ 경로도 함께 수정해야 합니다.

    • 중간에 게시판을 넣고 싶을땐, 해당 페이지에서 latest 함수를 사용하여 세팅한 뒤,
      HTML내 원하는 위치에 주석마커( <!--marker--> ) 를 넣은 위치에 치환하는 방식으로 삽입합니다.

      📌 템플릿하우스 에디터 에서 기존 구조는 주석으로 교체해야 하며, CSS/JS 수정 시에는 FTP로 연동되니 주의하세요.

    3
    • 공통 푸터 파일을 포함시켜 하단 구조, 자바스크립트 등을 출력합니다.

  • index.php 코드 설명 2 : 게시판 연결 방법

    NO.
    Description
    1
    • 템플릿하우스 에디터에서 게시판이 표시될 영역을 보호하기 위해 사용된 요소를 제거합니다. 이 코드를 삭제하면 해당 요소가 사용자 화면에 그대로 노출될 수 있으니 주의하시기 바랍니다.
    2
    • 출력 버퍼를 사용하여 latest 함수로 불러온 최신글 HTML을 임시 저장합니다.
    • latest() 함수 사용법 : '스킨명' '게시판 ID' '출력 개수' '제목 글자 수' 형태로 총 4개의 인자를 전달해야 합니다.
    • 디자인 수정 : 해당 HTML 구조를 변경하고 싶다면, /theme/skin/latest/ 폴더에 있는 해당 스킨 파일을 수정해야 합니다.
    7
    • 저장된 HTML을 변수로 추출해서 파싱된 HTML 내 주석 위치( <!--board-latest--> ) 에 게시판 요소를 삽입하고
      최종적으로 완성된 HTML 콘텐츠를 출력합니다.

      📌 템플릿하우스 에디터에서 게시판이 적용될 블록 또는 주석 마커를 삭제한 상태로 FTP 전송 시,
      게시판이 출력되지 않으니 주의하세요.

헤더 : head.php

  • head.php

    • head.php 는 상단에 보여지는 헤더 영역을 불러오는 파일입니다.

  • head.php 코드 설명

    NO.
    Description
    1
    • 해당 HTML 파일을 불러와 <header> 태그 기준으로 파싱하여 내용을 출력합니다.
      추출한 <header> HTML 코드를 페이지 상단에 출력합니다.

      📌 HTML 위치를 변경하면 ‘$file_path_maiin’ 경로도 함께 수정해야 합니다.

    2
    • 출력 버퍼를 이용해 outlogin() 함수가 생성하는 외부 로그인 HTML을 가져옵니다.
    • 가져온 로그인 HTML을 <header> 내의 <--login--> 주석 위치에 삽입하여 최종 헤더를 완성합니다.

      • 📌 로그인 주석 위치는 반드시 header-utils 안에 넣어주세요, 로그인이 필요 없다면 주석 및 함수를 제거하시면 됩니다.

    3
    • 게시판 페이지에 출력되는 비주얼 섹션입니다.
    • 접속한 게시판 ID에 따라 특정 탭 메뉴를 노출합니다.
    • 게시판 블록과 마찬가지로 CSS와 JS는 수정할 수 있지만 HTML구조는 직접 수정할 수 없습니다.
    • 다만, 현재 방식이 아닌 특정 코드를 파싱하여 출력하는 방식으로 전환하면,
      에디터에서도 HTML 구조까지 수정이 가능해집니다.
    • 특정 코드를 파싱하여 출력하는 방식 예시

헤더 리소스 : head.sub.php

  • head.sub.php

    • head.sub.php 는 리소스 경로가 정확히 작동하도록 기준 경로 <base href> 를 설정하고, 테마 전용 CSS와
      파비콘 등을 불러오는 파일입니다.
    • 이 파일이 없거나 잘못 수정될 경우, 사이트 전체의 레이아웃이 깨질 수 있으므로 각별한 주의가 필요합니다.

  • head.sub.php 코드 설명

    NO.
    Description
    1
    • <base href> 는 HTML 내 모든 상대경로의 기준이 되는 기준 경로 (Base URL) 를 임시로 지정합니다.
      브라우저는 스크립트(4번)보다 HTML 태그를 먼저 렌더링하기 때문에, 스크립트가 실행되기 전에 이미지 등을 찾지 못해 발생하는 404 오류를 방지하는 역할을 합니다.
    • 추출한 src , href 등에서 사용되는 경로가 모두 이 값을 기준으로 처리됩니다.
    • 이는 에디터 연동 시 발생할 수 있는 리소스 경로 오류를 방지하기 위해, 상대경로를 일괄 처리하는 목적으로 사용됩니다.

      📌 [유지권장] 해당 태그는 JavaScript가 이미지 경로를 처리하기 전까지,
      페이지 로딩 중에 발생하는 404 오류를 방지합니다. 삭제해도 사이트가 깨지지는 않지만, 로딩 및 개발자 도구(F12) 콘솔에 불필요한 오류가 표시될 수 있습니다.

    2
    • 웹 문서에 대한 <meta> 태그를 추가하거나, 제거할 수 있습니다.
    • <meta> 태그란 웹페이지의 정보 (제목, 설명, 문자 인코딩 등)를 검색엔진이나 브라우저에 알려주는 태그로,
      사이트 설명을 설정하거나 모바일 화면에 맞게 표시되도록 도와줍니다. 즉, 눈에 보이지 않지만 웹페이지가 제대로 작동하고 검색에 잘 노출되도록 하는 데 중요한 역할을 합니다.
    3
    • 테마 전용 파비콘(브라우저 탭에 표시되는 작은 아이콘), CSS파일들을 순서대로 로드합니다.
    4
    • 페이지 로드가 완료되면, 이 스크립트가 모든 src 경로를 올바른 절대 경로로 다시 설정합니다.
      경로 처리가 모두 끝나면, 임시로 사용했던 1번의 <base> 태그를 HTML에서 최종적으로 제거합니다.

      📌 [삭제금지]temha 내부 HTML 리소스 경로 처리를 위해 이 설정은 반드시 필요합니다.

      📌 지정된 리소스 위치가 바뀌는 경우에는
      ‘G5_TEMHA_RESOUCES’ 상수를 함께 수정해야 정상적으로 리소스가 표시됩니다.

    5
    • 헤더의 회원 메뉴 버튼을 클릭했을 때, 로그인 정보가 담긴 영역을 보여주거나 숨기는 토글 기능을 처리합니다.
      로그인 기능을 사용하지 않을 경우 제거하셔도 무방합니다.

푸터 : tail.php

  • tail.php

    • tail.php 는 리소스 웹페이지 하단(푸터) 영역을 불러오는 파일입니다.
    • <footer> 안의 내용을 읽어와 화면 아래에 보여주며, 테마에 필요한JS 파일들도 이곳에서 불러옵니다.

  • tail.php 코드 설명

    NO.
    Description
    1
    • 해당 HTML 파일을 불러와 <footer> 태그 기준으로 파싱하여 내용을 불러옵니다.
    • 불러온 <footer> HTML 코드를 페이지 하단에 출력합니다.
    2
    • 테마 전용 JS파일들을 순서대로 로드합니다.

      📌 지정된 폴더 이름을 변경 시, 해당 경로도 함께 수정해야 하며, 리소스 위치가 바뀌는 경우에는
      ‘G5_TEMHA_RESOUCES’ 상수와 <base href> 경로를 모두 함께 수정해야 정상적으로 리소스가 표시됩니다.

      📌 HTML 위치를 변경하면 ‘$file_path_maiin’ 경로도 함께 수정해야 합니다.

게시판 : theme/board

  • theme/board

    • theme/board 는 템하 게시판 전용 스킨이 위치한 폴더로, 게시글 목록과 상세 페이지 디자인을 포함합니다.
    • 페이징 처리와 게시판 메뉴 등록 등의 기능은 temha.extend.php 와 관리자 페이지에서 설정합니다.

  • theme/board 설명

    Title
    Description

    템플릿
    하우스
    게시판
    스킨 안내

    • 본 스킨은 템플릿하우스에서 제공하는 게시판 전용 스킨입니다.
    • 게시글 목록과 상세 페이지가 스타일링되어 있으며, 페이징 처리는
      temha.extend.php 에 정의된 get_paging_new() 함수를 사용합니다.

    비주얼 영역 및
    <main>구조 안내

    • head.php php파일에서는 게시판 페이지일 경우 비주얼 영역이 출력됩니다.
    • 이때 <main> 태그를 열어주기 때문에, 해당 게시판 스킨 내부에서
      <main> 태그를 닫아주어야 합니다.

    제공되는 게시판 스킨 목록

    • basic_table : 리스트형 게시판으로, 날짜·제목·번호 등의 텍스트 정보가
      표 형식으로 나열된 가장 일반적인 형태의 게시판입니다.
    • gallery_full : 하나의 게시물을 큰 이미지와 함께 전체 너비로 강조하여 보여주는 갤러리형 게시판 입니다.
      포트폴리오나 대표적인 단일 콘텐츠를 보여줄 때 유용합니다.
    • gallery_grid : 이미지 썸네일과 제목이 포함된 카드를 바둑판(Grid) 형태로 깔끔하게 정렬한 갤러리형 게시판입니다.
    • gallery_hor : 이미지와 텍스트 콘텐츠가 가로로 배치된 2단 목록 형태의 게시판 입니다.
      이미지와 함께 요약된 설명을 제공하기에 적합합니다.
    • gallery_modren : 이미지와 제목, 내용 일부가 세련된 카드 형태로 정렬된 모던한 디자인의 갤러리형 게시판 입니다.
    • notice_card : 타이틀, 텍스트, 날짜 등의 정보가 카드 형태로 나열된 게시판으로,
      이미지 없이 간결한 정보 제공에 적합합니다.

    게시판 상세 :
    모든 게시판 UI 동일

    • 📌 게시판 상세 페이지는 모든 게시판에서 동일한 디자인(UI)을 사용하며, 글쓰기 디자인(UI)은
      기본 제공되지 않기 때문에 사용자가 직접 커스터마이징하여 사용해야 합니다.

  • 게시판 접속 경로

    Title
    Description

    게시판 접속 경로

    • /bbs/board.php?bo_table=테이블 이름

문의폼 : form.skin.php

  • form.skin.php

    • form.skin.php 는 관리자에서 설정한 문의폼 항목을 불러와 화면에 보여주는 스킨 파일로
      Ajax 전송과 유효성 검사를 지원하며, 구조는 게시판 스킨과 유사하게 동작합니다.

  • form.skin.php 설명 1 : 폼의 기능과 기본 구조

    NO.
    Description
    1
    • DB에서 해당 폼 ID($id) 에 맞는 항목들을 불러옵니다.
    2
    • 폼 제출 시 기본 동작(새로고침)을 막고 유효성 검사 + Ajax로 폼 데이터를 전송합니다.
    • 여기서 Ajax란, 화면을 새로고침하지 않고도 버튼을 누르면 내용이 바로 전송되거나, 일부 내용이 실시간으로 바뀌게 해주는 기술로 예를들어 문의폼을 작성하고 '보내기' 버튼을 눌렀을 때 페이지가 다시 로딩되지 않고 바로 결과가 보이는 기능입니다.
    3
    • 문의폼에서 사용되는 폼 구조입니다.
    • 해당 폼은 동적으로 ID가 지정되며, 상단의 스크립트에서 이 ID를 기준으로 동작을 제어합니다.
    • 폼 요소는 라디오 버튼, 체크박스, 텍스트 입력, 날짜 선택, 셀렉트박스, 텍스트영역, 파일 업로드 등으로
      구성되어 있으며, 기본 스타일은 templatehouse.css 에 정의되어 있습니다.
    • 문의 폼 전용 커스텀 스타일은 해당 블록 내에 포함되어 있습니다.

      📌 게시판 블록과 동일하게 CSS 및 JS는 자유롭게 수정 가능하지만, HTML 구조는 고정되어 있어 에디터에서 직접 수정이 불가능합니다.

  • form.skin.php 설명 2 : 폼 삽입

    NO.
    Description
    1
    • 해당 HTML 파일을 불러와 <main> 태그 기준으로 파싱하여 내용을 불러옵니다.
    2
    • form() 함수는 지정된 스킨 (theme/contact) 의 폼 (contact) 을 출력 합니다.
    • 이때 theme/contact 는 form.skin.php 파일이 위치한 폴더명이며, 게시판 스킨 구조와 동일한 방식으로 동작합니다.
    • 또한 게시판 스킨처럼 다양한 형태로 스킨 커스터마이징이 가능하며, form() 함수의 두 번째 인자인 폼 ID (contact) 는
      관리자 페이지에서 설정한 폼 ID 값을 입력해야 정상적으로 출력됩니다
    • 자세한 동작 방식은 temha.form.extend.php , form.skin.php 코드를 참고해주세요.
    • 관리자 페이지에서 추가한 폼 항목은 form.skin.php 에서 동적으로 관리됩니다.
    • 해당 항목들을 기반으로 생성된 HTML은 버퍼를 통해 변수에 저장되며, 게시판 블록과 동일하게
      파싱된 HTML 내 주석 마커( <!--contact-form--> ) 위치에 삽입되어 출력됩니다.

      📌 템플릿하우스 에디터에서 기존 구조는 주석으로 교체해야 하며, CSS/JS 수정 시에는 FTP로 연동되니 주의하세요.