As a web developer, using WordPress as a platform of your web can bring you on two sides. On one side, WordPress can be done easily without the need of high level of technical knowledge, as you can just do copy and paste code. While in other side, using WordPress may be a curse, as even you go against the WordPress coding standards for PHP, HTML, CSS and JavaScript, your theme are still doing well.

Therefore, to explore how to structure WordPress theme in a simple and practical way, you need to read the article below and take a closer look at the WordPress templating system and how data is retrieved, as this article will provide you with some tips to create a better WordPress theme web development practices.

1. Divide between Functionality and Presentation

Cram all the functionality into their theme, when much of it belongs in plugins is what most WordPress theme authors try to do. Moreover, on some points of view, keeping a theme as close to the presentation is a much better. However, if the functionality you are working on does not provide visual enhancement or fronted display it probably belongs in a plugin. Having limited theme functionality will allow users to mdify the appearance of their site, without the need of missing a substantial element of functionality. In fact, you can utilize a plugin which is already integrated with the theme. Another suggestion for this kind of theme is to insert styles for the plugin functionality in the theme. Moreover, it potentially reduces the number of http requests, which causes a better site performance.

2. Compose Procedural Code

Mostly WordPress theme authors are more familiar with procedural programming than object oriented programming (OOP), since WordPress is written in a mostly procedural manner. But because WordPress is still in PHP 5.2 we tend to find ourselves either writing pseudo-OOP code or prefixing all our functions with something in order to prevent naming conflicts. However, the limitation of a version of PHP that has been unsupported over four years must not be an obstacle as we should attempt to drive our community forward and do not restrain ourselves.

The usage of PHP namespaces instead of pseudo-OOP code or prefixed functions is highly recommended if you want to build themes for clients directly and comprehend the environment the code will run in. To create a manageable and readable file, you can determine a namespace or sub-namespace in PHP. Since, each of these namespaces is a different scope, so there will be functions with the same name throughout your project. This will avoid you from conflicts or fatal errors in the site.

3. Enqueue Your Scripts and Styles

Below writing tags will be common for you, if you get used to HTML :

<pre><link rel=”stylesheet” type=”text/

css” href=”theme.css”></pre> or <pre> <scriptsrc=”myscripts.js”></script></pre>

Many online tutorials have misled this information which they said this was the right code, but this is actually a wrong example.

Moreover, there are two resemble functions that allow you to include style sheets and scripts to your theme:

wp_enqueue_style()

and

wp_enqueue_ script()

These two functions permit you to define dependencies.

(wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer)

The third argument is dependencies. For example, let’s say you are adding a slider script to your theme and this script requires jQuery to be loaded before it will work. Furthermore, you would have to pay close attention to the order in which you placed these files if you use the direct linking method. Using wp_enqueue_script() to include your slider script means you can pass a dependency of jQuery and WordPress will make sure jQuery is loaded on the page before your slider script. WordPress ships with a couple of dozen scripts that you can add using this method by simply calling the handle to enqueue, or passing the handle as a dependency of your script.

In order so you can determine load order of style sheets, the wp_enqueue_style() function comes with a dependency argument.

Another reason, why wp_enqueue_script is recommended is because the last parameter in the wp_enqueue_script() function referenced previously, which controls whether or not the script loads in the header or the footer of the site.

4. Use Template Parts

One of the most highly useful function of WordPress is called get_template_part() which we can apply in our templates to call bits of disposable and usually used code, as seen in the below example from a ‘page.php’ template:

<pre>
<?php if ( have_posts() ) : ?>
<main id=”content” class=”site-content” role=”main”><?php while ( have_posts() ): the_post(); get_template_part( ‘partials/content’,’page’ ); endwhile; ?></main>
<?php endif; ?> </pre>

Then the inside of ‘content-page.php’ will look like this:

<pre>
<article class=”entry”> <header class=”entry-header”><?php the_title( ‘<h2 class=”page-title”>’, ‘</h2>’ ); ?><?php if ( ! empty( $post->subtitle ) ) {?> <p class=”subtitle”><?php echo esc_html( $post->subtitle );?></p> <?php } ?></header>
<section class=”entry-content”><?php the_ content(); ?></section>
</article>
</pre>

By utilizing get_template_part(), someone can cover the whole snippet with just one line of code, and if you want to replace the markup or logic, you only need to reorganize it in one place. Above all of other points, those presented points are the most clean, and secure WordPress codebase. You can try them to make your WordPress theme looks perfect.