Tove 테마: 전체 사이트 편집과 호환되는 WordPress 테마 프레젠테이션

해밀턴(Hamilton), 히치콕(Hitchcock), 채플린(Chaplin), 미야자키(Miyazaki) 등의 이름은 특히 스포츠와 영화를 생각할 때 유명한 사람들을 떠올리게 할 것입니다.

그러나 WordPress와도 관련이 있다는 것을 알고 계셨습니까? 예, 정말입니다. 당신이 생각하는 것과는 다릅니다. Lewis Hamilton은 지난 그랑프리의 마지막 랩에서 2021년 세계 타이틀을 잃은 후 WP 웹 디자인에 뛰어들기로 결정하지 않았습니다 .

즉, 그는 그것에 대해 정신병을 일으킬 수 있지만 (안녕 Alfred) 당신은 요점을 놓치고 있습니다. 사실, 저 4명의 유명한 성은 다작하고 창의적인 Anders Noren이 만든 WordPress 테마이기도 합니다 .

그 남자는 공식 디렉토리에 그 중 20개 이상을 가지고 있으며 오늘 우리는 Tove라는 그의 최근 아기에 초점을 맞출 것 입니다.

이 이름은 유명 인사와도 관련이 있습니다. 나중에 다시 언급하겠습니다. 그러나 무엇보다도 WordPress 5.9 릴리스와 함께 작은 혁명과 밀접하게 연결되어 있습니다.

그것의 이름? 전체 사이트 편집(FSE). 인정하세요, 더 알고 싶어 죽겠습니다, 그렇죠? 조명, 카메라, 액션: 나와 함께 Tove를 발견하고 ... 동시에 약간의 FSE도 함께 ​​사용합니다.

최고의 WordPress 프로젝트에는 최고의 호스트가 필요합니다!

WPMarmite는 Bluehost: 뛰어난 성능, 뛰어난 지원을 권장합니다. 멋진 시작을 위해 필요한 모든 것.

블루호스트 사용해보기

토브 테마는 무엇입니까?

Tove는 전적으로 WordPress 콘텐츠 편집기(Gutenberg)에서 사용하는 블록을 기반으로 하는 무료 다목적 WordPress 테마입니다. WordPress 5.9(2022년 1월 25일 릴리스)와 함께 발행된 전체 사이트 편집 프로젝트의 요구 사항을 충족하도록 설계되었습니다.

2021년 9월에 시작된 Tove는 글을 쓰는 시점에서 매우 기밀로 유지됩니다. "오직" 400개 이상의 활성 설치가 있습니다. 주로 한 가지 간단한 이유가 있습니다. WordPress 5.9 또는 최신 버전의 Gutenberg 플러그인 중 하나에서만 사용할 수 있습니다.

WordPress Tove 테마의 특성 중 개발자인 Anders Noren이 강조한 것처럼 다음 사항이 두드러집니다.

• Tove는 코드 측면에서 매우 가볍습니다 . 이는 로딩 속도와 제공할 수 있는 사용자 경험 측면에서 진정한 장점입니다.
• 그것은 레스토랑과 카페를 위해 특별히 설계 되었지만 Noren은 "당신이 원하는 어떤 유형의 웹사이트에도 Tove를 사용할 수 있습니다" 라고 말합니다. Tove는 또한 유연성이 특징입니다.
• Tove 테마에는 예를 들어 머리글과 바닥글을 사용할 준비가 되도록 페이지에 한 번의 클릭으로 추가할 수 있는 약 40개의 블록 패턴 이 있습니다.

이것은 FSE 호환 테마가 현재 생태계에서 그다지 널리 퍼져 있지 않다는 것을 알고 있기 때문에 가치 있는 연구 대상이 됩니다.

한편으로는 실험적으로 생성된 몇 가지를 찾을 수 있습니다(Armando, Q, TT1 Blocks).

반면에 Blockbase, Hansen 또는 Aino와 같이 다른 것보다 먼저 FSE 물결을 타기로 결정한 테마를 접하게 될 것입니다.

