內容簡介
Breadcrumb Block 是一個簡單輕量的麵包屑導航外掛，具備 SEO 友好性及 WooCommerce 相容性，並可在頁面編輯器、網站編輯器及模板檔案中使用，方便用戶自訂麵包屑顯示。
【主要功能】
• 提供簡單的麵包屑導航功能
• 支援自訂分隔符號圖示
• 可在多種編輯環境中使用
• 允許修改麵包屑項目
• 支援在單篇文章前添加部落格頁面
外掛標籤
開發者團隊
📦 歷史版本下載
原文外掛簡介
This is a single-block plugin for the breadcrumb trail. It’s simple, lightweight, SEO-friendly, and WooCommerce compatibility. It also includes some simple separator icons. It works everywhere: Page Editor, Site Editor, and template files.
How to customize the breadcrumb
How to change/remove an item?
add_filter( 'breadcrumb_block_get_item', function ( $item_args, $context, $breadcrumbs_instance ) {
// Ignore items without context.
if ( ! $context || ! ( $context['object'] ?? false ) ) {
return $item_args;
}
// Eg: remove a term.
if ( 'term' === ( $context['type'] ?? '' ) && 'term-slug' === $context['object']->slug ) {
return false;
}
// Eg: Change the title of a page.
if ( 'page' === ( $context['type'] ?? '' ) && page_id_to_change === $context['object']->ID ) {
$item_args[0] = 'Make it shorter';
}
return $item_args;
}, 10, 3 );
$item_args is a 3-item array: [$item_label, $item_link, $item_attrs]
$context is an associative array: ['type' => 'item type', 'object' => 'item object']. type can be one of the following values: front_page, home, shop, page, post, single, term, taxonomy, post_type_archive, search, 404, paged, author, date_year, date_month, date_day, attachment.
How to change the markup of the block?
add_filter( 'breadcrumb_block_get_breadcrumb_trail', function ( $markup, $args, $breadcrumbs_instance ) {
return $markup;
}, 10, 3 );
How to add or remove the items from the breadcrumb trail?
add_filter( 'breadcrumb_block_get_items', function ( $items, $breadcrumbs_instance ) {
return $items;
}, 10, 2 );
How to use a custom separator for the breadcrumb trail?
add_filter( 'breadcrumb_block_get_args', function ( $args ) {
// For example, change separator.
$args['separator'] = '';
return $args;
} );
The custom separator should be an inline SVG. To make sure it displays properly, it should have three attributes: width, height, and fill. The values of these attributes should be as follows: fill="currentColor" width="1em" height="1em".
Using this hook, you can customize other attributes such as container, before, after, list_tag, item_tag, item_before, item_after, separator.
How to prepend the blog page to all single posts?
add_action( 'breadcrumb_block_single_prepend', function ( $post, $breadcrumbs_instance ) {
if ( 'post' === $post->post_type ) {
$blog_id = get_option( 'page_for_posts');
if ( $blog_id ) {
$breadcrumbs_instance->add_item( get_the_title( $blog_id ), get_permalink( $blog_id ) );
}
}
}, 10, 2 );
If this plugin is useful for you, please do a quick review and rate it on WordPress.org to help us spread the word. I would very much appreciate it.
Please check out my other plugins if you’re interested:
Content Blocks Builder – Build custom layouts and blocks visually in the Block Editor without needing a code editor, using only core blocks and native Gutenberg features.
Meta Field Block – A single block to display custom fields in the Block Editor without coding. It supports ACF, MetaBox, WooCommerce, meta, rest field, shortcode and more. Works everywhere: in the Site Editor (FSE), the Block Editor, inside Query Loop, WooCommerce Product Collection, Term Query blocks, and even in template files.
SVG Block – A block to display SVG images as blocks. Useful for images, icons, dividers, and buttons. It allows you to upload SVG images and load them into the icon library.
Icon separator – A tiny block just like the core/separator block but with the ability to add an icon.
Block Enhancements – Adds practical features to blocks like icons, box shadows, transforms, etc.
Counting Number Block – A block to display numbers with a counting effect
Better YouTube Embed Block – A block to solve the performance issue with embedded YouTube videos. It can also embed multiple videos and playlists.
The plugin is developed using @wordpress/create-block.
