2022 최신 주제 소개(v1.0)

React를 사용하여 헤더 없는 워드프레스 사이트를 구축하는 데 사용되는 무료 소스 프레임워크입니다.문서를 봅니다.
우리는 최근에 1.0 버전의'20가지 최첨단'주제를 발표했다고 기쁘게 발표했다.
2020 기본 WordPress 테마는 WordPress 5.3 "Kirk"(11월 12일 발표)에 포함되며 소프트웨어 엔지니어와 디자이너가 Frontity로 이식됩니다.
Segun에 따르면 주제 개발은 간단하면서도 빠르다.그는 주제항을 발표하는 데 일주일도 안 걸렸다beta version.비록 그는 React를 알고 있지만, 이것은 그가 창작한 첫 번째 긍정적인 주제이다.
'2020 테마'는 앤더스 노렌스의 자유 테마Chaplin를 바탕으로 쿠템버그를 중심으로 디자인됐다.
Twenty Nineteen과Frontity Chakra Theme와 함께 처음부터 시작하지 않고 웹 사이트의 기반으로 주제를 사용하는 것을 좋아한다면 2020 주제는 좋은 선택이다.만약 네가 이 프레임워크의 초보자라면, 그것은 너로 하여금 쉽게 너의 사이트를 구축하고 운행하게 할 수도 있다.
너는 20개의 정면 주제in action here를 볼 수 있다.

정면 테마 20개의 홈 보기.

20의 주제 특징

놀라운 성능 외에도 이 주제는 다음과 같은 몇 가지 좋은 기능을 제공합니다.

접근성 지원

주제는 이해하기 쉽고 화면의 가독성이 강하다.우리는 적당한 표지, 역할, 라벨을 추가했다.우리는 또한 정태어에서 초점을 포착하여 초점지시기가 모든 상호작용 요소에 대해 볼 수 있도록 확보한다.

사용자 정의 색상

테마 설정의 배경색, 텍스트 색, 주/강조 텍스트 색을 변경하여 사이트나 블로그에 개인적인 스타일을 부여할 수 있습니다.한 곳에서 색을 변경하면 모든 시각 요소가 업데이트됩니다.

검색

이 테마는 독자들이 특정 내용을 쉽게 찾을 수 있도록 내장된 검색 상자를 가지고 있다.검색 상자는 WordPress에 내장된 강력하고 효율적인 검색 엔진이 지원합니다.

그림

당신의 블로그 게시물을 위해 예쁜 특색 있는 사진을 보여 줍니다.Frontity는 워드프레스에 업로드된 특색 있는 그림을 사용하여 모든 블로그 게시물에 표시합니다.테마 설정에서 종료를 선택할 수도 있습니다.

컨텐트 프리페치

모든 링크에 대한 프리페치 페이지를 제공하여 거의 즉각적인 사용자 체험을 제공할 수 있습니다.사용자가 링크에 "스톱다운"할 때, 링크가 화면에 보일 때, 페이지를 프리페치 하거나, 현재 페이지의 모든 링크를 프리페치할 때 설정을 변경하기만 하면 됩니다.

페이지 번호

Frontity의 테마는 원래의 WordPress 테마와 같은 페이지를 가지고 있기 때문에 페이지 밑에 있는 다른 페이지를 방문하고 페이지 사이를 쉽게 탐색할 수 있습니다.

설치

Frontity의 초보자라면, 프레임워크와 작업 원리에 대한 더 많은 정보를 얻기 위해 docs 를 먼저 보십시오.

새로운 최첨단 프로젝트의 경우

다음 명령을 사용하여 새 Frontity 항목을 만듭니다.

npx frontity create

그런 다음 (1) 항목 이름을 입력하고 (2) 복제할 초보자 테마를 선택하도록 요구합니다.거기서 선택할 수 있습니다 @frontity/twentytwenty-theme.
개발 서버를 시작할 때 사용:

npx frontity dev

마지막으로 개발 환경에서 2020 Frontity 테마와 상호작용하기 위해 브라우저에서 열기 http://localhost:3000.

기존 길거리 프로젝트의 경우

Frontity 프로젝트가 하나 있지만 이 테마를 설치하려면 먼저 설치하고 싶은 패키지의 이름을 알아야 합니다.이 예에서는 @frontity/twentytwenty-theme 입니다.
그런 다음 this guide 의 지침에 따라 새 패키지를 설치하여 frontity.settings.js 파일에 추가할 수 있습니다.

테마 설정

👉 주제 설정 및 구성 방법에 대한 자세한 내용은 2020 주제documentation를 참조하십시오.

리소스

2020 주제에 대해 궁금한 점이 있으면 언제든지 문의하십시오reach out.
코드를 보려면 GitHub repo 을 참조하십시오.
다음은 기타 유용한 링크입니다.

Live demo

How to install a new package

Twenty Twenty Theme documentation

Best practices for sharing a Frontity project

Frontity's step-by-step tutorial

특별히 이 주제를 Frontity에 이식해 주시고, 그리고 1.0 버전을 발표하기 위한 모든 작업에 감사드립니다!💙
이 글은 최초로 발표되었다.