글쎄, 나는 전체 사이트 편집에 대해 이야기하고 있지만 이 용어는 당신에게 모두 그리스어일 수 있습니다. 이해를 돕기 위해 이 뜨거운 주제에 대한 몇 가지 팁을 알려 드리겠습니다.

전체 사이트 편집이란 무엇입니까?

WordPress 5.9에서 사용할 수 있는 전체 사이트 편집 프로젝트를 사용하면 콘텐츠 편집기 블록(Gutenberg)을 사용하여 사이트의 전체 구조(콘텐츠뿐만 아니라 머리글, 바닥글, 메뉴 및 페이지 템플릿 포함)를 만들고 편집할 수 있습니다.

이 기사에서 자세히 설명했듯이 헤더 또는 404 페이지와 같이 일반적으로 테마로 관리되는 핵심 요소는 예를 들어 이미 게시물을 작성하는 데 사용하는 콘텐츠 편집기 블록을 사용하여 처리할 수 있습니다.

이것은 WordPress 콘텐츠 편집기를 페이지 빌더 가 작동하는 방식에 더 가깝게 가져오는 주요 변경 사항입니다.

FSE에 대한 자세한 연구와 WordPress 테마 상점에 미치는 영향도 확인할 수 있습니다.

이제 FSE에 대한 모든 것을 알게 되었습니다! 계속해서 Tove 테마의 개발자인 Anders Noren에 대해 알아보겠습니다.

토베 주제: 안데르스 노렌의 손길

워드프레스 뉴스를 자세히 보면 Anders Noren이라는 이름이 반드시 울려 퍼집니다.

스톡홀름에 기반을 둔 이 스웨덴 개발자이자 웹 디자이너는 공식 디렉토리에서 모두 무료로 제공되는 WordPress 테마로 유명해졌습니다.

총 22개를 제공하고 약 400만 다운로드가 있습니다. 대부분은 주로 블로깅에 전념하지만 포트폴리오 또는 온라인 상점을 만들기 위해 일부를 찾을 수도 있습니다.
종종 지침은 동일합니다. 미니멀하고 깨끗한 측면입니다.

그 외에도 Noren은 WordPress Core 개발에도 기여합니다. 예를 들어? 그는 WordPress 5.3과 함께 제공되는 기본 Twenty Twenty 테마를 디자인했습니다 .

이 작은 테마 군대의 한가운데에 Noren이 만든 최초의 100% FSE 호환 테마인 Tove가 있습니다. 첫 번째 펄스 확인 후 이 혁신적인 주제를 살펴볼 차례입니다.

참고로 토베라는 이름은 위키피디아에 따르면 주로 아동도서 작가로 알려진 핀란드 작가, 화가, 만화가 토베 얀손(Tove Jansson)의 이름에서 따왔습니다. 그녀는 특히 백인 트롤의 가족인 무민을 만들었습니다.

Tove 테마는 어떻게 생겼나요?

Tove 테마의 데모 프레젠테이션을 기반으로 몇 가지 주요 특징을 볼 수 있습니다.

• 파스텔과 화려한 색상 , 분홍색, 파란색 및 노란색이 우세합니다.
• 헤더의 다양한 요소 : 소셜 네트워크로 리디렉션되는 아이콘, 영업 시간(테마가 카페와 레스토랑 전용임을 기억하십시오), 행동 유도 버튼까지. 로고는 헤더 중앙에 있습니다.
• 영상 이 전체 화면으로 표시됩니다.
• 직사각형 및 정사각형 모양의 콘텐츠 블록 .
• 호흡을 허용하고 통풍이 잘되는 면을 강조하기 위한 빈 공간 .
• "DM Sans" 타이포그래피, 기하학적 및 산세리프체 사용 .

데모는 테마의 완성된 시각적 측면을 제공하기 위해 존재하지만, 물론 짐승을 가지고 놀면서 기본 특성(색상, 타이포그래피, 블록 유형 등)을 수정할 수 있습니다.

이것이 우리가 다음 부분에 집중할 것입니다.

WPMarmite 가입자 가입

마지막 WPMarmite 게시물(및 독점 리소스도 포함)을 가져옵니다.

