✅ Notizie, temi, plugin WEB e WordPress. Qui condividiamo suggerimenti e le migliori soluzioni per siti web.

Modelli WordPress per principianti: HTML Calling PHP

21

Ieri ho abbozzato come concettualizzare quanti di noi sono probabilmente abituati a lavorare con i modelli di WordPress.

Sebbene la separazione delle preoccupazioni con CSS e JavaScript sia solida, i modelli sono problematici ogni volta che c’è molto PHP mescolato con il nostro markup.

Per essere chiari, non possiamo fare a meno di includere i tag dei modelli perché questa è la natura del funzionamento di WordPress e dei sistemi di gestione dei contenuti generali basati su PHP.

Il problema si presenta ogni volta che lavoriamo con modelli che contengono codice che effettua chiamate più complesse a varie API. Anche se l’ho dimostrato usando WP_Query (e continuerò a farlo), non è solo quella query.

Comunque, però, cosa dovremmo fare con questo?

Modelli WordPress: quando HTML chiama PHP

Innanzitutto, è importante pensare al motivo per cui mescolare così tanto PHP e markup è una cattiva idea.

È facile dire che rende più difficile mantenere il codice ASCIUTTO (e c’è del vero), ma cosa succede se usiamo solo una singola query o un singolo blocco di codice una volta? Essere ASCIUTTI è davvero così importante allora?

Per essere chiari, sì, penso che sia importante per mantenere il codice SECCO, ma se useremo una chiamata solo una volta penso ancora che importi se non altro per mantenere il codice del modello pulito come possibile.

Pensala in questo modo: ogni volta che vogliamo visualizzare il titolo, il contenuto e l’autore del post, tutto ciò che dobbiamo chiamare sono tre funzioni:

Quindi immagina di adattare il seguente codice (che è quello che abbiamo visto nel post precedente):

<div id="content-container">

  <p>
    Oh! The garbage chute was a really wonderful idea. What an incredible smell you've discovered! Let's get out of here! 
    Get away from there... No! wait! Will you forget it? I already tried it. It's magnetically sealed! Put that 
    thing away! You're going to get us all killed.
  </p>

  <h2>List of Post Titles For Acme Post Type</h2>
  <?php
  $args = array(
    'post_status'    => 'publish',
    'post_type'      => 'acme',
    'posts_per_page' => '10'
  );
  $custom_query = new WP_Query( $args );

  if ($custom_query->have_posts()) {
    echo '<ul>';
    while ($custom_query->have_posts()) {
      $custom_query->the_post();
      echo '<li>'. get_the_title(). '</li>';
    }
    echo '</ul>';
    wp_reset_postdata();
  }
  ?>

  <p>
    Absolutely, Your Worship. Look, I had everything under control until you led us down here. You know, it's not 
    going to take them long to figure out what happened to us. It could be worst... It's worst. 
    There's something alive in here! That's your imagination. Something just moves past my leg! 
    Look! Did you see that? What? Help!
  </p>

</div><!-- #content-container -->

Per assomigliare a questo:

<div id="content-container">

  <p>
    Oh! The garbage chute was a really wonderful idea. What an incredible smell you've discovered! Let's get out of here! 
    Get away from there... No! wait! Will you forget it? I already tried it. It's magnetically sealed! Put that 
    thing away! You're going to get us all killed.
  </p>

  <h2>List of Post Titles For Acme Post Type</h2>
  <?php acme_get_titles(); ?>

  <p>
    Absolutely, Your Worship. Look, I had everything under control until you led us down here. You know, it's not 
    going to take them long to figure out what happened to us. It could be worst... It's worst. 
    There's something alive in here! That's your imagination. Something just moves past my leg! 
    Look! Did you see that? What? Help!
  </p>

</div><!-- #content-container -->

Molto più pulito, giusto? Ma c’è di più in quello che vedi oltre a questo. In particolare, se lavoreremo con HTML dietro le quinte, dobbiamo assicurarci di disinfettarlo correttamente usando qualcosa come wp_kses :

<?php

/**
 * Runs a custom query to get the most recent ten published articles of the
 * acme post type and then prints a sanitized list of the the titles.
 */
function acme_get_titles()
{

  $args = array(
    'post_status'    => 'publish',
    'post_type'      => 'acme',
    'posts_per_page' => '10'
  );
  $custom_query = new WP_Query( $args );

  if ($custom_query->have_posts()) {
    $html = '<ul>';
    while ($custom_query->have_posts()) {
      $custom_query->the_post();
      $html .= '<li>'. get_the_title(). '</li>';
    }
    $html .= '</ul>';
    wp_reset_postdata();
  }

  echo _acme_sanitize_titles($html);
}

/**
 * Uses the WordPress wp_kses() API to sanitize and echo the incoming markup.
 *
 * @param string $html The HTML to sanitize.
 */
function _acme_sanitize_titles($html) {

  if(empty($html)) {
    echo $html;
  }

  echo wp_kses(
    $html,
    array(
      'ul' => array(),
      'li' => array(),
    );
  );
}

Ora, l’idea di inserire l’HTML da PHP in un template WordPress è considerata un anti-pattern da alcuni sviluppatori. E questo non è senza merito.

C’è però un gioco di equilibrio da svolgere nel corso di questa serie: si tratta di introdurre il modo in cui le persone spesso presentano le informazioni e poi ripulirle un po’.

Per andare un po’ oltre, è possibile, e non del tutto una cattiva idea, separare ancora di più la funzione WP_Query per usare get_template_part. Questo comporta un po’ di codice più pulito, ma richiede anche che esaminiamo quella funzione in modo approfondito.

Ed è qualcosa che non mi interessa fare in questa particolare serie.

Come dovremmo visualizzarlo?

Quando si tratta di modelli, possiamo concettualizzare questo in un paio di modi diversi.

  1. In alcuni linguaggi di template, è utile pensare al PHP che inserisce le informazioni nel template,
  2. Nell’esempio sopra, è utile pensare al file modello che richiede le informazioni dallo script PHP.

Quindi, nell’esempio sopra, abbiamo una funzione situata, diciamo, in functions.php e il file modello che la richiama:

Ha senso? Ma il modo in cui ciò viene realizzato, in termini di codice dietro quella singola chiamata di funzione, è contenuto per un post tutto suo.

Ed è quello che cercherò nel seguente post.

Fonte di registrazione: tommcfarlin.com

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More