WordPress 튜토리얼 : 추천서 작성 방법

  • 워드 프레스
  • 업데이트 : 8 월 12, 2013

그래서, 여기 우리는 WordPress에 관한 두 번째 주간 자습서를 준비하고 있습니다. 우리는 무한 스크롤링 WP 사이트페이지 플립 플러그인 과거에. 오늘은 맞춤 게시물 유형과 데이터로드 방법에 대해 조금 더 배우게 될 것입니다.

이 기능은 추천 사이트를 보여줄 수 있기 때문에 사이트에서 매우 중요합니다. 고객의 평가는 위대한 사회적 증거입니다. 또한 복잡한 플러그인이나 많은 코드가 필요하지 않습니다. 몇 가지 파일을 통해 볼 수 있듯이 고객의 사례에 맞는 섹시한 프레젠테이션을 만들 수 있습니다.

시작하자!

우편 및 설치

너가 서둘러 이것을 확인한다면, 너는 할 수있다. 다운로드 그것을 설치합니다.

당신은 대시 보드에서 볼 수있는 새로운 회원 평가를 사용하여 몇 가지 증언을 추가하여 몇 가지 데이터를 추가해야합니다 :

추천서

그런 다음 기본 단축 코드를 사용하여로드 할 수 있습니다.

[고객 후기 = 0 max = 5]

해당 코드를 추가하면 페이지에 다음과 같은 내용이 표시됩니다.

주요 추천서

이제는 더 많은 기능을 추가하고 모양을 변경하여이를 만들고 탐색하는 방법을 살펴 보겠습니다.

기초

이전에 말씀 드린 것처럼 헤더 메타 데이터, 플러그인 파일 생성 및 스크립트 호출. 긴 이야기하자면, 플러그인 이름 아래에 wp-content / plugins 아래에 새 폴더를 만들고 기본 플러그인 파일이 될 폴더와 같은 이름의 파일을 만듭니다.

복사 및 붙여 넣기를 완료하면 다음과 같이 수행하십시오.

<? php / * 플러그인 이름 : 사용 후기 설명 : 고객의 사용 후기를 표시합니다. 버전 : 1.0 저자 : 웹 수익 블로그 라이센스 : GPL2 * / // 스크립트 및 스타일을 큐에 넣기 function plugin_scripts () {wp_enqueue_script ( 'jquery'); wp_enqueue_script ( 'flexslider', plugins_url ( 'js / jquery.flexslider-min.js', __FILE__), 배열 ( 'jquery'), '2.2', false); wp_enqueue_script ( 'testimonials', plugins_url ( 'js / testimonials.js', __FILE__), 배열 ( 'jquery'), '1.0', false); wp_enqueue_style ( 'flexsliderCSS', plugins_url ( 'css / flexslider.css', __FILE__), false, '2.2', 'all'); wp_enqueue_style ( 'testimonialsCSS', plugins_url ( 'css / testimonials.css', __FILE__), false, '1.0', 'all'); } add_action ( "wp_enqueue_scripts", "plugin_scripts");

여기에 우리가하는 일이 있습니다.

  • WP에 우리 플러그인 이름, 저자, 무엇을하는지 알려주는 것.
  • 일반 스크립트 (예 : jQuery)와 사용자 정의 스크립트 (예 : flexslider) 및 스타일 시트
  • 기본 스크립트 호출에서 스크립트 기능을로드하기 위해 WP에 알려줌으로써 실제로 페이지에로드됩니다.

모두 멋지지만 / js 및 / css 아래에 실제로 파일을 만드는 것을 잊지 마십시오. 데모 컨텐츠에서 다운로드 할 수 있으므로 flexslider 파일을 찾기 위해 많이 파지 할 필요가 없습니다.

이제 우리는 재미있는 부분을 시작할 수있는 모든 기본적인 것들을 갖추고 있습니다.

사용자 정의 게시 유형

기본적으로 WordPress에는 2 일반 게시물 유형, 페이지 및 게시물이 있습니다. 하지만 또한 내부 게시물 유형이 많습니다 (예 : 첨부 파일). 따라서 "게시물 유형"정의는 다음과 같습니다. 저장해야하는 모든 유형의 데이터.

우리 플러그인은 새로운 기능을 생성 할 것이므로 WP는이를 저장하기위한 내장 된 장소가 없으므로이를 작성해야합니다. 작은 메뚜기 두려워하지 마라, 그것은 매우 간단하다, 당신은이 코드를 사용할 수있다 :