지금 구독

WordPress에서 Tove 테마를 사용자 정의하는 방법은 무엇입니까?

사이트 편집기

Tove 테마를 활성화했으면 모양 > 편집기로 이동합니다. 사이트 편집기는 WordPress 5.9와 함께 제공됩니다.

여기에서 Tove와 나중에 설치할 다른 블록 기반 테마를 사용자 지정할 수 있습니다.

보시다시피 위젯 메뉴는 사용자 정의 도구와 마찬가지로 사라졌습니다.

이제 모든 것이 이 유명한 사이트 편집기에서 발생합니다. 이 편집기는 Gutenberg 블록을 사용하여 사이트의 모든 영역을 만들고 공급합니다 .

기본적으로 모든 블로그 발행물을 나열하는 "색인" 템플릿이 생성됩니다.

처음에는 다소 혼란스러울 수 있습니다. 이제 모든 것이 마법처럼 편집될 수 있음을 알 수 있습니다. 이를 이해하려면 페이지의 요소 위에 마우스를 올려 놓으면 됩니다.

그것을 클릭하면 다음과 같이 조정할 수 있는 콘텐츠 편집기 도구 모음으로 이동합니다 .

템플릿

표준 페이지 생성을 용이하게 하기 위해 Tove는 5개의 템플릿도 제공합니다. "모든 템플릿 찾아보기"를 클릭하여 액세스할 수 있습니다.

이러한 템플릿은 다음과 같습니다.

• 단일 게시물 , 게시물 페이지의 표시(추천 이미지, 메타 태그 등)를 관리합니다.
• Page , 게시물과 마찬가지로 단일 페이지의 프레젠테이션을 정렬합니다.
• 색인 , 모든 출판물을 나열하는 블로그 페이지의 구성을 사용자 정의합니다.
• 제목 없는 페이지 , 제목 없는 페이지를 디자인합니다.
• 404 , 사용자 정의 404 페이지를 생성합니다.

글로벌 스타일

글로벌 스타일을 살펴봄으로써 사이트의 일반 설정에 대한 주제를 계속 살펴보겠습니다. 이것은 물론 Tove 테마가 사용하는 WordPress 5.9의 새로운 기능입니다 .

이러한 글로벌 스타일을 사용하면 이제 색상, 타이포그래피, 레이아웃 및 사이트 전체의 특정 블록 모양까지 한 번에 변경할 수 있습니다.

더 이상 각 요소를 하나씩 수정하는 시간 소모적인 프로세스를 거칠 필요가 없습니다.

기본적으로 목표는 모든 테마 및 블록 스타일 설정을 관리할 수 있는 장소를 제공하여 사용자 지정 도구를 대체하는 것입니다.

이 옵션에 액세스하여 Tove의 시각적 모양을 변경하려면(핑크 색상은 스타일 가이드에 맞지 않을 수 있음), 사이트 편집기 도구 모음 오른쪽 상단에 있는 작은 버튼을 클릭합니다.

여기에서 색상 선택과 같은 다양한 요소의 설정을 관리할 수 있습니다. 원하는 경우 고유한 팔레트를 만들 수도 있습니다.

블록 스타일

한 번에 하나의 요소를 살펴보고 싶습니까? 각 블록을 개별적으로? 일부 사용자 정의 블록 스타일을 제공하는 Tove 테마에서도 가능합니다.
그것들을 찾으려면 선택한 블록을 클릭하기만 하면 됩니다.

선택한 블록에 따라 하나 또는 여러 스타일이 제안 됩니다. 예를 들어 "인용" 블록은 글꼴 크기를 변경하는 "일반" 스타일과 "큰" 스타일을 제공합니다.

"Image" 블록은 "Rounded" 또는 "Shaded"의 두 가지 스타일 옵션을 제공합니다.

블록 패턴

마지막으로, Tove 테마를 사용하면 블록 패턴을 추가하여 처음부터 페이지와 게시물의 콘텐츠를 만들 수 있습니다.

