플러그인 코드를 통한 큰 HTML 출력 처리

9

최근에 사용자 정의 jquery 이미지 갤러리를 게시물에 포함하기위한 짧은 코드를 추가하는 첫 번째 WP 플러그인을 작성했습니다. 주로 초기화에 필요한 자바 스크립트와 함께 좋은 HTML 덩어리를 게시물에 덤프합니다.

그러나 PHP의 문자열로 HTML 출력을 절차 적으로 작성해야했습니다. 이런 종류의 태그 수프는 항상 나를 혼란스럽게 만들고, HTML 생성을위한 도우미 기능 및 부분 템플릿과 같은 것을 제공하는 MVC 프레임 워크 작업에 익숙합니다.

많은 양의 동적으로 빌드 된 HTML 또는 JS를 관리해야하는 플러그인 작성자를위한 일반적인 접근 방법은 무엇입니까?

plugins html plugin-development

— 브라이언 엠
소스

12

@Byran M. 나는 두 가지 구문을 사용하는 경향이 있습니다. 다른 WordPress 개발자가 자주 사용하는 것을 자주 보지 못하지만 놀랍지 만 많이 좋아합니다.

1.) Heredocs

큰 텍스트 블록을 다음과 같은 heredocs 문자열로 저장할 수 있으므로 작은 따옴표와 큰 따옴표를 혼합하는 것에 대해 걱정할 수 있습니다.

   $html=<<<HTML
<input type="{$type}" size="{$size}" id="{$id}" class="{$class}" value="{$value}" />
HTML;

변수는 배열로 함수에 전달 된 다음 extract()ed로 또는 다른 방법으로 할당 할 수 있습니다. 또한 중괄호는 항상 필요하기 때문에가 아니라 코드를 읽기 쉽기 때문에 사용합니다. (물론 워드 프레스 와 the_content()실질적으로 다른 기능을 get_the_content()사용한다고해서 항상 이런 스타일의 코딩이 쉬운 것은 아닙니다.)

더 중요한 것은 HTML, SQL 등과 같은 heredoc 이름을 사용하는 경우 IDE PhpStorm에서 구문 삽입을 수행하고 heredoc 내에서 자동 완성 및 구문 색상 표시를 제공한다는 것입니다.

2.) 배열을 사용한 문자열 연결

내가 사용하고 싶은 다른 관용구는 내용을 배열로 수집 한 다음 배열로 수집하는 것 implode()입니다. 나는 이것을 벤치마킹 한 적이 없기 때문에 반복되는 문자열 연결이 문자열이 커짐에 따라 킬러가된다는 것을 알고 있다고 가정합니다. 의견을 듣고 싶습니다) :

function my_get_form_and_fields($input_items) {
    $html = array();
    $html[] = '<form name="my_form" method="get">';
    foreach($input_items as $input_item) {
        extract($input_item);
        $html=<<<HTML
<input type="{$type}" size="{$size}" id="{$id}" class="{$class}" value="{$value}" />
HTML;
    $html[] = '</form>';
    return implode("\n",$html);         
}

— MikeSchinkel
소스

1

Heredocs의 경우 +1, 특히이 상황에서 훌륭합니다.

— 아무도

실제로 이것을 평가할 시간이 없었지만 필요한 것을 감안할 때 가장 간단한 접근법처럼 보입니다.

— Bryan M.

배열 / 문자열 연결의 경우 +1 나는 그것을 많이한다. 불필요한 줄 바꿈과 공백없이 문자열을 쉽게 만들 수 있습니다.

— s_ha_dum

5

PHP에서이 기능을 확인하십시오 :

http://php.net/manual/en/function.ob-start.php

html 코드 만 포함하는 포함 된 파일을 php 변수로 버퍼링 할 수 있습니다. 이렇게하면 유지 관리가 더 깨끗해집니다.

따라서 다음과 같은 결과가 나타납니다.

ob_start();
   include('path/to/my/html/file.php');
   $includedhtml = ob_get_contents();
ob_end_clean();

그런 다음 필요한 곳에서 $ includedhtml을 반환하면 HTML 내용이 PHP 문자열 내부에서 모두 에코되지 않아도됩니다.

— 토드 퍼킨스
소스

4

실제로이 프레임 워크를 사용하지는 않았지만 제공하는 템플릿 모델은 아마도 매력적일 것입니다. 저자가 어떻게 설정했는지 살펴볼 수 있습니다.

https://github.com/Emerson/Sanity-Wordpress-Plugin-Framework

템플릿 ========= 가능할 때마다 PHP와 HTML을 분리해야합니다. 워드 프레스 안에서, 당신은 걱정하지 않고이 둘을 혼합 한 것을 볼 수 있습니다. 이것은 종종 일을하는 "쉬운 방법"이지만, 결코 "올바른 방법"은 아닙니다. 대신 우리는 둘을 분리하여 논리를 순수하게 유지하고 견해를 멍청하게 유지해야합니다. 이를 위해 $ this-> render ( 'my-template') 메소드가 있습니다. 몇 가지 예 :

    // From within a method in our controller
    $this->data['message'] = 'Pass this on to the template please';
    $this->render('my-template');

    // Meanwhile, in the /plugin/views/my-template.php file
    <h2>The Separation of Logic and Views</h2>
    <p><?php echo $this->data['message'];?></p>

— 마르 파르마
소스

Todd Perkins가 그의 답변에서 설명한 것처럼 출력 버퍼링을 사용하고 있습니다.

— Ian Dunn

2

HTML 및 JS 유형에 따라 다릅니다.

자바 스크립트

우선 동적 부품을 정적 부품과 최대한 분리하십시오. 그런 다음 런타임에 필요한 동적 변수를로드하고 정적 스크립트를 헤더 (또는 바닥 글 등)에 큐에 넣습니다. 그러나이 방법으로 대부분의 JS는 PHP와 분리되어 있습니다.

HTML

이것은 PHP에서 코드를 깔끔하게 작성하는 문제입니다. 재사용 할 거대한 HTML 덩어리가 있다면 별도의 변수로 저장합니다. 그런 다음 단축 코드가 호출 될 때 함께 정리하는 것은 다음과 같이 간단합니다.

echo $firstblock;
echo $shortcodecontent;
echo $lastblock;

절차 적으로 작성하는 대신 여러 HTML 블록이 모두 포함 된 객체 (예 : PHP는 객체를 지원함)를 구축 한 다음 사용할 블록과 전달할 데이터를 지시하십시오. 이렇게하면 엄청난 시간이 절약됩니다.

— EAMann
소스