// 게시물 타입 함수를 생성하기위한 검은 마술 create_post_type () {register_post_type ( 'testimonials', // 새로운 포스트 타입 배열 ( 'labels'=> 배열 ( 'name'=> __ ( '고객의 소리)', 'singular_name' => __ ( '__ ('고객의 평가 ')),'public '=> true, / * 게시물 유형은 일반인을 대상으로합니다 (프론트 엔드와 wp-admin 포함) * /'supports '=> array ('title ','편집자 ','축소판 ','custom_fields '),'hierarchical '=> false)); }

여기에서는 register_post_type () 함수를 사용하여 WP에 "안녕 버디, 우리는 이러한 종류의 데이터를 저장해야합니다. 수신 준비를하십시오"라고 알려줍니다.

우리는 또한 이런 종류의 데이터를 "고객의 평가"라고 부르며 대중 액세스 용으로 사용할 수 있어야합니다 (실제로 대시 보드에 새 메뉴 항목을 작성해야 함), 우리가 필요로하는 필드 및 계층 형인지 여부 (부모 페이지와 하위 페이지가있는 페이지처럼)

WordPress를로드 할 때마다 호출해야합니다. 이 후크는 그것을 할 것입니다 :

add_action ( 'init', 'create_post_type');

사용자 정의 필드

이제 우리의 맞춤형 게시물 유형은 제목 (사람의 이름), 내용 (사람의 평가), 그림 (추천 이미지)을 가지고 있지만 링크가 없습니다. 왜냐하면 그 사람이 당신에 대해 이야기 할만큼 멋지 기 때문에 최소한 링크를해야합니다. 그들의 사이트, 맞죠?

일반적인 사용자 정의 필드로이 작업을 수행 할 수 있지만 사용자가 필드 이름을 입력 할 필요가없고 유효성 검사 규칙을 추가 할 수있는 "닫힌"필드를 사용하는 것이 훨씬 좋습니다.

우선 우리는 새로운 metabox를 만들 필요가 있습니다.이 물질은 post 편집 영역에있는 멋진 패널입니다. 각각의 작은 패널은 metabox입니다. 이 함수는 그것을 만들고 호출합니다 :

// add_meta_box ( 'custom-metabox', __ ( 'Link'), 'url_custom_metabox', '회원 평가', 'side', 'low'); } add_action ( 'admin_init', 'add_custom_metabox');

add_meta_box () 함수에는 다음 매개 변수가 필요합니다.

  1. ID - 고유 식별자입니다. 여기서 유니콘 먹는 무지개 나 추천자 링크와 같은 독특한 것을 사용할 수 있습니다. 내부적으로 사용할 수있는 모든 것
  2. 제목 - 사용자에게 표시 될 내용은 무엇입니까? 여기서 __ () 함수를 사용하는 것이 중요합니다. 외국어 사용자가 .po 파일로 플러그인을 번역 할 수 있도록하는 기능입니다 (플러그인 파일을 수정하지 않고).
  3. 콜백 (Callback) - 메타 옥스의 실제 내용을 가지고있는 함수.
  4. 게시 유형 - 사례에 대해서만 사용 가능하게하고 싶습니다.
  5. 컨텍스트 - 페이지에서 표시 할 위치
  6. 우선 순위 - 동일한 위치의 다른 항목보다 먼저 또는 이후에 있어야하는 경우

이제 우린 호출 했으므로 url_custom_metabox () 함수를 만들어야합니다.

// 관리 영역의 HTML 함수 url_custom_metabox () {global $ post; $ urllink = get_post_meta ($ post-> ID, 'urllink', true); // 확인 중! if (! preg_match ( "/ http (s?) : ///", $ urllink) && $ urllink! = "") {$ errors = "이 URL은 유효하지 않습니다"; $ urllink = "http : //"; } // invlid url 메시지를 출력하고 http : //를 입력 필드에 추가합니다 if (isset ($ errors)) {echo $ errors; }?> <p> <label for = "siteurl"> URL : <br /> <input id = "siteurl"size = "37"name = "siteurl"value = "<? php if (isset ($ urllink) ) {echo $ urllink;}?> "/> </ label> </ p> <? php}

이제 이것을 이것을 평이한 영어로 번역합니다 :

  • 전역 변수 $ post가 호출되므로 현재 항목의 POSTID가 무엇인지 알 수 있습니다
  • URL의 현재 값을로드합니다.
  • 사용자가 삽입 한 값이 유효한지 확인합니다. 하나 이상의 "http"또는 "https"발생이 있으면 값은 OK이고, 그렇지 않으면 유효하며 기본값을 사용해야합니다
  • 그런 다음 오류가 표시되면 오류를 표시합니다.
  • 이제 실제 HTML을 시작하고 PHP에서와 같이 입력 필드에 기본값을 추가합니다.