이들은 여러 구텐베르크 블록으로 구성된 바로 사용할 수 있는 콘텐츠 섹션 입니다. WordPress 콘텐츠 편집기에서 "패턴" 탭을 클릭하여 콘텐츠에 매우 쉽게 추가할 수 있습니다.

패턴은 WordPress 5.5에서 도입되었습니다. 참고로 콘텐츠 편집기 외에도 공식 WordPress 웹사이트의 특정 디렉토리에서도 찾을 수 있습니다. 이를 사용하려면 관심 있는 블록 패턴을 콘텐츠 편집기에 직접 복사하여 붙여넣으면 됩니다.

Anders Noren은 Tove 테마에 대해 거의 40가지 블록 패턴을 제공합니다. 7가지 범주로 나뉩니다.

• 클릭 유도 문안 , 수평 또는 수직 클릭 유도 문안 을 만드는 2개의 템플릿이 있습니다.
• 블로그 , 특히 그리드 또는 목록(총 5개의 템플릿)으로 블로그 페이지의 표시를 사용자 정의합니다.
• 6개의 다른 헤더 템플릿을 제공하는 Header .

• 일반 , 평가판, 가격표, 유익한 배너 및 기타 소셜 네트워크 아이콘을 표시하는 11개의 템플릿을 찾을 수 있습니다.
• 배경, 제목, 버튼 및 텍스트를 표시하는 4개의 템플릿이 포함된 Hero .
• 레스토랑 , 메뉴, 영업 시간, 실용적인 정보, 예약 버튼 등 레스토랑을 위해 바로 사용할 수 있는 8개의 템플릿이 있습니다.

• 바닥글 , 크레딧 및 레이아웃(예: 열 포함)을 포함하여 바닥글을 사용자 지정할 수 있는 7개의 템플릿이 있습니다.

이제 Tove를 조작하고 사용자 정의하는 방법을 알았습니다. 계속 진행하기 전에 이 테마의 처리에 대한 제 느낌이 있습니다.

일반적으로 Tove 테마는 사용하기 쉽다는 것이 큰 장점입니다. 처음에는 WordPress 사이트 편집기에 익숙해져야 하지만, 특히 2022년 초에 이 기사를 읽는 사람들에게는 특히 콘텐츠 편집기를 이미 알고 있는 경우 빠르게 익숙해질 것입니다.
블록을 사용하는 방법이 있습니까? 그러면 Tove는 당신에게 비밀이 없을 것입니다.

마지막으로 테마 사용자 정의에 대한 이 부분을 끝내기 위해 Tove를 페이지 빌더와 결합할 수 있다는 것을 알아두십시오.

WordPress 사이트 편집기와 함께 사용하도록 설계되었기 때문에 테마의 원래 목적은 아닙니다. 그러나 예를 들어 Elementor와 결합하여 시작점으로 사용하는 것을 방해하는 것은 없습니다.

Elementor로 웹사이트 구축

유명한 페이지 빌더로 WordPress 웹 사이트의 모양과 느낌을 쉽게 디자인하십시오. 엘리멘터 사용해보기

엘리멘터 사용해보기

여전히 집중하고 계십니까? 그런 다음 기사의 다음 부분으로 넘어가서 관심을 가질 만한 몇 가지 주제를 다루겠습니다.

성능, SEO, 반응형: 3가지 주요 측면 확대

WordPress Tove 테마의 성능

웹마스터가 집중하는 첫 번째 측면은 사이트의 로딩 속도입니다.

일반적으로 생각하는 것과는 달리 SEO에는 훨씬 덜 하고 사용자 경험에 영향을 미치기 때문에 이것은 분명히 신중하게 고려해야 할 사항입니다.

이미지의 무게, 사용하는 플러그인, 웹 호스트, PHP 버전 등 여러 요소가 사이트 페이지의 로드 속도를 변경할 수 있습니다.

그 중에는 당신의 주제도 있습니다. 더 가볍고 더 잘 코딩될수록 더 빠른 사이트를 가질 가능성이 높아집니다.

