{"type":"PARAGRAPH"

In today's article we will create an important template file in our WordPress theme which is the single.php file which is mainly used to display and format all the individual posts or articles published on your WordPress site. Through this general file, you can flexibly customize the page of any post, and you can also create more customized files to have more control over the way specific posts are displayed on your site. For example, you can customize the way articles that belong to a specific category or that were written by specific authors are displayed differently from the rest of the articles, or display custom post types (CustomPosts) differently, and many other options.

Follow the paragraphs of this article and learn the detailed steps on how to customize this template, and the great flexibility it provides you to customize the display of your website articles. Article Contents How to Create Custom Single Post Templates in WordPress. Create a single.php file and add article data to it.

Add social sharing icons below the article Create a style.css file for article formatting Conclusion How to Create Custom Single Post Templates in WordPress. We have explained in previous lessons in the WordPress template development series that any WordPress theme essentially needs the main template file index.php to display the site’s pages, and the style.css file that controls the appearance of these pages. We indicated that the template developer can optionally add many template files for further customization.

As the template template files follow a specific hierarchy through which we ensure that any article or page that we review on your site has a dedicated template file suitable for it within this hierarchy and is used before other template files provided by your template. If there is no file specifically dedicated to displaying the desired page, we move to the file located at a higher level in the hierarchy (a more general file) and so on until we finally reach the basic template file for the index.php template. In today’s article, we will complete the template that we started developing in the last two lessons (Practical Application 1 for building a WordPress template and Practical Application 2 for building a WordPress template) and we will work on creating a new template file in our template, which is the single post template file single.php, in order to take care of displaying the site’s articles according to the required design.

Clarification: The word “posts” in WordPress includes several types, including default post types in WordPress, or custom post types. As for the single.php file, it specializes, as we mentioned, in displaying single pages for all types of default or custom posts, with the exception of static pages. The latter has a custom template file known as page.html, which we will create and customize in later lessons in the series. Read more: The difference between Pages and Posts in WordPress For today’s lesson, we will be concerned with creating the single.php file only in order to customize all of our individual site articles. You can of course create whatever you want from more specific template files for your site’s articles or posts in case you need more customization in the way these posts are displayed, as shown in the following image. The hierarchy of calling single post template files as shown in the image above is that the file named single- {post-type} .php is used to customize the display of a post that has a specific type. For example, if you have a blog post type (post), WordPress will search for the file single-post.php to display the article, and if you have a custom post of product type (product), WordPress will search for a custom file named single-product.php to display it, and so on..

If WordPress does not find a file dedicated to the specific post type within the template folder, it will then search for the presence of a file named single.php to display posts of any type. If it does not find it, it will search for the presence of the backup file singular.php and use it. If it does not find it, it will return, as we mentioned, to the main file index.php in the end and rely on it to display the post. Most theme developers, when developing their custom themes, rely on creating only the single.php template file in their templates to make them as simple as possible. This file is specific enough to display single posts and there is no need to create more customized files. In the following paragraphs we will start by creating the single.php template folder, and we will rely on it to format all the individual posts or articles on our site.

When we click on the title of any article on the home page or one of the other pages of the site and move to the page of this article, we want a page to appear that includes the elements of the article according to the following structural chart: The wireframe for the site’s single article page. Create a single.php file and add the article data to it. We have to first create a new file named single.php in our template folder (located in the directory in the wp-content directory < themes ضمن المجلد الجذر لموقعنا) ونضيف الكود اللازم لعرض البيانات المطلوبة في صفحة المقال المفرد. بداية نستدعي في ملف التمبلت كل من هيدر وفوتر الموقع اللذان أنشأناهما في الدرس السابق من خلال الدالتين get_header() و get_footer() وبينها نكتب وسم

To display the page content within it later, the code is as follows: Then, within the tag, we need to write a WordPress loop that initially extracts, as shown in the proposed wireframe design, the title of the article, then some metadata for the article (such as the categories of the article being displayed, the name of the writer, and the date of publication).

Then we display the featured image for each article, and here we will also use a default image if the writer has not uploaded a featured image for this article. Finally, we display the actual content of the article by calling the the_content() function. This function fetches all the HTML code that results from editing the article, whether through the default Gutenberg editor or other page building tools (it fetches all the text, images, video clips, and other elements that you added to the article through the editor, and places them in the desired position in the template file).