Heroic Knowledge Base – 템플릿 시스템 사용하기

동일한 지원 질문에 계속해서 답하는 데 많은 시간을 할애한다면 HeroThemes에 답이 있습니다…

참고: 이 기사는 WordPress, 플러그인 설치 방법을 알고 있고 상위/하위 테마, HTML, CSS 및 PHP에 대한 기본 이해를 포함한 일부 테마 개발 지식이 있다고 가정합니다.

영웅 지식 기반

당사의 지식 기반 플러그인은 웹사이트에 맞춤형 지식 기반을 생성하기 위한 빠르고 매우 쉬운 설정 솔루션을 제공합니다. 고객에게 더 자주 묻는 질문에 대한 답변을 즉시 제공하고 지원 전화 및 이메일에 응답하는 데 소요되는 시간을 줄여 데이지 밭을 건너뛰거나 집중할 수 있습니다. 대신 켜짐) 더 행복한 고객을 확보할 수 있습니다.

대부분의 WordPress 플러그인과 마찬가지로 초기 설치가 이보다 쉬울 수 없습니다. 대시보드를 통해 플러그인을 플러그인 디렉토리에 업로드하고 활성화하기만 하면 됩니다. Knowledge Base 플러그인은 가장 잘 코딩된 테마와 원활하게 통합되므로 완전히 맞춤형 테마를 사용하든 프리미엄 HeroThemes 제품 중 하나를 사용하든 WordPress의 기본 테마를 사용하든 차이가 없습니다. 번거로움 없이 몇 분 안에 WordPress 웹사이트에 통합된 완전한 기능의 지식 기반을 갖게 됩니다.

테마 개발에 대한 지식이 있고 플러그인을 추가로 사용자 정의하려는 경우 깨끗하고 개발자에게 친숙한 코드, 연결 가능한 기능 및 따르기 쉬운 템플릿 시스템을 사용하여 고급 사용자 정의를 수행할 수 있습니다. 이 기사에서는 템플릿 시스템을 사용하여 플러그인을 사용자 정의하기 위해 수행할 수 있는 몇 가지 멋진 작업을 살펴봅니다.

다음에 대한 간략한 개요를 제공합니다.

• 플러그인 설치, 일반 설정 및 일부 콘텐츠 추가
• WordPress 4.4에서 사용할 수 있는 새로운 TwentySixteen 테마와의 기본 통합
• 고급 통합: 추가 사용자 지정을 위한 템플릿 수정

시작하기

WordPress의 초기 설치 후 TwentySixteen 테마와 지식 기반 플러그인이 모두 설치 및 활성화되어 있는지 확인하십시오.

TwentySixteen은 WordPress 4.4와 함께 제공되는 새로운 기본 테마입니다. WordPress 설치를 업그레이드한 후 모양 > 테마 아래에 새 테마가 나열되지 않으면 WordPress.org의 TwentySixteen 테마 페이지에서 다운로드할 수 있습니다.

기술 자료 플러그인

WordPress 자체와 마찬가지로 지식 기반 플러그인을 설정하는 것은 매우 쉽습니다. 플러그인이 활성화되면 시작하는 데 도움이 되는 몇 가지 기본 팁이 포함된 '시작하기' 화면으로 자동 이동됩니다. 대시보드 왼쪽 메뉴에 Knowledge Base라는 새 메뉴 항목도 있습니다.

기술 자료는 WordPress가 사용하는 표준 '게시물' 게시물 유형과 매우 유사한 방식으로 작동합니다. 기사는 카테고리 및 태그로도 구성할 수 있습니다. 카테고리는 게시물과 마찬가지로 언제든지 추가하거나 제거할 수 있지만 지식 기반이 최대한 유용하도록 하려면 콘텐츠 생성을 시작하기 전에 카테고리 구조를 계획하는 것이 좋습니다.

기본적으로 지식 기반 기사는 표준 게시물과 동일하게 게시 날짜 순서로 표시되지만 플러그인 설정 내에서 이를 변경할 수 있습니다.

기술 자료에는 템플릿을 전혀 탐색할 필요 없이 설치를 사용자 정의할 수 있는 다양한 설정이 제공됩니다.

