Rumah > Tutorial CMS > WordTekan > teks badan

Artikel yang menerangkan secara terperinci cara membuat blok lajur CMS dalam WordPress

藏色散人
Lepaskan: 2023-03-01 20:18:13
ke hadapan
1615 orang telah melayarinya

Artikel ini membawakan anda pengetahuan yang berkaitan tentang WordPress terutamanya tentang cara WordPress membuat blok lajur CMS Rakan-rakan yang berminat boleh melihat di bawah.

WordPress mencipta blok lajur CMS

Sesetengah netizen bertanya: Bagaimana hendak menulis senarai berasingan untuk setiap lajur di halaman utama (serupa dengan cms biasa)? Serupa dengan kesan berikut:

Artikel yang menerangkan secara terperinci cara membuat blok lajur CMS dalam WordPress

Malah, fungsi ini agak mudah untuk dilaksanakan Anda hanya perlu menggunakan kelas WP_Query terbina dalam WodPress untuk memanggil artikel kategori yang ditentukan Contoh khusus digunakan di bawah. Mari jelaskan cara membuat blok lajur CMS.

1. Membuat halaman HTML

Artikel ini tidak akan menerangkan cara membuat halaman HTML Sila pelajari cara membuat blok lajur menggunakan HTML dan CSS sendiri . Diandaikan di sini bahawa blok lajur anda ialah kod html yang serupa dengan yang berikut:

<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>
Salin selepas log masuk

2. Dapatkan pautan kategori

Kami boleh menggunakan URL statik untuk kategori pautan, atau kita boleh Gunakan kaedah pemerolehan dinamik. Kaedah statik adalah untuk menukar terus http://pautan kategori sejarah/ di atas kepada pautan kategori anda. Terdapat banyak cara untuk mendapatkan pautan kategori secara dinamik Ia boleh diperolehi mengikut id kategori, nama kategori atau nama kategori. Berikut ialah pengenalan untuk mendapatkan pautan kategori melalui nama kategori:

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

Ganti http://pautan kategori sejarah/ dalam html dengan kod php di atas:

<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>
Salin selepas log masuk

3 Dapatkan senarai artikel terperingkat

Kita perlu mendapatkan secara dinamik bilangan artikel di bawah kategori ini, dan kemudian mengeluarkannya secara dinamik ke senarai ul html . WP_Query diperlukan di sini Kelas, WP_Query mempunyai banyak parameter, hanya dua yang mudah diperkenalkan di sini Untuk parameter lain, sila rujuk dokumentasi atau cari dalam talian.

Kami akan mengubah suai html seperti berikut dan menambah kod panggilan 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>
Salin selepas log masuk

4 Hadkan bilangan perkataan dalam tajuk artikel

Tajuk artikel mungkin sangat panjang , di luar skop blok lajur. Kami boleh mengehadkan bilangan perkataan dalam tajuk artikel dan menggunakan... jika melebihi bilangan, gantikan get_the_title() dalam titik 3 dengan kod berikut:

mb_strimwidth(get_the_title(), 0, 28, &#39;...&#39;)
Salin selepas log masuk

Aksara Cina ialah 2 aksara , seperti di atas 28 bermakna sehingga 14 aksara Cina boleh dipaparkan, dan lebihan itu digantikan dengan.... Panjang pilihan.

Kod lengkap

Berikut ialah kod lengkap selepas pengubahsuaian di atas, dan seterusnya untuk berbilang blok klasifikasi:

历史 更多

    '历史', // 分类名称 '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, &#39;...&#39;) .'
  • '; } } else { echo '
  • 该分类没有文章
  • '; } // WP_Query结束都要重置一下 // 以免影响其他代码 wp_reset_postdata(); ?>
Salin selepas log masuk

Pembelajaran yang disyorkan :《Tutorial WordPress

Atas ialah kandungan terperinci Artikel yang menerangkan secara terperinci cara membuat blok lajur CMS dalam WordPress. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:ludou.org
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan