一文詳解WordPress製作CMS欄位的方法

這篇文章為大家帶來了關於WordPress的相關知識，其中主要給大家聊聊WordPress是怎麼製作CMS欄目塊，有興趣的朋友下面一起來看一下吧，歡迎大家收藏學習！

WordPress製作CMS欄位區塊

有網友提問：首頁如果每個欄位都單獨成一個清單（類似常規的cms）怎麼寫啊？類似下面的效果：

其實這個功能還是比較容易實現的，只需用WodPress內建的WP_Query 類別呼叫指定分類的文章即可，下面用一個具體實例來講解如何製作CMS欄位。

1、製作HTML頁面

本文就不講解html頁面的製作了，具體的html、css如何製作一個欄位，請自行學習製作。這裡假設你的欄位區塊是類似以下的html程式碼：

<div class="box">
   <!-- 分类名称及链接 -->
   <h3>
      <strong><a href="http://历史分类链接/">历史</a></strong>
      <em><a href="http://历史分类链接/">更多</a></em>
   </h3>

   <!-- 文章列表 -->
   <ul class="iconBoxT14">
      <li><a href="http://文章1链接">文章1标题</a></li>
      <li><a href="http://文章2链接">文章2标题</a></li>
      <li><a href="http://文章3链接">文章3标题</a></li>
      <li><a href="http://文章4链接">文章4标题</a></li>
   </ul>
</div>

2、取得分類連結

分類連結我們可以用靜態的網址，也可以用動態的獲取的方式。靜態方式就是直接將上面的http://歷史分類連結/改成你的分類連結。動態獲取分類連結有很多方式，可以透過分類id來獲取，可以透過分類別名來獲取，也可以透過分類名稱來獲取。這裡介紹透過分類名稱來獲取分類鏈接，代碼：

<?php
  $catid = get_cat_ID(&#39;历史&#39;); // 历史是分类名称
  echo get_category_link($catid); // 输出分类链接
?>

用上面的php代碼替換html中的http://歷史分類鏈接/，代碼看起來是這樣：

<strong><a href="<?php echo get_category_link(get_cat_ID(&#39;历史&#39;)); ?>">历史</a></strong>
<em><a href="<?php echo get_category_link(get_cat_ID(&#39;历史&#39;)); ?>">更多</a></em>

3、取得分類文章清單

我們需要動態取得該分類下的指定數量的文章，然後動態輸出到html的ul清單中，這裡需要用到WP_Query 類，WP_Query有很多參數，這裡只介紹2個簡單的，其他參數請參考文件或上網搜尋。

我們將html做如下修改，加入WP_Query呼叫程式碼：

<ul class="iconBoxT14">
   <?php
      // 传递调用参数
      $the_query = new WP_Query( 
                  array(
                      &#39;category_name&#39; => &#39;历史&#39;,  // 分类名称
                      &#39;posts_per_page&#39; => 10     // 最多显示的文章数
                  ) ); 
      if ( $the_query->have_posts() ) {
         while ( $the_query->have_posts() ) {
            $the_query->the_post();
            
            // get_permalink()是获取文章链接
            // get_the_title()是获取文章标题
            echo &#39;<li><a href="&#39; . get_permalink() .&#39;">&#39; . get_the_title() .&#39;</a></li>&#39;;
         }
      }
      else {
         echo &#39;<li><a href="#">该分类没有文章</a></li>&#39;;
      }
      // WP_Query结束都要重置一下
      // 以免影响其他代码
      wp_reset_postdata();
?>
</ul>

#4、限製文章標題字數

可能文章標題很長，超出了欄位塊的範圍。我們可以限制一下文章標題的字數，超出的用...代替，將第3點中的get_the_title()替換成以下代碼即可：

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

一個漢字是2個字符，上面的28代表最多顯示14個漢字，超出的用...代替。長度自選。

完整程式碼

以下是透過上述修改後的完整程式碼，多個分類區塊就依此類推：

   
   

      历史
      更多
   
   
   

    '历史',  // 分类名称
                      'posts_per_page' => 10      // 最多显示的文章数
                  ) ); 
      if ( $the_query->have_posts() ) {
         while ( $the_query->have_posts() ) {
            $the_query->the_post();
            
            // get_permalink()是获取文章链接
            // get_the_title()是获取文章标题
            echo '
' . mb_strimwidth(get_the_title(), 0, 28, '...') .'
';
         }
      }
      else {
         echo '
该分类没有文章
';
      }
      // WP_Query结束都要重置一下
      // 以免影响其他代码
      wp_reset_postdata();
   ?>
   

推薦學習：《 WordPress教學》

以上是一文詳解WordPress製作CMS欄位的方法的詳細內容。更多資訊請關注PHP中文網其他相關文章！