이것을 그대로 둘 수 있으며 지식 기반이 완벽하게 작동합니다. 그러나 기사 순서, 카테고리 표시 방법, 실시간 검색 기능 사용자 정의, 기사에 대한 투표 및 댓글 활성화 및 광범위한 코딩 지식이 없어도 다른 옵션을 사용할 수 있습니다.

콘텐츠 만들기

지식 기반에 대한 고급 사용자 지정을 시작하려면 먼저 몇 가지 콘텐츠가 필요합니다. 따라서 가장 먼저 해야 할 일은 몇 가지 기사를 작성하는 것입니다. TwentySixteen 테마가 설치되면 새 화면 추가

이전에 WordPress를 사용한 적이 있다면 매우 친숙하게 보일 것입니다. 게시물 제목, 콘텐츠, 게시, 게시물 형식, 카테고리 및 태그 상자는 모두 동일합니다. 사실 다른 유일한 영역은 기사 옵션과 투표 옵션입니다.

또는 시작하는 동안 시작하기 화면에서 기본 콘텐츠를 설치할 수 있습니다.

TwentySixteen과 통합

기술 자료 플러그인을 TwentySixteen 테마와 통합하는 것은 정말 간단합니다. 위의 단계를 따랐다면 끝입니다. 거기에 그대로 두면 더 이상 추가 작업을 수행할 필요 없이 보기 좋은 기능적 지식 기반을 갖게 됩니다. 코드를 잘 모르거나 빠르고 간단한 설정을 원하는 경우에 적합합니다.

하지만... 더 하고 싶다면?

테마 개발자를 위한 플러그인의 정말 좋은 점은 템플릿 시스템입니다.

템플릿 시스템은 플러그인에서 테마 폴더로 변경하려는 템플릿 파일을 복사하여 작동합니다. 그런 다음 WordPress는 먼저 테마를 확인합니다. 테마에 관련 템플릿 파일이 있으면 해당 파일이 사용됩니다. 그렇지 않은 경우 플러그인 폴더 내의 폴백 템플릿이 대신 the_content() 함수를 가로채고 지식 기반 콘텐츠를 표준 page.php 에 삽입하는 데 사용됩니다.

플러그인 또는 테마 내의 템플릿 계층 구조는 표준 WordPress 템플릿 계층 구조와 매우 유사한 방식으로 작동하므로 쉽게 이해할 수 있습니다.

예를 들어 hkb-taxonomy-category.php 는 category-$slug.php 가 표준 archive.php 를 재정의하는 것과 거의 같은 방식으로 hkb-archive.php 를 재정의합니다.

WordPress 템플릿 계층 구조에 대해 더 알고 싶다면 개발자 코덱스에서 읽을 수 있습니다.

템플릿 사용자 정의

기본적으로 기술 자료 섹션은 TwentySixteen 테마를 사용할 때 다음과 같이 표시됩니다.

괜찮습니다. TwentySixteen은 매우 멋진 스타일의 모바일 우선 테마입니다. 그러나 페이지 템플릿의 레이아웃으로 인해 기술 자료 페이지에는 웹 사이트의 다른 페이지에 비해 많은 데드 스페이스가 있습니다.

지식 기반 페이지에는 이 공백이 모두 필요하지 않으므로 관련 템플릿의 HTML을 수정하여 제거하면 됩니다.

하지만 그 전에 TwentySixteen에 대한 하위 테마를 생성해야 테마 업데이트가 출시될 때 변경 사항이 손실되지 않습니다. 나는 내 폴더 를 26-10대 라고 불렀다. 하위 테마에 대한 자세한 내용은 하위 테마에 대한 기사에서 찾을 수 있습니다.

자식 테마를 설정했으면 이제 템플릿 편집 작업을 시작할 수 있습니다. twosixteen- child 폴더 안에 새 폴더를 만들고 이름을 hkb-templates 로 지정합니다. 그런 다음 플러그인 폴더에서 편집하려는 템플릿을 새로 생성된 템플릿 폴더로 복사합니다.

기술 자료 아카이브 페이지를 변경하려면 편집해야 하는 템플릿이 hkb-archive.php 입니다. 복사한 후에는 코드 편집기에서 엽니다. 넌 봐야 해:

<?php /** * Theme template for archive display */ ?>

<?php get_header(); ?>

<?php hkb_get_template_part('hkb-compat', 'archive'); ?>