그런 면에서 토베는 뛰어난 학생이다. 불필요한 요소로 과부하가 걸리지 않으며 프레젠테이션 페이지에 설명된 대로 전체 사이트 편집 프로젝트를 중심으로 구축되었기 때문에 Tove는 "단순하고 슬림합니다. 정말 슬림. 테마의 무게는 200킬로바이트가 조금 넘고 대부분의 바이트는 자리 표시자 일러스트레이션과 테마 스크린샷에서 가져옵니다.” .

WebPageTest와 같은 성능 측정 도구에서 테마 데모를 테스트하면 이것이 바로 알 수 있습니다.

그건 그렇고, 귀하의 사이트가 약간 지연되는 경우 예를 들어 우수한 프리미엄 플러그인 WP Rocket(제휴 링크)을 활성화하여 사이트에 약간의 부스트를 줄 수 있습니다.

검색 엔진 최적화

페이지 로딩 속도가 걱정되십니까? 그런 다음 성실한 사이트 작성자로서 SEO에 대해 확실히 걱정해야 합니다.

검색 엔진 결과의 첫 페이지에서 콘텐츠의 좋은 순위는 더 많은 트래픽과 그에 수반되는 모든 것(판매, 다운로드, 뉴스레터 구독, 양식 작성, 견적 요청 등)을 얻는 데 매우 중요합니다.

Google 및 기타 사이트에서 페이지의 순위를 올바르게 지정하려면 개략적으로 다음을 수행해야 합니다.

• 타겟 쿼리(키워드)를 중심으로 사이트 콘텐츠를 작업합니다 .
• 다른 사이트에서 링크를 얻 습니다(유명한 백링크).
• 사이트 아키텍처를 관리하십시오 .

좋은 SEO 관행을 존중하는 잘 코딩된 테마를 사용하면 Tove 테마의 경우와 같이 견고한 기반에서 시작할 수 있습니다.

사이트 SEO(콘텐츠 최적화)를 관리하기 위해 Anders Noren의 테마에는 특정 옵션이 없습니다.

WordPress 콘텐츠 편집기에서 원하는 제목 태그(h1, h2, h3, h4, h5)를 선택하고 다른 제목에 적절하게 적용할 수 있습니다.

나머지는 Yoast SEO와 같은 일반 SEO 플러그인을 사용하는 것이 좋습니다. 검색 결과 페이지에서 자동으로 순위를 얻지는 않습니다.

그러나 올바른 방법으로 수행하는 경우 SEO의 일부 주요 측면을 올바르게 구성할 수 있습니다.

이를 위해 WPMarmite 블로그에서 가장 유명한 SEO 플러그인에 대한 가이드로 이동하십시오.

반응형

사이트의 성능과 SEO를 관리하는 것은 훌륭합니다. 그러나 모바일 친화적이지 않은 사이트를 사용해서는 안 됩니다. 정확히 말하면 "반응형"이라고 합니다. 설계".

다시 말하지만, 특히 대다수의 방문자가 스마트폰이나 태블릿으로 WordPress 사이트를 방문하는 경우 특히 주의해야 할 사항입니다.

팁: 방문자가 사용 중인 기기 유형을 확인하려면 Google 애널리틱스: 잠재고객 > 모바일 > 개요로 이동하세요.

Anders Noren은 자신의 테마를 홍보하기 위한 공격적인 마케팅의 팬이 아니므로 테마 프레젠테이션 페이지에서 Tove가 반응이 좋다는 것을 증명하는 거창한 삽입물을 보지 못할 것입니다.

요즘에는 모든 것이 올바른지 확인하기 위해 약간의 조정을 해야 하는 경우에도 자긍심 있는 WordPress 테마는 대체로 반응이 좋습니다.

대부분의 경우 공식 디렉토리에서 찾을 수 있는 WP 테마는 기본적으로 반응형입니다.

이를 수동으로 확인하려면 다음 두 가지 방법으로 진행할 수 있습니다.

1. 콘텐츠가 서로 아래에 올바르게 맞는지 확인 하려면 브라우저 창을 왼쪽이나 오른쪽으로 좁힙니다 . Tove의 경우가 그렇습니다. 창이 좁아짐에 따라 모든 것이 흠잡을 데 없이 표시됩니다.
2. Google에서 제공하는 무료 도구인 모바일 친화성 테스트를 사용 하세요. 올바른 방법으로 수행하기 위해 Tove의 데모 페이지를 테스트했습니다. Google은 문제를 찾지 못했습니다.

