
이것은 Eleventy로 제작 된 가벼운 포트폴리오 Starterkit입니다. 디자이너, 일러스트 레이터, 건축가 및 자신의 작업과 활동을 공유하는 데 관심이있는 다른 개인을 대상으로합니다.
의도 된 사용자는 코딩 방법을 모르지만 웹 사이트 뒤에있는 기술에 관심이 있고 Markdown에 기꺼이 작성하고 있으며이 문서를 기꺼이 따르고 있습니다.
Portfolio-Starter.sb-ph.com을 방문하여 확인하십시오. 이 저장소의 컨텐츠 및 코드는 데모 사이트를 구동합니다.
"No-Code"는 약간 의 오해입니다. 콘텐츠 파일은 기술적으로 코드로 작성되었지만 Markdown이라는 매우 읽기 쉬운 구문입니다 (나중에 자세히 설명). “코드 없음”이 의미하는 것은 컴퓨터에서 명령 줄, git 또는 코드 편집기를 열 필요가 없다는 것입니다.
Github는 코드를 저장하는 플랫폼입니다. 귀하의 웹 사이트 코드 및 컨텐츠는 Github에서 살 것입니다. 계정이 이미있는 경우 계속해서 로그인하십시오. 그렇지 않은 경우 계정에 가입하십시오. 무료 개인 계정으로는 충분합니다.
NetLify 및 Zeit은 정적 웹 사이트를 가진 사람들에게 관대 한 무료 계층을 제공하는 제공 업체입니다. NetLify는 아마도 다음 단계에서 더 간단하고 더 단단하고 더 많은 사용자가 사용하는 것처럼 보이지만 둘 다 견고한 플랫폼입니다. 이 플랫폼 중 하나가 이미있는 계정이있는 경우 로그인하십시오. 그렇지 않은 경우 가입하십시오.
아래 버튼 중 하나를 클릭하면이 저장소 (즉, 자체 GitHub 계정에있는 중복 버전을 작성)를 복제 한 다음이 새 웹 사이트를 정적 호스팅에 배포합니다.
진행하기 전에 저장소 이름을 결정하십시오. 사이트 이름과 비슷한 것이지만 소문자, 숫자 및 대시 만 포함해야합니다. 예를 들어,이 저장소의 이름은 portfolio-starter 입니다.
NetLify 계정이있는 경우이 버튼을 클릭하고 NetLify의 간단한 지침을 따라 NetLify 및 GitHub를 연결하십시오.
Zeit 계정이있는 경우 아래 버튼을 클릭 한 다음 Zeit의 지침을 따르십시오.
Zeit의 지침은 Github 용 Zeit을 지금 설치하는 방법을 안내하여 저장소를 만들고 변경 사항을 배포 할 수 있도록합니다. 지금 Zeit을 설치할 때 모든 리포지토리에 허가를 받으십시오. Zeit은 다음과 같이 설정과 함께 Eleventy를 사용하고 있음을 자동 감지해야합니다 (개발 명령에 대해 걱정할 필요가 없습니다).
빌드 명령 : npx @11ty/eleventy 출력 디렉토리 : _site
NetLify 또는 Zeit의 위의 지침에 따라 완료되면 웹 사이트 대시 보드로 리디렉션됩니다. 기본 하위 도메인 및 귀하의 사이트에 대한 기타 중요한 정보가 표시됩니다. 서비스가 연결되어 있음을 알려주는 이메일도받을 수 있습니다.
Zeit을 사용하면 저장소를 설정할 때 리포지토리의 가시성을 선택할 수 있습니다. 반면에 NetLify는 공개 저장소를 자동으로 생성합니다. 저장소의 가시성을 조정하려면 github 문서를 참조하십시오.
명령 줄없이 컨텐츠를 편집하거나 추가하려면 github의 인터페이스를 사용하여 리포지토리의 /content 폴더 내에서 파일을 탐색해야합니다. /content 폴더의 구조와 해당 파일의 각 파일, 특히 웹 사이트 제목 및 URL을 포함하는 글로벌 데이터 파일에 대한 자세한 내용은 컨텐츠 참조를 참조하십시오.
기존 파일을 편집하거나 삭제하려면 GitHub에서 관련 파일을 열고 페이지 내용 위의 오른쪽 상단 모서리의 편집 버튼 (연필 아이콘이있는 버튼)을 클릭해야합니다.
새 페이지를 추가하려면 추가하려는 내용에 따라 posts , projects 또는 pages 폴더로 이동 한 다음 페이지 상단 근처의 "새 파일 작성"버튼을 클릭해야합니다. 파일 이름과 파일 내용을 추가 할 수있는 새 편집기 페이지가 열립니다. 모든 텍스트 내용은 Markdown으로 작성되므로 파일 이름은 md (예 : my-post-name.md )로 끝나야합니다.
미디어를 추가하려면 media 폴더로 이동 한 다음 페이지 상단 근처의 "파일 업로드"버튼을 클릭해야합니다. 이렇게하면 하나 이상의 파일을 업로드 할 수있는 영역이 제공됩니다. 파일 유형 및 크기에 대한 팁은 미디어 지침을 참조하십시오.
GitHub에서 작성된 편집 또는 추가 사항을 저장하려면 페이지 기반의 GitHub의 인터페이스를 사용하여 변경 사항을 커밋해야합니다. 이전 단계에서 NetLify 또는 Zeit을 연결 한 경우 커밋은 Github에게 변경 사항을 자동으로 배포하도록 지시합니다. 커밋이 무엇인지에 대한 자세한 내용은 Github 용어집을 참조하십시오. GitHub에서 편집 또는 추가를 직접 커밋 할 때 미리 채워진 기본 커밋 메시지를 사용할 수 있으며 master 브랜치 (기본 설정)에 직접 커밋해야합니다.
명령 줄 설정 지침은 명령 줄에 익숙해지고 컴퓨터에 Node.js가 설치되어 있고 GitHub 계정이 있다고 가정합니다.
git clone https://github.com/sb-ph/portfolio-starter.git my-website 실행하여 cd my-website 를 실행하여 새로운 프로젝트 폴더로 변경하여 클론 리포지토리를 로컬로 이름 지정된 프로젝트 폴더로 로컬로 사용하십시오. npm install 실행하여 Eleventy를 포함한 종속성을 설치하십시오.
rm -rf .git 실행하여 새로운 시작을 위해 GIT 기록을 제거한 다음 git init 실행하여 새로운 git repo를 초기화하십시오. 모든 파일을 커밋하여 새 master 브랜치를 만들고 명령 줄을 사용하여 프로젝트를 GitHub에 추가하십시오.
Gitignored /_site 디렉토리에 웹 사이트를 작성하려면 npx @11ty/eleventy 실행하십시오. 로컬 개발 또는 컨텐츠 편집을 위해 서버를 돌리려면 npx @11ty/eleventy --serve 실행하십시오. 이렇게하면 사이트를 http : // localhost : 8080에서 사용할 수 있으며 변경할 때 사이트가 자동으로 다시로드됩니다.
NetLify 또는 Zeit을 사용하려면 문서를 따라 리포지토리를 지속적으로 배포 할 수 있도록 호스팅 계정에 연결하십시오. 다른 호스팅 제공 업체를 사용하려면 빌드를 생성 한 후 /_site 디렉토리에서 정적 파일을 찾을 수 있습니다.
컨텐츠를 로컬로 편집하려면 npx @11ty/eleventy --serve 실행하여 서버를 돌린 다음 /content 디렉토리 내에서 Markdown 및 JSON 파일을 조정하십시오. 귀하의 사이트가 지속적인 배포에 연결된 경우, 변경 사항을 오른쪽 지점 (아마도 master )에 커밋하지 않도록하십시오. 그렇지 않으면 배포되지 않습니다.
NetLify 및 Zeit는 웹 사이트를 배포 할 때 자동으로 기본 하위 도메인을 제공하므로 선택적인 단계입니다. 자신의 도메인을 사용하려면 지침에 따라 설정해야합니다. Zeit의 사용자 정의 도메인에 대해 자세히 알아 보거나 NetLify의 사용자 정의 도메인에 대한 자세한 내용을 읽으십시오.
이 두 가이드는 모두 도메인의 도메인 이름 시스템 (DNS)을 설정하는 방법을 안내합니다. DN은 섬세 할 수 있습니다. 도메인에 대한 DNS 레코드는 웹 사이트를 찾는 위치에 브라우저를 알려주고 이메일 서버에 이메일을 보내는 방법을 알려줍니다. 변경하기 전에 기존 DNS 레코드를 작성하십시오.
사용자 정의 도메인 설정 프로세스의 일부로 Nameservers를 반복하고 이미 이메일에 도메인을 사용하고있는 경우 Nameservers를 다시 포괄하기 전에 MX 레코드 및 새 호스팅 제공 업체에 이메일과 관련된 기타 레코드를 추가해야합니다. 그렇지 않으면 이메일이 다운 될 수 있습니다.
이전 버전의 포트폴리오 스타터에 있고 최신 버전으로 업데이트하려는 경우 /content 폴더를 제외한 모든 폴더와 파일을 교체하여 수동으로 수행하는 것이 좋습니다. 업데이트 또는 주요 변경을 수행하기 전에 웹 사이트를 백업해야합니다. 저장소 홈페이지를 방문하여 녹색 "클론 또는 다운로드"버튼을 클릭하여 전체 저장소의 지퍼 파일을 다운로드 한 다음 안전한 곳에 보관하십시오.
모든 컨텐츠는 /content 폴더에 있습니다. 기본적으로 포트폴리오 스타터는 데모 사이트의 컨텐츠로 채워져 있습니다.
콘텐츠에는 글로벌 데이터, 각 페이지의 마크 다운 파일 및 미디어가 포함됩니다. 사이트가 오류없이 배포하고 예상대로 보이도록 특정 방식으로 이러한 파일을 형식화하고 구성하는 것이 중요합니다.
사이트 제목 및 URL과 같은 특정 메타 데이터는 웹 사이트 전체에서 사용됩니다. 이 모든 글로벌 데이터는 /content/_data/global.json 파일에 포함되어 있습니다.
이 파일의 세부 사항은 웹 사이트가 처음 설정 될 때 설정해야하며 웹 사이트가 이동하거나 도메인이 변경되지 않으면 다시 터치하지 않을 수 있습니다. 이것은 global.json 파일의 예입니다.
{
"title" : " Tortor Parturient Ridiculus " ,
"lang" : " en " ,
"footer" : " (c) Jane Doe, 2020 " ,
"url" : " https://tpr.com " ,
"author" : {
"name" : " Jane Doe " ,
"email" : " [email protected] "
}
} 이것은 데이터를 구조화하는 데 사용되는 텍스트 형식 인 JSON으로 작성 해야하는 유일한 컨텐츠입니다. JSON 구문은 매우 엄격합니다. 모든 키 (예 : title )와 모든 문자열 (예 : My website )은 이중 인용문으로 동봉되며 모든 속성 (예 : "title": "My website" )은 마지막 속성을 제외하고 쉼표로 분리됩니다. 모든 JSON 물체는 곱슬 괄호 {} 로 둘러싸여 있습니다. 이 파일의 잘못된 구문으로 인해 오류가 발생하므로 변경 사항이 배포되지 않습니다.
이것들은 더 자세한 속성입니다.
| 열쇠 | 체재 | 기본 | 설명 |
|---|---|---|---|
author | JSON 개체 | - | 웹 사이트 저자의 이름과 이메일 주소를 포함하는 JSON 개체 |
footer | 가격 인하 | 짧은 신용 | 마크 다운으로 작성된 바닥 글 텍스트 |
lang * | 텍스트 | en | 웹 사이트 언어를 선언하는 IANA 언어 태그 |
title * | 텍스트 | - | 귀하의 웹 사이트 제목 |
url * | URL | - | 귀하의 웹 사이트 URL |
바닥 글에는 기본적으로 짧은 신용이 포함되어 있습니다. 당신에게 가장 적합한 텍스트로 자유롭게 대체하십시오. 여기에는 저작권 통지, 콜로폰, 연락처 세부 정보 또는 기타 두드러진 정보가 포함될 수 있습니다. 바닥 글은 라인 브레이크를 지원하지 않습니다.
게시물, 프로젝트, 페이지, 홈페이지, 404 오류 페이지, 블로그 및 RSS 피드를 포함한 모든 주요 콘텐츠 페이지는 Markdown에 작성되었습니다. Markdown을 사용하면 읽기 쉬운 글을 쉽게 작성하기 쉬운 일반 텍스트 형식을 사용하여 유효한 HTML로 변환 할 수 있습니다. 목록, 링크, 제목 등을 포함한 전체 서식 옵션 목록은 Markdown-IT 웹 사이트를 방문하십시오. 이 readme 파일의 소스를 볼 수도 있습니다. 마크 다운으로 작성되었습니다!
모든 Markdown 파일은 .md Extension으로 끝나고이 StarterKit은 나머지 파일 이름을 사용하여 페이지 슬러그 (페이지의 URL의 마지막 부분)를 생성합니다.
밑줄 _ 에 앞서있는 폴더 또는 파일은 게시되지 않습니다. 이 때문에 밑줄을 사용하여 /content/posts/_testing-a-draft.md 와 같은 초안을 작성할 수 있습니다. 그러나 저장소가 공개되면 초안이 Github의 다른 사람들에게는 드래프트가 보일 것임을 기억하는 것이 중요합니다.
각 Markdown 파일은 Yaml FrontMatter로 시작합니다. Yaml은 인간이 읽을 수있는 텍스트를 구조화 된 데이터로 서식 할 수있는 일반 텍스트 구문입니다. FrontMatter는 파일 상단에있는 텍스트입니다.
---
layout : page
title : Contact
description : Get in touch with me via email or phone.
image : cloud-01.jpeg
---
Yaml FrontMatter에는 페이지 별 메타 데이터를 정의하는 일련의 속성 (콜론으로 분리 된 값 및 값)이 포함되어 있습니다. 키는 항상이 문서에서 볼 수 있듯이 정확하게 작성해야합니다. 예를 들어 layout 대신 Layout 작성하면 오류가 발생합니다.
이들은 모든 페이지의 프론트 매스터에서 사용해야하는 기본 YAML 속성입니다.
| 열쇠 | 체재 | 기본 | 설명 |
|---|---|---|---|
description | 텍스트 | - | 페이지 내용에 대한 간단한 설명 |
eleventyNavigation | 얌 | - | 아래에 설명 된 YAML 객체 |
image | 텍스트 | - | 소셜 미디어 카드에 사용해야하는 이미지의 파일 이름 |
layout * | 텍스트 | - | 페이지 레이아웃 |
permalink | 텍스트 | 다양한 | 페이지 permalink |
title * | 텍스트 | - | 페이지 제목 |
모든 Markdown 파일에 페이지 제목과 레이아웃이 필요합니다. 페이지 레이아웃은 콘텐츠가 표시되는 방법을 결정합니다. 새 페이지를 만들 때 project , post 또는 page 레이아웃을 사용해야합니다.
description 속성은 소셜 미디어 카드에 사용되며 검색 엔진 결과에 표시되므로 모든 페이지에 적극 권장됩니다. 50 ~ 160 자 사이 여야하며 다른 페이지에서 복제되지 않아야합니다.
소셜 미디어에 image 사용하는 경우 적절한 이미지 크기에 대한 지침은 소셜 미디어 플랫폼에서 제공 한 문서를 참조하십시오. 경험상, 풍경 형식 1200px 너비의 JPG는 대부분의 플랫폼에서 적절해야합니다.
permalink 속성을 사용하면 페이지의 URL을 설정하거나 완전히 끌 수 있습니다. 퍼머 링크는 항상 자동으로 생성 되므로이 속성을 사용하지 않아도됩니다.
eleventyNavigation 속성은 약간 더 복잡합니다. Eleventy Navigation 플러그인에게 메뉴에 넣을 내용을 알려줍니다. 이것은 About Page /content/pages/about.md 에서 사용되는 속성의 예입니다.
---
layout : default
title : About
eleventyNavigation :
key : About
order : 0
---
key 하위 단점은 Eleventy 에게이 페이지를 텍스트 "about"로 내비게이션에 추가하도록 지시합니다. order 하위 단점은 Eleventy에게 내비게이션에서 먼저 올 것이라고 말합니다.
예를 들어 GitHub에 대한 링크와 같은 내비게이션에 외부 링크를 추가 할 수도 있습니다. 다음 프론트 매트의 예제는 다음과 같은 예제에 대해서는 /content/pages/github.md 페이지를 참조하십시오.
내비게이션에 외부 링크를 추가하려면 아래 프론트 매트와 함께 새 Markdown 파일 (예 : /content/external.md )을 만들 수 있습니다.
---
eleventyNavigation :
key : GitHub ↗
order : 3
url : http://github.com/sb-ph/portfolio-starter
permalink : false
---
key 하위 단점은 Eleventy 에게이 페이지를“Github”( ↗ Northeast Arrow의 HTML 코드)와 함께 내비게이션에 추가하도록 지시합니다. order 하위 프로퍼티는 메뉴에서 마지막으로 올 수 있도록 3으로 설정되며 url 하위 프로퍼티는 원하는 URL로 설정됩니다. permalink 속성은 웹 사이트에 해당 페이지를 게시하지 않도록 False로 설정됩니다.
페이지는 /content/pages 폴더에 있습니다.
페이지 layout 프론트 마터의 page 로 설정해야합니다. 페이지는 위에 나열된 기본 속성 만 지원합니다.
게시물은 /content/posts 폴더에 있습니다.
포스트의 layout 프론트 매트에 post 하도록 설정해야합니다. 게시물은 기본 속성과 date 속성을 지원합니다. 이것은 게시물의 프론트 마터의 예입니다.
---
layout : post
title : Demo post
date : 2020-03-29 18:00:00
---
date 속성은 게시물의 게시 날짜와 블로그 및 RSS의 주문을 결정합니다.
마크 다운 컨텐츠 내에서 HTML 주석 <!--more--> 사용하여 다음과 같은 게시물에 대한 발췌문을 생성 할 수 있습니다.
Maecenas faucibus mollis interdum. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.
<!-- more -->
Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Donec ullamcorper nulla non metus auctor fringilla. Sed posuere consectetur est at lobortis. more 주석을 사용하는 경우, 주석 앞의 텍스트 만 블로그에 표시 되며이 발췌 후 "더 읽기"링크가 표시됩니다.
프로젝트는 /content/projects 폴더에 있습니다.
프로젝트 layout 프론트 마터에서 project 로 설정해야합니다. 프로젝트는 기본 속성과 dateStart , dateEnd 및 media 속성을 지원합니다. 이것은 프로젝트 페이지의 프론트 마터의 예입니다.
---
layout : project
title : Your project title
dateStart : 1988-02-01
dateEnd : 2001-03-01
media :
- type : image
filename : cloud-01.jpeg
size : md
alt : A cloud
caption : A collaboration with [Piper Haywood](https://piperhaywood.com)
- type : video
filename : ria-pacquee.mp4
controls : false
caption : A piece by [Ria Pacquée](http://riapacquee.com/)
---
그리고 이것들은 프로젝트 별 속성입니다.
| 열쇠 | 체재 | 기본 | 설명 |
|---|---|---|---|
dateEnd * | YYYY-MM-DD | - | 정렬 목적으로 사용되는 프로젝트의 종료 날짜 |
dateStart | YYYY-MM-DD | - | 프로젝트의 시작 날짜 |
media | 얌 | - | 아래에 설명 된 미디어 블록의 YAML 목록 |
미디어 속성은 이미지 및 비디오 블록을 포함 할 수있는 엄격하게 형성된 YAML 목록입니다. 이미지와 비디오 모두에 적용되는 속성은 다음과 같습니다.
| 열쇠 | 체재 | 기본 | 설명 |
|---|---|---|---|
caption | 가격 인하 | - | 미디어를 설명하는 캡션 |
filename * | 텍스트 | - | 미디어의 파일 이름 |
height | 정수 | - | 픽셀로 미디어의 높이 |
width | 정수 | - | 픽셀로 미디어의 너비 |
size | 텍스트 | lg | 미디어를 표시 해야하는 크기; sm , md 또는 lg |
type * | 텍스트 | - | image 또는 video |
이미지 블록은 다음과 같은 추가 속성을 지원합니다.
| 열쇠 | 체재 | 기본 | 설명 |
|---|---|---|---|
alt * | 텍스트 | - | 이미지의 대체 텍스트 |
featured | 부울 | 거짓 | 이미지 가이 프로젝트를 나타내는 데 사용되어야하는지 여부 |
featured 속성은 홈페이지 에서이 프로젝트를 나타내는 데 사용해야하는 이미지를 결정하는 데 사용됩니다. 여러 이미지가 특색 표로 표시되면 첫 번째 이미지가 사용됩니다.
비디오 블록은 다음과 같은 추가 속성을 허용합니다. 비디오 자동 재생은 특정 브라우저 및 장치에서만 지원됩니다.
| 열쇠 | 체재 | 기본 | 설명 |
|---|---|---|---|
controls | 부울 | 거짓 | 비디오 컨트롤을 표시 해야하는지 여부 |
loop | 부울 | 거짓 | 비디오가 루프 해야하는지 여부 |
autoplay | 부울 | 거짓 | 비디오가 자동으로 재생되어야하는지 여부 |
muted | 부울 | 거짓 | 비디오를 음소거 해야하는지 여부 |
홈페이지는 /content/index.md 파일입니다.
홈페이지의 layout 프론트 매트의 home 으로 설정해야합니다. 홈페이지는 대부분의 기본 속성을 지원하지만 permalink 속성을 사용해서는 안됩니다.
추가 entries 속성을 사용하면 홈페이지에 나타날 프로젝트를 정확하게 지정할 수 있습니다. entries 속성이 작성되지 않으면 홈페이지는 가장 최근의 첫 번째 프로젝트와 순서대로 모든 프로젝트를 자동으로 표시합니다.
이것은 사용중인 entries 속성의 예입니다.
---
layout : home
entries :
- portfolio-starter
- sample-project-muybridge
- sample-project-optics
- sample-project-eames
- sample-project-letters
- sample-project-traffic-signs
---
각 프로젝트의 첫 번째 featured 이미지가 표시됩니다. 이미지가 featured 경우 첫 번째 이미지가 표시됩니다.
블로그 페이지는 /content/posts.md 파일입니다.
블로그 페이지의 layout 프론트 매스터의 posts 로 설정해야합니다. 블로그 페이지는 기본 속성을 지원합니다. 프론트 컷 아래에 기록 된 Markdown은 표시되지 않습니다.
404 오류 페이지는 /content/404.md 파일입니다.
404 오류 페이지의 layout 프론트 마터에서 error 로 설정해야합니다. 오류 페이지는 layout 및 title 기본 속성 만 지원합니다. permalink 속성을 사용해서는 안됩니다.
RSS 페이지는 /content/rss.md 파일입니다.
RSS 페이지의 layout 프론트 마터에서 feed 되도록 설정해야합니다. RSS 페이지는 layout 및 title 기본 속성 만 지원합니다. permalink 속성을 사용해서는 안됩니다.
RSS 피드는 자동으로 /feed.xml 에 게시되므로 https://yoursite.com/feed.xml 과 같은 것입니다. 내비게이션에 RSS 링크를 추가하려면 기본 속성 안내서를 참조하여 외부 링크를 추가하십시오.
모든 미디어는 /content/media 폴더에 저장됩니다.
GitHub 저장소 및 호스팅의 공간을 절약하려면 미디어 파일이 가능한 한 작아야합니다. Github의 저장소 제한에 대해 자세히 알아보십시오. 더 작은 미디어 파일은 독자에게 더 빠르게로드됩니다.
작은 이미지는 폭이 약 800px 여야하며, 중간 이미지의 너비는 약 1400px 여야하며, 큰 이미지의 너비는 약 3000px 여야합니다. 평평한 색상의 넓은 영역이있는 이미지는 PNG로 가장 잘 작동 할 수 있습니다. 사진과 같은 자세한 내용의 이미지는 JPG로 저장해야합니다.
페이지에 더 많은 이미지를 추가할수록 해당 페이지를로드하는 데 시간이 오래 걸립니다. 한 페이지에 추가 된 이미지 수에 대해 신중하십시오.
위에서 언급했듯이 이것은 고의적으로 기본적인 코드베이스입니다.
CSS 파일을 GitHub에서 직접 편집하여 명령 줄없이 CSS 변경과 같은 더 작은 사용자 정의를 수행 할 수 있습니다. 더 광범위한 사용자 정의는 명령 줄을 사용하여 로컬로 개발하여 가장 잘 수행됩니다. /_includes 의 Nunjucks 레이아웃 또는 스 니펫 변경에 관심이있는 경우 Eleventy 문서를 참조하십시오.
이 사이트를 변경하고 확장하기위한 몇 가지 제안입니다.
/_includes/layouts/base.njk 레이아웃 편집client 또는 category 와 같은 프로젝트 속성을 추가하십시오imgix 와 같은 컨텐츠 전달 네트워크 (CDN)와 함께 작동하도록 템플릿 변경몇 가지 수정에 도움이되면 연락을 취하면 논의 할 것입니다.