<?php get_footer(); ?>

참고: 플러그인 내의 템플릿은 WordPress의 the_content() 함수를 사용하여 지식 기반 콘텐츠를 페이지에 삽입하기 때문에 페이지의 전체 구조는 처음에 템플릿에 포함되지 않습니다. 기본 템플릿을 재정의하고 있으므로 페이지에 추가 HTML을 추가해야 합니다.

따라서 hkb-archive.php 의 코드는 다음과 같이 변경되어야 합니다.

<?php /** * Theme template for archive display */ ?>
<?php get_header(); ?>

<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">
<?php // Include the page content template. hkb_get_template_part('hkb-compat', 'archive'); ?>
</main><!-- .site-main -->

<?php get_sidebar( 'content-bottom' ); ?>
</div>

<!-- .content-area -->

<?php get_sidebar(); ?><?php get_footer(); ?>

참고: 이 템플릿에는 while 루프를 포함할 필요가 없습니다.

파일을 저장하고 페이지를 봅니다. 이제 다음과 같이 보일 것입니다.

이것은 이제 twosixteen 테마의 표준 page.php 레이아웃을 사용하고 왼쪽에서 공백을 제거했습니다. 그러나 실제로 플러그인 스타일도 모두 제거했으며 대신 이제 테마의 기본 스타일을 따릅니다.

테마 사용자 정의를 시작하자마자 플러그인은 사용자가 자신만의 스타일을 자유롭게 작성할 수 있기를 원한다고 가정하고 스타일시트를 로드하지 않기 때문입니다. 이것은 완전히 맞춤형 테마를 구축할 때 정말 유용하지만 기존 스타일을 유지하려면 hkb-style.css 의 스타일을 복사하여 자식 테마의 style.css 에 붙여넣을 수 있습니다. 또는 맞춤형 테마를 생성하는 경우 플러그인 폴더에서 테마 폴더로 스타일시트를 복사한 다음 다음 코드 줄을 사용하여 functions.php 에 큐에 넣을 수 있습니다.

// Knowledge Base plugin styles
wp_enqueue_style( 'hkb-style', get_template_directory_uri() . '/css/hkb-style.css', array( 'twentysixteen-style' ), '20151217' );

참고: 이 방법을 자식 테마와 함께 사용하는 경우 get_template_directory_uri() get_stylesheet_directory_uri() 를 사용해야 합니다. 이는 get_stylesheet_directory_uri() 가 하위 테마의 파일 구조를 보고 get_template_directory_uri() 가 대신 상위 테마 폴더를 가리키기 때문입니다.

기존 테마를 자식 테마로 수정하는 대신 맞춤형 테마를 구축하는 경우 개인적으로 스타일시트를 별도로 유지하고 enqueue 메서드를 사용하여 테마에 스타일을 적절하게 주입하는 것을 선호합니다. 이는 style.css가 종종 매우 커서 빠르게 관리하기 어려울 수 있기 때문입니다. 관련 스타일을 별도로 유지하면 추가 편집이 필요할 때 쉽게 찾을 수 있기 때문입니다. SASS와 같은 전처리기를 사용하는 경우 동일한 조직을 사용할 수 있습니다. 그러면 새 스타일시트를 @import 하여 style.css 에 자동으로 결합한 다음 wp_enqueue_style() 을 사용하여 테마에 삽입할 수 있습니다.

스타일을 다시 적용한 후 페이지를 다시 보면 다음이 표시됩니다.

이제 페이지가 다시 형식화되었으며 왼쪽의 공백이 제거되어 테마의 스타일과 디자인을 잃지 않고 모든 것이 훨씬 깔끔해 보입니다. 이 레이아웃 변경 사항을 적용하려는 다른 페이지 템플릿이 있는 경우 관련 템플릿을 하위 테마에 복사하기만 하면 됩니다!

마지막 생각들

Heroic Knowledge Base 플러그인이 얼마나 커스터마이징이 가능한지 보여주었기를 바랍니다. 코드를 알 필요 없이 즉시 사용할 수 있는 작업이 많이 있지만, 추가로 사용자 정의하고 WordPress 코드 표준 및 테마 개발에 대한 이해가 있다면 매우 쉽게 수행할 수 있습니다.