이 시점 이후에 사용자가 보낸 내용을 실제로 저장해야합니다. 우리는 "save_post"훅을 사용할 것이므로 WordPress가 포스트를 저장할 때마다이 함수를 호출 할 것입니다 :

// 사용자 정의 필드 데이터 저장 save_custom_url ($ post_id) {global $ post; if (isset ($ _ POST [ 'siteurl'])) {update_post_meta ($ post-> ID, 'urllink', $ _POST [ 'siteurl']); }} add_action ( 'save_post', 'save_custom_url');

여기서는 필드 이름 인 '사이트 링크'라는 게시물 데이터가 있는지 확인합니다. 사이트 링크가 있으면 저장하십시오.

모든 것이 완료되면 다음과 같이 귀하의 새 회원 평가 페이지가 표시됩니다.

새로운 - 회원 평가

맞춤 데이터로드하기

이제 우리는 실제로 아이템을로드 할 필요가 있습니다. 그리고 우리는 get_posts () 함수를 사용할 것입니다. 왜냐하면 우리는 간단한 데이터 만 가지고 있기 때문에 적절한 WP 루프가 필요하지 않습니다. (이것은 많은 DB 호출을 추가 할 것이고 우리는 실제로 필요 없어).

먼저, 우리 사이트의 링크를 얻는 함수를 만들어 봅시다.

// post 함수에 대한 URL 반환 get_url ($ post) {$ urllink = get_post_meta ($ post-> ID, 'urllink', true); return $ urllink; }

이제 shortcode 함수를 시작할 수 있습니다. 간단한 코드 데이터의 기본값을 설정하고 유효성을 검사하는 간단한 방법은 루프의 속성을 배열로 만드는 것입니다. 따라서 다음과 같이 새 항목을 필요할 때 추가 할 수 있습니다.

// 평가를 보여주기 위해 단축 코드를 등록 함 function load_testimonials ($ a) {$ args = array ( "post_type"=> "testimonials"); if (isset ($ a [ 'rand']) && $ a [ 'rand'] == true) {$ args [ 'orderby'] = 'rand'; } if (isset ($ a [ 'max'])) {$ args [ 'posts_per_page'] = (int) $ a [ 'max']; } // 모든 회원 평가 받기 $ posts = get_posts ($ args); // HTML 출력} add_shortcode ( "testimonials", "load_testimonials");

볼 수 있듯이 WordPress에서 필요로하는 형식으로 유효성을 검사 할 때 shortcode 속성이로드되고 $ args 배열로 전달되므로이를 사용하여 게시물을로드 할 수 있습니다.

이제 Flexslider의 기본 구조에 따라 HTML 코드를 추가해야합니다. 다음과 같이 보입니다.

echo '<div>'; echo '<ul>'; foreach ($ posts as $ post) {// 엄지 이미지 받기 $ url_thumb = wp_get_attachment_thumb_url (get_post_thumbnail_id ($ post-> ID)); $ link = get_url ($ post); echo '<li>'; if (! empty ($ url_thumb))) {echo '<img src = "'. $ url_thumb. '"/>'; } echo '<h2>'. $ post-> post_title. '</ h2>'; if (! empty ($ post-> post_content)) {echo '<p>'. $ post-> post_content. '<br />'; } if (! empty ($ link)) {echo '<a href="'.$link.'"> 사이트 방문 </a> </ p>'; } echo '</ li>'; } echo '</ ul>'; echo '</ div>';

잠깐, 왜 PHP 함수 안에 HTML 코드를 만들겠습니까? 이는 사용자가 콘텐츠를 추가 한 경우에만 조건부로 콘텐츠를로드 할 수 있기 때문에 HTML 태그가 비어 있지 않고 레이아웃을 망칠 때까지 기다리지 않기 때문입니다.

사이드 바는 어떨까요?

대부분의 사람들은 사이드 바에 고객의 평가를 보여주기를 원하며, 텍스트 위젯이 단문을 처리하지 않기 때문에이 플러그인이 실제로 작동하지 않습니다. 이에 대한 간단한 해결책이 있습니다. 코드에 다음 코드를 추가하십시오.

add_filter ( 'widget_text', 'do_shortcode');

무엇 향후 계획?

자,이 튜토리얼을 즐겼습니까? 귀하의 회원 평가 코드의 옵션으로 무엇을 추가 하시겠습니까? 미래 게시물에 대한 아이디어가 있습니까? 의견 섹션을 사용하여 알려주십시오!

로체스터 올리베이라에 대하여

나는 웹 디자이너이자 기업가 인 Itajubá (MG), Brasil입니다. 나는 모호한 주제에 대해 쓰고 멋진 것들을하는 것을 좋아합니다.