Cara membangunkan pemalam WordPress yang menjana jadual kandungan secara automatik
Apabila catatan blog menjadi semakin kaya dengan kandungan, menambah baik pengalaman membaca telah menjadi pertimbangan penting. Menjana jadual kandungan secara automatik ialah kaedah biasa untuk meningkatkan pengalaman membaca. Bangunkan pemalam yang menjana jadual kandungan secara automatik pada platform WordPress untuk membantu pembaca menyemak imbas dan menavigasi kandungan artikel dengan cepat. Artikel ini akan memperkenalkan cara membangunkan pemalam WordPress yang menjana jadual kandungan secara automatik, dan menyediakan contoh kod yang berkaitan untuk rujukan.
Pertama, kita perlu mendaftarkan widget baharu (Widget) dalam plugin WordPress untuk memaparkan jadual kandungan dalam artikel. Berikut ialah contoh pendaftaran ringkas widget direktori:
class AutoTOC_Widget extends WP_Widget { public function __construct() { parent::__construct( 'auto_toc_widget', '自动生成目录', array( 'description' => '在文章中自动生成目录' ) ); } public function widget( $args, $instance ) { // 在文章中显示自动生成的目录 } public function form( $instance ) { // 小部件设置表单 } public function update( $new_instance, $old_instance ) { // 更新小部件设置 } }
Seterusnya, kita perlu menulis kod dalam kaedah widget()
widget untuk melaksanakan logik penjanaan direktori. Pertama, kita perlu mendapatkan kandungan artikel dan menggunakan ungkapan biasa untuk memadankan semua elemen tajuk. Berikut ialah contoh kod: widget()
方法中编写代码来实现目录生成的逻辑。首先,我们需要获取文章的内容,并使用正则表达式来匹配所有标题元素。以下是一个示例的代码:
public function widget( $args, $instance ) { global $post; $post_id = $post->ID; $post_content = $post->post_content; // 正则表达式匹配所有标题元素 preg_match_all( '/<h([1-6])>(.*?)</h>/', $post_content, $matches, PREG_SET_ORDER ); $toc_items = array(); // 构建目录项数组 foreach ( $matches as $match ) { $toc_item = array( 'title' => $match[2], 'level' => $match[1], 'anchor' => sanitize_title( $match[2] ) ); $toc_items[] = $toc_item; } // 显示目录部件的HTML输出 }
在上述代码中,我们使用了preg_match_all()
函数来匹配文章内容中的标题元素,并将匹配结果存储在$matches
数组中。然后,我们遍历$matches
数组,构建一个目录项数组$toc_items
,其中包含标题的文本、级别和锚点。
最后,我们需要在目录小部件的widget()
方法中生成HTML输出并显示在文章中。以下是一个示例的代码:
public function widget( $args, $instance ) { global $post; $post_id = $post->ID; // 生成目录HTML输出 $output = '<div class="auto-toc">'; $output .= '<h2 class="widget-title">' . $instance['title'] . '</h2>'; $output .= '<ul>'; foreach ( $toc_items as $item ) { $output .= '<li><a href="#' . $item['anchor'] . '">' . $item['title'] . '</a></li>'; } $output .= '</ul>'; $output .= '</div>'; echo $output; }
在上述代码中,我们使用了一个foreach
循环来遍历目录项数组$toc_items
,生成目录的HTML输出。每个目录项都被包装在一个列表项的<li>
标签中,并包含一个锚点链接,使读者能够通过点击在文章中导航到相应的标题处。
最后,我们还可以通过在小部件的form()
方法中添加一些设置选项,让用户能够自定义目录显示的标题。以下是一个简单的示例代码:
public function form( $instance ) { $title = isset( $instance['title'] ) ? $instance['title'] : '目录'; echo '<p>'; echo '<label for="' . $this->get_field_id( 'title' ) . '">标题:</label>'; echo '<input class="widefat" id="' . $this->get_field_id( 'title' ) . '" name="' . $this->get_field_name( 'title' ) . '" type="text" value="' . esc_attr( $title ) . '">'; echo '</p>'; }
在上述代码中,我们使用了一个input
表单元素,允许用户输入自定义的目录标题。该值将被保存在插件的设置中,并在小部件的widget()
rrreee
preg_match_all()
untuk memadankan elemen tajuk dalam kandungan artikel dan menyimpan hasil yang sepadan dalam $matches
dalam tatasusunan. Kami kemudian melelang melalui tatasusunan $matches
dan membina tatasusunan item jadual kandungan $toc_items
yang mengandungi teks, tahap dan sauh tajuk. Akhir sekali, kita perlu menjana output HTML dalam kaedah widget()
widget jadual kandungan dan memaparkannya dalam artikel. Berikut ialah kod untuk contoh: 🎜rrreee🎜Dalam kod di atas, kami menggunakan gelung foreach
untuk mengulangi tatasusunan item katalog $toc_items
dan menjana output HTML daripada katalog itu. Setiap item jadual kandungan dibalut dalam teg <li>
item senarai dan mengandungi pautan utama yang membolehkan pembaca mengklik untuk menavigasi dalam artikel ke tajuk yang sepadan. 🎜🎜Akhir sekali, kami juga boleh menambah beberapa pilihan tetapan dalam kaedah form()
widget untuk membolehkan pengguna menyesuaikan tajuk yang dipaparkan dalam direktori. Berikut ialah kod contoh mudah: 🎜rrreee🎜 Dalam kod di atas, kami menggunakan elemen borang input
untuk membolehkan pengguna memasukkan tajuk direktori tersuai. Nilai ini akan disimpan dalam tetapan pemalam dan digunakan dalam kaedah widget()
widget. 🎜🎜Melalui contoh kod di atas, kami boleh membangunkan pemalam yang secara automatik menjana jadual kandungan berdasarkan platform WordPress untuk membantu meningkatkan pengalaman membaca artikel blog. Pembaca boleh menyemak imbas dan menavigasi kandungan artikel dengan cepat dengan mengklik pada pautan dalam jadual kandungan. Membangunkan pemalam WordPress anda sendiri boleh dikembangkan dan disesuaikan mengikut keperluan sebenar, membawa pengalaman pengguna yang lebih baik kepada pembaca. 🎜Atas ialah kandungan terperinci Bagaimana untuk membangunkan pemalam WordPress yang menjana jadual kandungan secara automatik. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!