Warunkowe wyświetlanie wyróżnionych obrazków w WordPressie. Jak napisać instrukcję

Załóżmy, że na swojej stronie internetowej masz listę artykułów, którą chcesz wyświetlać w dwóch różnych układach: siatce czterokolumnowej i siatce dwukolumnowej, w zależności od kategorii artykułu.

Jak stworzyć nowe rozmiary zdjęć w WordPressie już wiesz. W tym artykule dowiesz się jak napisać instrukcję warunkową która wyświetli miniatury w zależności od tego czy zostały one dodane w panelu czy nie.

Zastosowanie

Dzięki takiej instrukcji możemy wyświetlić specjalny wygląd kafla dla postów które miniatury nie mają i uniknąć nieciekawego wyglądu całości feedu z postami, gdzie przy niektórych pojawi się tylko nagłówek bez zdjęcia. Podobnie uczynić możemy w innym miejscu strony np. w nagłówku strony artykułowej gdzie przygotujemy kod w opcji ze zdjęciem i bez zdjęcia.

Nasza instrukcja warunkowa

Część kodu pętli która wyświetla artykuły może wyglądać następująco:

<?php if ( has_post_thumbnail() ) { // Sprawdza czy artykuł ma miniaturę ?>
  <li id="post-<?php the_ID(); ?>">
    <figure>
      <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
        <?php the_post_thumbnail('my-custom-size'); ?>
      </a>
    </figure>
    <header>
      <h2><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h2>
    </header>
  </li>
<?php } else { ?>
  <li id="post-<?php the_ID(); ?>" <?php post_class('no-thumb'); ?>>
    <header>
      <h2><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h2>
    </header>
  </li>
<?php } ?>

Kod if ( has_post_thumbnail() ) sprawdza czy w artykule została dodana miniatura. Jeśli tak to użyty zostaje kod HTML odpowiadający za wyświetlanie kafla z miniaturą. Miniaturę wyświetla kod the_post_thumbnail('my-custom-size'); Żeby tak się stało, miniaturę my-custom-size musimy wcześniej stworzyć czyli zdefiniować ją w pliku functions.php. Jeśli miniatury w artykule nie ma, wyświetli się HTML następujący po } else { czyli bez tagu <figure> z miniaturą. Zamiast tego mamy tam dodaną klasę no-thumb, która odpowiada za wygląd kafla bez miniatury.

Tagi: wordpress