Membuat template file parsial di WordPress

Template file parsial pada Wordpress sering kali digunakan untuk memecah kode menjadi potongan yang l

Apa itu template file parsial?

Kemungkinan besar, Anda telah menggunakan template file parsial tanpa menyadarinya.

Yaitu template file header.php, footer.php, sidebar.php, comments.php dan content-{$slug}.php yang pada dasarnya adalah template file parsial default.

Cara terbaik untuk memahami apa itu template file parsial adalah dengan melihat contoh. Katakanlah Anda membuat sebuah menu navigasi, dan Anda ingin disetiap halaman menu navigasi ini ada.

Cara yang kurang efektif untuk melakukan ini dengan menyalin dan menempelkan kode pada setiap halaman yang di inginkan. Cara ini tidak disarankan.

Lebih baik Anda menggunakan template file parsial dengan menaruh kode tersebut dihalaman header.php lalu panggil header.php disetiap halaman yang Anda inginkan.

Header.php

Header.php adalah salah satu template file parsial, terkadang ada yang menyebutnya template tag.

Hampir semua tema memiliki template file header.php karena fungsionalitas dan pemeliharaan file ini yang hampir wajib.

Berikut contoh template file parsial header.php

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
	<meta charset="<?php bloginfo( 'charset' ); ?>" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="profile" href="http://gmpg.org/xfn/11" />
	<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<?php wp_body_open(); ?>
	<header>
        
        <h1><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
        <p><?php bloginfo( 'description' ); ?></p>

        <nav>
        <?php 
        if ( has_nav_menu( 'menu-primary' ) ) : 
            wp_nav_menu( 
                array(
                    'container' => false,
                    'theme_location' => 'menu-primary',
                )
            );	
        endif; 
        ?>
        </nav>
	</header>

Template file parsial tidak akan dirender kecuali memang dipanggil. Untuk memanggil template file parsial header.php dengan menggunakan <?php get_header(); ?>

Berikut contoh untuk memanggil template file parsial header.php

<?php get_header(); ?>
<main>
    <h1>Hello World</h1>
</main> 
  • <?php language_attributes(); ?> Digunakan untuk menentukan bahasa. Ini tergantung dipengaturan Settings > General > Site Language
  • <?php bloginfo( ‘bla bla bla’ ); ?> Digunakan untuk menampilkan informasi. Dokumentasi lebih lengkap
  • <?php wp_head(); ?> Digunakan untuk mengambil css, javascript dan resource-resource lainnya yang diperlukan
  • <?php body_class(); ?> Digunakan untuk memberikan class pada tag body
  • <?php wp_nav_menu(); ?> Digunakan untuk menampilkan menu yang terdaftar. Dokumentasi lebih lengkap

Footer.php adalah salah satu template file parsial, terkadang ada yang menyebutnya template tag.

Hampir semua tema memiliki template file footer.php karena fungsionalitas dan pemeliharaan file ini yang hampir wajib.

Berikut contoh template file parsial footer.php

<footer>
	<p>Copyright 2020</p>

	<?php wp_footer(); ?>
</footer>

</body>
</html>
Informasi: Seringkali pengembang akan menempatkan area widget di footer.

Template file parsial tidak akan dirender kecuali memang dipanggil. Untuk memanggil template file parsial footer.php dengan menggunakan <?php get_footer(); ?>

Berikut contoh untuk memanggil template file parsial footer.php

<?php get_header(); ?>
<main>
    <h1>Hello World</h1>
</main> 
<?php get_footer(); ?>

<?php wp_footer(); ?> Digunakan untuk mengambil css, javascript dan resource-resource lainnya yang diperlukan

404.php

404.php adalah salah satu template file parsial.

template file 404.php berperan sebagai feedback atau umpan balik apabila pengguna mencoba mengunjungi halaman yang tidak ada disitus Anda.

Jika Anda tidak mempunyai template file 404.php maka akan diarahkan ke template file index.php.

Praktek terbaik, membuat template file 404.php lalu memberikan pesan informasi yang menjelaskan bahwa halaman hilang atau tidak lagi tersedia.

Ini membantu menjaga aspek visual dari tema Anda konsisten dan memberikan informasi berguna kepada pengguna

Berikut adalah contoh template file 404.php sederhana:

<?php get_header(); ?>
<main>
	<header>
		<h1><?php esc_html_e( '404', 'goblog-free' ); ?></h1>
	</header>

	<p><?php echo "Halaman yang Anda tuju tidak ada atau tidak tersedia lagi!"; ?></p>
	
	<button>
		<a id="back" href="<?php echo esc_url( home_url( '/' ) ); ?>">
			<?php echo "Kembali ke Home"; ?>
		</a>
	</button>
</main>
<?php get_footer(); ?>

Comments.php

Comments.php adalah salah satu template file parsial, terkadang ada yang menyebutnya template tag.

Template file comments.php Ini adalah template file parsial yang ditarik ke template file lain untuk menampilkan komentar yang ditinggalkan pengguna pada halaman atau posting. 

Beberapa halaman dan kiriman yang berbeda menampilkan komentar sehingga masuk akal untuk memiliki hanya satu file yang dapat ditarik saat diperlukan.

Informasi: Anda akan belajar seputar commentst.php atau komentar dibab yang lainnya.

Kebanyakan tema menggunakan sidebar untuk menampilkan widget. Agar sidebar berfungsi dalam sebuah tema, ia harus didaftarkan dan kemudian template file untuk sidebar harus dibuat.

Template file sidebar sering kali memiliki pernyataan bersyarat dan fungsi is_active_sidebar( 'sidebar-name' ) di dalamnya untuk memastikan widget digunakan di dalam sidebar sehingga HTML kosong tidak ditambahkan ke halaman secara tidak perlu.

Berikut contoh sidebar.php sederhana:

<?php if ( is_active_sidebar( 'sidebar-name' )  ) : ?>
	<aside>
		<div class="container">
			<?php dynamic_sidebar( 'sidebar-name' ); ?>
		</div>
	</aside>
<?php endif; ?> 

Perhatikan contoh diatas!
Fungsi <?php dynamic_sidebar( 'sidebar-name' ); ?> digunakan untuk memanggil sidebar yang sudah terdaftar.

Informasi: Anda akan belajar seputar sidebar.php dibab yang lainnya.

Template part

Disaat para developer WordPress mengembangkan sebuah tema menjadi lebih besar, kemungkinan besar mereka akan memecah template mereke menjadi potongan yang lebih kecil.

Sebagai contoh Anda membuat template file page.php dan memecah baris kode dengan menyimpannya difolder template-parts/page/content.php

Berikut contoh halaman page.php yang sederhana:

<?php get_header(); ?>
<main>
	<div> 
		<?php
		while ( have_posts() ) : the_post();

			get_template_part( 'template-parts/page/content', 'page' );

			// If comments are open or we have at least one comment, load up the comment template.
			if ( comments_open() || get_comments_number() ) :
				comments_template();
			endif;

		endwhile; // End of the loop.
		?>
	</div>
</main> 
<?php get_footer(); ?>

Perhatikan code get_template_part( 'template-parts/page/content', 'page' );!!!

Jadi kesimpulannya, template part yang Anda taruh di folder template-parts/page/content.php bisa Anda gunakan berulang kali dengan memanggil get_template_part() untuk menarik content-{$slug} tersebut.

Berikut isi dari folder template-parts/page/content.php:

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
	<header>   
	    <?php the_title( '<h1 class="title">', '</h1>' ); ?>
	</header>
	<section>
	  	<?php the_content(); ?> 	
	</section>
</article>