반응형, SEO 및 성능이 있습니다. 이 어려운 부분을 완료했습니다. 이번 테마 리뷰가 막바지에 이르렀으니 법안에 대해 이야기해볼까요?

Tove 가격 및 사용자 지원

Tove를 사용하면 가격과 관련하여 놀라움과 숨겨진 비용이 없습니다. Anders Noren이 디자인한 나머지 테마와 마찬가지로 100% 무료 입니다.

항상 좋은 일이지만 무료 테마는 지원 감소를 의미합니다.

네, 인생의 모든 것을 가질 수는 없습니다. 막히거나 Tove에 기술적인 문제가 있는 경우 전담 사용자 지원이 제공되지 않습니다.

언제든지 Tove 공개 지원 포럼에서 요청을 시도하고 게시할 수 있습니다. 그리고 여기 좋은 소식이 있습니다. Anders Noren은 다소 반응이 좋고 대부분의 경우 그가 묻는 질문에 대답합니다 .

즉, 실제로 발생할 수 있는 대부분의 문제는 WordPress 사이트 편집기와 관련이 있으며 반드시 Tove에 의존하는 것은 아닙니다.

그리고 이를 위해서는 기적의 레시피가 없습니다 . 동물을 길들이는 연습을 하고 족장처럼 마스터해야 합니다 .

전체 사이트 편집은 작성 시점을 기준으로 한 최근 프로젝트이므로 모든 세부 사항을 이해하려면 해당 주제를 읽어야 할 수도 있습니다.

이를 위해 Noren은 WordPress Core의 기고자인 Carolina Nymark의 웹사이트인 fullsiteediting.com을 추천합니다.

Tove 테마에 대한 우리의 의견

자, 여기 있습니다. 토브 시식이 끝났습니다. 이 모든 것을 소화하고 보고할 시간입니다. 이 포스트의 시작부터 지금까지 살펴본 모든 내용을 요약해 보겠습니다.

전체 사이트 편집 프로젝트의 요구 사항을 충족함으로써 Tove는 선구적인 WordPress 테마입니다. 현재 대부분의 상점 및 기타 테마 디자이너는 WP로 사이트 생성 및 편집의 미래를 나타내는 것을 따라잡지 못했습니다.

다루기 쉽고 쾌적하고 코딩 없이 사용하기 쉬운 Tove는 초보자에게 자연스럽게 어울리는 테마입니다.

특히 요식업에 종사하고 블로그나 간단한 쇼케이스 웹사이트를 만들고자 하는 경우 이러한 유형의 프로필에 적합할 수 있지만 제 생각에는 WordPress 및 해당 사이트 편집기에 대해 이미 잘 알고 있는 사람들에게 더 적합해 보입니다 .

사실, 블록 패턴을 사용하여 페이지 내에 바로 사용할 수 있는 템플릿을 쉽게 추가할 수 있다고 해도 주요 페이지(블로그, 404 등 .).

또한 공식 디렉토리의 다른 유명한 테마와 비교하면 Tove는 사용자 정의 옵션 측면에서 훨씬 더 가볍습니다(목적이 아니기 때문에 논리적임).

따라서 초보자 웹 디자이너는 A부터 Z까지 안내하는 테마와 Astra, GeneratePress, Kadence 또는 Blocksy와 같은 템플릿 및 기타 스타일 옵션으로 가득 찬 테마가 더 편안할 것입니다.

어쨌든 토베는 미래로 연결된다 . FSE의 개발과 함께 계속 확장되어야 하며 아마도 다음 달에 필수 테마가 될 것입니다. 그럼 밀접하게 따를 것입니다.

Tove 테마 다운로드:

당신이 그것에 대해 어떻게 생각하십니까? FSE와 Tove 테마를 이미 선택하시겠습니까?

아래 의견에서 귀하의 답변을 기다리고 있습니다.