ThemeForge Pro/Agent Kit

ThemeForge 마크업

ThemeForge는 정적 HTML로부터 고전 WordPress 테마를 구축합니다. 편집 가능한 부분을 HTML 속성으로 표시합니다: fld-*는 페이지 필드, opt-*는 사이트 전체 설정, tax-*는 카테고리 필드, wp-*는 WordPress 자체(글, 메뉴, 상품)에 사용합니다. 생성기는 이를 관리자 필드, 페이지 템플릿, 사이트 소유자가 편집하는 관리자 화면으로 변환합니다. 디자인은 그대로 유지됩니다.

규칙은 https://themeforge.pro/ai 에 있으며 생성기와 함께 변경됩니다. 기억이나 이 파일에 의존하여 마크업하지 마세요: 매 세션마다 규칙을 가져오세요. 이 스킬은 작업 순서만 알려줍니다.

1. 먼저 사이트 맵에 동의하세요

마크업을 작성하기 전에 사이트 맵을 보내고 확인을 기다리세요:

• 각 페이지 파일과 그 슬러그(index.html, menu.html, contacts.html…) — 파일 이름이 WordPress 템플릿을 결정하므로, blog.html은 블로그 피드가 아닌 'blog'라는 페이지입니다;
• 콘텐츠 유형: 블로그 글, 상품, 사용자 정의 유형 및 해당 카테고리;
• 사이트 전체에 적용되는 것(헤더, 푸터, 연락처) — theme-options.html에 넣습니다;
• 언어.

2. 필요한 규칙을 가져오세요

GET https://themeforge.pro/ai              시작 페이지: 먼저 읽기
GET https://themeforge.pro/ai?m=core       항상, 마크업 전에
GET https://themeforge.pro/ai?m=build      사이트를 주석 처리하지 않고 **생성**할 때
GET https://themeforge.pro/ai?m=<module>   pages · blog · cpt · woocommerce · deploy · legacy

이 사이트에 필요한 모듈만 로드하세요: 상점이 없는 카페는 woocommerce를 읽지 않습니다.

3. 작업하면서 마크업하세요

각 섹션을 작성하거나 읽을 때 속성을 추가하고, 두 번째 패스에서 하지 마세요. 대부분의 오류를 잡는 검사는 규칙에 따르면 다음과 같습니다:

• 모든 페이지는 <body>에 wp-fields-group이 있어야 하며, 그렇지 않으면 필드가 없습니다;
• 모든 필드에는 이름이 있습니다; 링크와 그 캡션은 다른 이름을 가집니다 (Button / Button text);
• 목록(fld-loop)에서는 첫 번째 카드뿐만 아니라 모든 카드가 속성을 가져야 합니다;
• 사이트 전체 필드는 theme-options.html에 선언됩니다.

4. 무료로, 계정 없이 검사하세요

모든 페이지 세트를 한 번의 요청으로 보내고 "ok": true가 나올 때까지 반복하세요:

POST https://themeforge.pro/api/validate-markup
Content-Type: application/json

{"pages":[{"name":"index.html","html":"…"},{"name":"theme-options.html","html":"…"}]}

또는 이 키트에서 node scripts/validate.mjs <사이트-폴더>를 실행하세요. error는 테마를 깨뜨리고, warning은 무언가 조용히 빠졌음을, hint는 알아두면 좋습니다. 아무것도 저장되지 않습니다.

5. 인계하세요

?m=deploy를 따르세요: 사이트 콘텐츠의 ZIP 하나(루트에 index.html). 사용자가 https://themeforge.pro에서 프로젝트에 업로드하고, 브라우저에서 테마의 WordPress 관리자를 무료로 열며, 구독으로 테마를 다운로드합니다. 프로젝트 ID와 토큰을 제공하면 deploy 모듈이 HTTP를 통해 테마를 직접 구축하는 방법을 보여줍니다.

참고 자료

• 사람을 위한 속성 참고: https://themeforge.pro/docs
• 마크업 가이드: https://themeforge.pro/docs/ai-guide
• 속성 사전(JSON): https://themeforge.pro/api/attributes
• 완전한 마크업 예시: 이 키트의 examples/warm-corner/