✅ WEB і WordPress новини, теми, плагіни. Тут ми ділимося порадами і кращими рішеннями для сайтів.

Шаблони WordPress для початківців: HTML виклик PHP

10

Учора я намалював, як зрозуміти, скільки з нас, імовірно, звикли працювати з шаблонами WordPress.

Хоча поділ проблем із CSS і JavaScript надійний, шаблони є проблематичними щоразу, коли багато PHP змішано з нашою розміткою.

Щоб було зрозуміло, ми не можемо не включити теги шаблонів, тому що така природа роботи WordPress і загальних систем керування вмістом на основі PHP.

Проблема виникає щоразу, коли ми працюємо з шаблонами, які містять код, що робить складніші виклики різних API. Хоча я продемонстрував це за допомогою WP_Query (і продовжуватиму це робити), це не просто той запит.

У будь-якому разі, що ми маємо з цим робити?

Шаблони WordPress: Коли HTML викликає PHP

По-перше, важливо подумати, чому змішувати стільки PHP і розмітки є поганою ідеєю.

Легко сказати, що це ускладнює збереження коду СУХИМ (і в цьому є правда), але що, якщо ми будемо використовувати лише один запит або один блок коду один раз? Чи так важливо бути СУХИМ?

Щоб було зрозуміло, так, я вважаю, що це важливо для того, щоб код залишався СУХИМ, але якщо ми збираємося використовувати виклик лише один раз, я все одно вважаю, що це має значення чи не з іншої причини, аніж щоб код шаблону був таким же чистим, як можливо.

Подумайте про це так: щоразу, коли ми хочемо відобразити заголовок, вміст і автора публікації, нам потрібно викликати лише три функції:

Отже, уявіть собі адаптацію наступного коду (це те, що ми розглядали в попередній публікації):

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

Щоб виглядати приблизно так:

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

Набагато чистіше, правда? Але в тому, що ви бачите, є щось більше. Зокрема, якщо ми збираємося працювати з HTML за лаштунками, нам потрібно переконатися, що ми правильно очищаємо його за допомогою чогось на зразок 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(),
    );
  );
}

Зараз деякі розробники вважають ідею відтворення HTML із PHP у шаблоні WordPress антишаблоном. І це не без підстав.

Однак під час цієї серії потрібно балансувати: потрібно представити, як люди часто подають інформацію, а потім трохи очистити її.

Розглянемо це трохи далі. Можливо – і це не зовсім погана ідея – ще більше відокремити функцію WP_Query для використання get_template_part. Це несе з собою трохи чистіший код, але також вимагає, щоб ми розглянули цю функцію поглиблено.

І це те, що мені не цікаво робити в цьому конкретному серіалі.

Як нам це уявити?

Коли справа доходить до шаблонів, ми можемо концептуалізувати це кількома різними способами.

  1. У деяких мовах створення шаблонів корисно уявити, що PHP вводить інформацію в шаблон,
  2. У наведеному вище прикладі корисно подумати про файл шаблону, який запитує інформацію зі сценарію PHP.

Отже, у наведеному вище прикладі ми маємо функцію, розташовану, скажімо, у functions.php, і файл шаблону, який її викликає:

Мати сенс? Але те, як це досягається – з точки зору коду, що стоїть за цим єдиним викликом функції – є контентом для публікації.

І саме це я розгляну в наступній публікації.

Джерело запису: tommcfarlin.com

Цей веб -сайт використовує файли cookie, щоб покращити ваш досвід. Ми припустимо, що з цим все гаразд, але ви можете відмовитися, якщо захочете. Прийняти Читати далі