プラグインコードによる大きなHTML出力の処理

9

私は最近、カスタムjquery画像ギャラリーを投稿に埋め込むためのショートコードを追加する最初のWPプラグインを書きました。これは主に、初期化に必要なJavaScriptとともに、HTMLの適切なチャンクを投稿にダンプするだけです。

ただし、HTML出力をPHPの文字列として手続き的に構築する必要がありました。この種のタグスープは常に私を不快にさせ、HTMLを生成するためのヘルパー関数や部分テンプレートなどを提供するMVCフレームワークでの作業に慣れています。

動的に構築された大量のHTMLまたはJSを管理する必要があるプラグイン作成者の一般的なアプローチは何ですか？

plugins html plugin-development

— ブライアンM.
ソース

12

@Byran M.私は他のWordPress開発者が頻繁に使用することはあまりない2つの構成要素を使用する傾向があり、これは私を驚かせますが、私はそれらをとても気に入っています。

1.）ヒアドキュメント

次のようなヒアドキュメント文字列として大きなテキストブロックを格納できるため、一重引用符と二重引用符の混在を心配する必要があります。

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

変数は配列として関数に渡されてからextract()編集されるか、他の方法で割り当てることができることに注意してください。また、中括弧は常に必要なためではなく、コードを読みやすくするために使用しています。（もちろんthe_content()、get_the_content()WordPressと実質的に異なるような機能を使用しても、このスタイルのコーディングが必ずしも簡単になるとは限りません。）

さらに、HTML、SQLなどのヒアドキュメント名を使用している場合は関係ないかもしれませんが、IDE PhpStormは構文インジェクションを行い、ヒアドキュメント内でオートコンプリートと構文カラーリングを提供します。

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);         
}

— マイクシンケル
ソース

1

ヒアドキュメントの+1、彼らは特にこの状況で素晴らしいです。

— 誰も

これを評価する時間は本当にありませんでしたが、私が必要とするものを考えると、それは最も簡単なアプローチのようです。

— ブライアン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から分離する必要があります。Wordpress内では、この2つは心配することなく混在しています。これは多くの場合、物事を行う「簡単な方法」ですが、「正しい方法」になることはほとんどありません。代わりに、2つを分離する必要があります。これにより、ロジックを純粋に保ち、ビューをぼんやりさせます。この目的のために、$ 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>

— マルファーマ
ソース

トッド・パーキンスが彼の答えで述べているように、それは単に出力バッファリングを使用しています。

— Ian Dunn

2

それはHTMLとJSのタイプに依存します。

JavaScript

まず、動的パーツと静的パーツをできるだけ分離します。次に、実行時に必要な動的変数をロードし、静的スクリプトをヘッダー（またはフッターなど）のキューに入れます。しかし、この方法では、JSの大部分はPHPから分離されています。

HTML

これは、PHPでコードをきれいに構築するための問題です。再利用する巨大なHTMLチャンクがある場合、それらを個別の変数として保存します。次に、ショートコードが呼び出されたときに物事をつなぎ合わせるのは次のように簡単です：

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

手続き的に構築するのではなく、さまざまなHTMLブロックをすべて含むオブジェクト（そう、PHPはオブジェクトをサポートしています）を構築し、どのブロックを使用し、どのデータを返すかを指示します。これにより、時間を大幅に節約できます。

— EAMann
ソース