WordPress creates content blocks like CMS

First, let's look at the effect chart we want to implement:

This function only needs to use the WP_Query class built in WodPress to call the articles of the specified category, which is easy to implement. The following uses a specific example to explain how to create a CMS topic block.

1. Create an HTML page

This article will not explain how to create an html page. For details about how to create a column block for html and css, please learn how to make it yourself. Suppose that your topic block is similar to the following html code:

<Div class = "box">
<! -- Category name and link -->
<H3>
<Strong> <a href = "http: // historical category link/"> History </a> </strong>
<Em> <a href = "http: // historical category link/"> More </a> </em>
</H3>

<! -- Article list -->
<Ul class = "iconBoxT14">
<Li> <a href = "http: // Link to article 1"> Article 1 title </a> </li>
<Li> <a href = "http: // Link to article 2"> Article 2 title </a> </li>
<Li> <a href = "http: // Article 3"> Article 3 title </a> </li>
<Li> <a href = "http: // Article 4"> Article 4 title </a> </li>
</Ul>
</Div>

2. Obtain the category link

For classification links, we can use static URLs or dynamic retrieval methods. The static method is to directly change the http: // historical category link/to your category link. There are many ways to dynamically obtain a category link, which can be obtained by Category id, by category alias, or by category name. Here we will introduce how to obtain the category link by category name. Code:

<? Php
$ Catid = get_cat_ID ('historical '); // The historical value is the category name.
Echo get_category_link ($ catid); // output category link
?>

Use the above php code to replace http: // Historical classification link/in html. The code looks like this:

<Strong> <a href = "<? Php echo get_category_link (get_cat_ID ('hire');?> "> History </a> </strong>
<Em> <a href = "<? Php echo get_category_link (get_cat_ID ('hire');?> "> More </a> </em>

3. Retrieve the list of classified articles

We need to dynamically obtain the specified number of articles under this category, and then dynamically output them to the ul list of html. Here we need to use the WP_Query class. WP_Query has many parameters, only two simple parameters are described here. For other parameters, see the document or search for them online.

Modify the html as follows and add the WP_Query call code:

<Ul class = "iconBoxT14">
<? Php
// Pass the call parameters
$ The_query = new WP_Query (
Array (
'Category _ name' => 'historical ', // category name
'Posts _ per_page '=> 10 // maximum number of displayed articles
));

If ($ the_query-> have_posts ()){
While ($ the_query-> have_posts ()){
$ The_query-> the_post ();
           
// Get_permalink () is the link to get the article
// Get_the_title () is used to obtain the title of an article.
Echo '<li> <a href = "'. get_permalink (). '">'. get_the_title (). '</a> </li> ';
         }
      }
Else {
Echo '<li> <a href = "#"> no articles for this category </a> </li> ';
      }

// Reset all WP_Query ends.
// Avoid affecting other codes
Wp_reset_postdata ();
?>
</Ul>

4. Limit the number of words in the document title

The title of an article may be too long and beyond the range of the topic. We can limit the number of words in the title of an article... Replace get_the_title () in Point 3rd with the following code:

Mb_strimwidth (get_the_title (), 0, 28 ,'...')

A Chinese character is 2 characters, and the above 28 represents a maximum of 14 Chinese characters, exceeding the limit... . Optional length.
Complete Code

The following is the complete code after the above modification. The following code applies to multiple classification blocks:

<Div class = "box">
<! -- Category name and link -->
<H3>
<Strong> <a href = "<? Php echo get_category_link (get_cat_ID ('hire');?> "> History </a> </strong>
<Em> <a href = "<? Php echo get_category_link (get_cat_ID ('hire');?> "> More </a> </em>
</H3>

<! -- Article list -->
<Ul class = "iconBoxT14">
<? Php
// Pass the call parameters
$ The_query = new WP_Query (
Array (
'Category _ name' => 'historical ', // category name
'Posts _ per_page '=> 10 // maximum number of displayed articles
));

If ($ the_query-> have_posts ()){
While ($ the_query-> have_posts ()){
$ The_query-> the_post ();
           
// Get_permalink () is the link to get the article
// Get_the_title () is used to obtain the title of an article.
Echo '<li> <a href = "'. get_permalink (). '"> '. mb_strimwidth (get_the_title (), 0, 28 ,'... '). '</a> </li> ';
         }
      }
Else {
Echo '<li> <a href = "#"> no articles for this category </a> </li> ';
      }

// Reset all WP_Query ends.
// Avoid affecting other codes
Wp_reset_postdata ();
?>
</Ul>
</Div>

Now, we can also use wordpress to create websites that are used by Chinese netizens.