gestione di grandi output HTML tramite codice plugin

9

Di recente ho scritto il mio primo plug-in WP che aggiunge un shortcode per incorporare una galleria di immagini jquery personalizzata nei post. In primo luogo scarica solo un buon pezzo di HTML nel post, insieme a javascript necessario per l'inizializzazione.

Tuttavia, ho dovuto creare l'output HTML proceduralmente, come una stringa in PHP. Questo tipo di tag soup mi fa sempre impazzire e sono abituato a lavorare con i framework MVC che forniscono cose come funzioni di supporto e modelli parziali per la generazione di HTML.

Qual è l'approccio generale per gli autori di plug-in che devono gestire grandi quantità di HTML o JS creati dinamicamente?

plugins html plugin-development

— Bryan M.
fonte

12

@Byran M. Tendo a usare due costrutti che non vedo spesso altri sviluppatori WordPress che usano spesso, il che mi sorprende, ma mi piacciono molto.

1.) Heredocs

Puoi archiviare grandi blocchi di testo come stringa heredocs che potrebbero apparire così, così posso archiviarmi preoccupandomi di mescolare virgolette singole e doppie:

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

Si noti che le variabili potrebbero essere passate a una funzione come una matrice e quindi modificate extract()oppure è possibile assegnarle in altri modi. Si noti inoltre che uso le parentesi graffe non perché sono sempre richieste ma rendono più semplice la lettura del codice. (Naturalmente con funzioni come the_content()essere materialmente diverse da get_the_content()WordPress non sempre questo stile di programmazione è facile.)

Inoltre, anche se potrebbe non essere rilevante per te, se uso nomi ereditari come HTML, SQL, ecc., Il mio IDE PhpStorm esegue l'iniezione di sintassi e mi darà il completamento automatico e la colorazione della sintassi all'interno dell'ereditarietà.

2.) Concatenazione di stringhe utilizzando una matrice

L'altro linguaggio che mi piace usare è quello di raccogliere il contenuto in un array e quindi implode()nell'array. Anche se non l'ho mai confrontato, quindi potrebbe essere meno utile di quanto presumo, so che la concatenazione di stringhe ripetute è un killer poiché le stringhe diventano più grandi (se qualcuno sa perché questo approccio non è migliore o se conosci un approccio migliore I mi piacerebbe ricevere feedback):

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
fonte

1

+1 per Heredocs, sono fantastici, specialmente in questa situazione.

— nessuno

Non ho davvero avuto il tempo di valutarlo, ma sembra l'approccio più semplice dato quello di cui ho bisogno.

— Bryan M.,

+1 per la concatenazione di array / stringhe. Io lo faccio spesso. Semplifica la costruzione di stringhe senza spazi e linee nuove estranee.

— s_ha_dum,

5

Dai un'occhiata a questa funzione per PHP:

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

Puoi bufferizzare un file incluso che conterrebbe semplicemente codice html in esso, in una variabile php. Questo renderà più pulito da mantenere.

Quindi finisci con qualcosa del genere:

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

Quindi puoi semplicemente restituire $ includedhtml dove ne hai bisogno e mantiene separato il tuo contenuto html dal dover riecheggiare tutto all'interno delle stringhe php.

— Todd Perkins
fonte

4

In realtà non ho usato questo framework, ma il modello di modello che offre sarà probabilmente interessante. Potresti dare un'occhiata a come l'autore lo ha impostato.

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

Modelli ========= Ove possibile, dovremmo separare PHP dall'HTML. All'interno di Wordpress, vedrai i due mescolati insieme senza apprensione. Mentre questo è spesso un "modo semplice" di fare le cose, non è quasi mai il "modo giusto". Invece, dovremmo separare i due, mantenendo così la nostra logica pura e le nostre opinioni stupide. A questo scopo abbiamo il metodo $ this-> render ('my-template'). Alcuni esempi:

    // 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>

— marfarma
fonte

Sta usando solo il buffering dell'output, come descritto da Todd Perkins nella sua risposta.

— Ian Dunn,

2

Dipende dal tipo di HTML e JS.

JavaScript

Prima di tutto, separa il più possibile le parti dinamiche dalle parti statiche. Quindi carica le variabili dinamiche di cui hai bisogno in fase di runtime e metti in coda i tuoi script statici nell'intestazione (o piè di pagina, qualunque cosa). Ma in questo modo, la maggior parte del tuo JS è separata dal tuo PHP.

HTML

Si tratta di costruire il codice in modo pulito in PHP. Se hai enormi blocchi di HTML che stai per riutilizzare, li memorizzerei come variabili separate. Quindi mettere insieme le cose quando viene chiamato lo shortcode è semplice come:

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

Invece di provare a costruirlo proceduralmente, costruisci un oggetto (sì, PHP supporta gli oggetti) che contiene tutti i tuoi diversi blocchi HTML, quindi istruiscili su quali usare e quali dati restituire. Questo ti farà risparmiare enormi quantità di tempo.

— EAMann
fonte