Szablony WordPress dla początkujących: HTML Wywołanie PHP
Wczoraj naszkicowałem, jak określić, ilu z nas jest prawdopodobnie przyzwyczajonych do pracy z szablonami WordPress.
Chociaż rozdzielenie problemów związanych z CSS i JavaScript jest solidne, szablony są problematyczne, gdy jest dużo PHP zmieszanego z naszymi znacznikami.
Aby było jasne, nie możemy pomóc, ale dołączamy tagi szablonów, ponieważ jest to natura działania WordPressa i ogólnych systemów zarządzania treścią opartych na PHP.
Problem pojawia się zawsze, gdy pracujemy z szablonami, które zawierają kod wykonujący bardziej złożone wywołania różnych interfejsów API. Chociaż zademonstrowałem to za pomocą WP_Query (i nadal będę to robić), nie jest to tylko to zapytanie.
W każdym razie, co mamy z tym zrobić?
Szablony WordPress: kiedy HTML wywołuje PHP
Po pierwsze, ważne jest, aby zastanowić się, dlaczego mieszanie tak dużej ilości PHP i znaczników jest złym pomysłem.
Łatwo powiedzieć, że utrudnia to utrzymanie kodu w stanie suchym (i jest w tym prawda), ale co, jeśli raz użyjemy pojedynczego zapytania lub pojedynczego bloku kodu? Czy w takim razie bycie SUCHE jest naprawdę takie ważne?
Aby było jasne, tak, myślę, że jest to ważne ze względu na utrzymanie kodu w stanie suchym, ale jeśli zamierzamy użyć wywołania tylko raz, nadal uważam, że ma to znaczenie, jeśli nie z innego powodu niż utrzymanie kodu szablonu tak czystego, jak możliwy.
Pomyśl o tym w ten sposób: Za każdym razem, gdy chcemy wyświetlić tytuł, treść i autora posta, wystarczy wywołać trzy funkcje:
Wyobraź sobie więc adaptację poniższego kodu (o czym przyjrzeliśmy się w poprzednim poście):
<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 -->Aby wyglądać mniej więcej tak:
<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 -->Dużo czystszy, prawda? Ale w tym, co widzisz, jest coś więcej. W szczególności, jeśli zamierzamy pracować z HTML za kulisami, musimy upewnić się, że prawidłowo go oczyszczamy, używając czegoś takiego jak 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(),
);
);
}Obecnie pomysł przeniesienia kodu HTML z PHP do szablonu WordPress jest uważany przez niektórych programistów za anty-wzorzec. I to nie jest bez zasług.
W trakcie tej serii należy jednak zachować równowagę: chodzi o wprowadzenie, jak ludzie często prezentują informacje, a następnie o ich posprzątanie.
Idąc dalej, możliwe jest – i wcale nie jest to zły pomysł – oddzielenie funkcji WP_Query jeszcze bardziej, aby użyć get_template_part. Niesie to za sobą trochę czystszego kodu, ale wymaga również dogłębnego przyjrzenia się tej funkcji.
I to jest coś, czego nie interesuje mnie w tej konkretnej serii.
Jak powinniśmy to wizualizować?
Jeśli chodzi o szablonowanie, możemy to konceptualizować na kilka różnych sposobów.
- W niektórych językach szablonów warto pomyśleć o wstrzykiwaniu informacji do szablonu przez PHP,
- W powyższym przykładzie warto pomyśleć o pliku szablonu żądającym informacji ze skryptu PHP.
W powyższym przykładzie mamy funkcję umieszczoną na przykład w functions.php i wywołujący ją plik szablonu:
Ma sens? Ale sposób, w jaki to się robi – pod względem kodu stojącego za tym pojedynczym wywołaniem funkcji – jest zadowalający dla samego posta.
I o tym będę się przyglądał w następnym poście.