Od napsání posledního dílu návodu, jak si vytvořit vlastní WordPress šablonu, je to již nějaká doba, je na čase přispět novým dílem. V této části si doplníme soubory šablony o single.php, page.php.
Dále si vytvoříme soubor content.php a připravíme se tak na podporu post formátů, které budou součástí některého z dalších dílů. Zároveň doplníme šablonu o podporu náhledových obrázků.
Soubor single.php
Soubor single.php zobrazuje detail článku. Pokud tedy v archívu, nebo výpisu kategorie kliknete na „Celý článek“, WordPress zavolá single.php.
<?php get_header(); ?>
<div class="row-fluid">
<div class="span8">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<!--BEGIN .hentry -->
<div <?php post_class() ?> id="post-<?php the_ID(); ?>">
<h1 class="entry-title"><?php the_title(); ?></h1>
<!--BEGIN .entry-content -->
<div class="entry-content">
<?php the_content(__('Read more...', 'theme')); ?>
</div>
<!--END .hentry-->
</div>
<?php endwhile; else: ?>
<div id="post-0" <?php post_class() ?>>
<h1 class="entry-title">
<?php _e('Error 404 - Not Found', 'theme') ?>
</h1>
<!--BEGIN .entry-content-->
<div class="entry-content">
<p><?php _e("Sorry, but you are looking for
something that isn't here.", "theme") ?></p>
</div>
</div>
<?php endif; ?>
</div>
<div class="span4">
<?php get_sidebar(); ?>
</div>
</div>
<?php get_footer(); ?>Jak můžete vidět, v souboru je nejprve loop a pokud není žádný odpovídající obsah, pomocí else je zobrazeno upozornění o nenalezení obsahu.
Soubor page.php
Soubor page.php je v podstatě statická stránka. Pokud vytvoříte například stránku Kontakt, při zobrazení WordPress zavolá soubor page.php.
<?php get_header(); ?>
<div class="row-fluid">
<div class="span8">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<!--BEGIN .hentry -->
<div <?php post_class() ?> id="post-<?php the_ID(); ?>">
<h1 class="page-title"><?php the_title(); ?></h1>
<div class="entry-content">
<?php the_content(); ?>
</div>
</div>
<?php endwhile; else: ?>
<div id="post-0" <?php post_class() ?>>
<h1 class="entry-title"><?php _e('Error 404 -
Not Found', 'theme') ?></h1>
<div class="entry-content">
<p><?php _e("Sorry, but you are looking for
something that isn't here.", "theme") ?></p>
</div>
</div>
<?php endif; ?>
</div>
<div class="span4">
<?php get_sidebar(); ?>
</div>
</div>
<?php get_footer(); ?>Můžete vidět, že soubory jsou si podobné, ale oba plní jinou funkci.
Content.php
Zde bude potřeba trochu povídání.
Soubor content nám umožní zjednodušit kód v celé šabloně a zároveň si připravíme šablonu na podporu post formátů. Do content.php totiž přesuneme loop. Tedy tu část kódu, která začíná if(have_post…. Díky tomu budeme mít loop pro single, archive, category, tag, author a search na jednom místě. Pokud se pak rozhodnete, že budete chtít u příspěvku zobrazovat datum vytvoření, upravíte pouze content.php a nemusíte upravovat další soubory. Vyjímkou je page.php.
Soubor content.php budeme z ostatních souborů volat pomocí:
get_template_part( 'content', get_post_format() );
Funkce get_template_part načte definovaný soubor a funkce get_post_format určuje jeho název v závislosti na použitém post format. Jestliže tedy nemáte podporu post formátů, nemusíte si s tím dělat starosti, načte se vždy content.php. Pokud šablona podporuje například video a existuje soubor content-video.php, načte se tento soubor. V případě, že neexistuje, opět se zobrazí content.php.
<div <?php post_class() ?> id="post-<?php the_ID(); ?>">
<?php
if ( is_search()|| is_home() || is_archive()
|| is_tag() || is_category() ) :
?>
<h2 class="title">
<a href="<?php the_permalink() ?>"
title="<?php the_title(); ?>">
<?php the_title(); ?>
</a>
</h2>
<div class="post-content">
<?php echo the_excerpt();?>
</div>
<?php else: ?>
<h1 class="entry-title"><?php the_title(); ?></h1>
<div class="post-content">
<?php the_content(__('Read more...', 'theme')); ?>
</div>
<?php endif: ?>
</div>Jak vidíte, soubor je rozdělen podmínkou na dvě části. První je pro všechny archive, category, author, tag, search soubory a obsahuje excerpt, tedy výpis části článku. Druhý je pro single a obsahuje výpis celého článku – content.
Nyní musíte projít author.php, archive.php, category.php, search.php, tag.php a single.php a část mezi while a endhile nahradit
<?php get_template_part( 'content', get_post_format() ); ?>Výsledek tedy bude:
<?php if (have_posts()) :
while (have_posts()) : the_post(); ?>
<?php get_template_part( 'content', get_post_format() ); ?>
<?php endwhile; ?>Tento postup vám v budoucnu ušetří spoustu práce. Možná se nyní ptáte, proč jsem to takto nepsal od začátku, je to protože jsem chtěl, aby jste viděli, jak je v souborech umístěn loop a co obsahuje.
Náhledové obrázky
Náhledové obrázky jsem popsal v článku Náhledové obrázky ve WordPressu a proto se budu zabývat jen jejich vložením do šablony.
Pro podporu náhledových obrázků musíme do functions.php vložit tento kód:
if ( function_exists( 'add_theme_support' ) ) {
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 56, 56, true ); // Normal post thumbnails
add_image_size( 'sidebar', 50, 50, true ); // Sidebar thumbnail
add_image_size( 'blog', 619, 300, true ); // Blog thumbnail
}Jen pro vysvětlení, rovnou vytvoříme malé náhledy pro využití v sidebaru ve velikosti 50×50 pixelů a náhledové obrázky, které použijeme ve výpisu článků budou přes celou šířku obsahu, proto 619px.
Do souboru content.php vložíme tento kód:
<?php if ( has_post_thumbnail() ) : ?>
<div class="entry-thumbnail">
<?php the_post_thumbnail('blog'); ?>
</div>
<?php endif; ?>Výsledek bude vypadat takto:
<div <?php post_class() ?> id="post-<?php the_ID(); ?>">
<?php
if ( is_search()|| is_home() || is_archive()
|| is_tag() || is_category() ) :
?>
<?php if ( has_post_thumbnail() && ! post_password_required() ) : ?>
<div class="entry-thumbnail">
<?php the_post_thumbnail(); ?>
</div>
<?php endif; ?>
<h2 class="title">
<a href="<?php the_permalink() ?>"
title="<?php the_title(); ?>">
<?php the_title(); ?>
</a>
</h2>
<div class="post-content">
<?php echo the_excerpt();?>
</div>
<?php else: ?>
<h1 class="entry-title"><?php the_title(); ?></h1>
<div class="post-content">
<?php the_content(__('Read more...', 'theme')); ?>
</div>
<?php endif: ?>
</div>A to je vše.
Díky tomu, že jsme vytvořili content.php a do něj přesunuli loop, nemusíte již nikam jinam vkládat kód pro zobrazení thumbnails. V tuto chvíli máme šablonu, která umí zobrazit výpisy článků, detail článku, stránku a navíc podporuje náhledové obrázky.
Doufám, že se mi podaří další díl napsat dříve, než za tři měsíce. V něm se chci zaměřit na vytvoření custom homepage, vytvoření template pro stránku se sidebarem a se sidebarem na levé straně.
Seriál: Jak vytvořit vlastní šablonu pro WordPress
- Jak vytvořit vlastní šablonu pro WordPress 1.díl
- Jak vytvořit vlastní šablonu pro WordPress 2.díl
- Jak vytvořit vlastní šablonu pro WordPress 3.díl
- Jak vytvořit vlastní šablonu pro WordPress 4.díl
- Jak vytvořit vlastní šablonu pro WordPress 5.díl
- Jak vytvořit vlastní šablonu pro WordPress 6.díl
- Jak vytvořit vlastní šablonu pro WordPress 7.díl
- Jak vytvořit vlastní šablonu pro WordPress 8.díl
