Breadcrumb Block
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 – This plugin turns the Block Editor into a powerful page builder by allowing you to create blocks, variations, and patterns directly in the Block Editor without needing a code editor. Meta Field Block – A block to display custom fields as blocks on the front end. It supports custom fields for posts, terms, users, and setting fields. It can also be used in the Query Loop block. 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.
Top keywords
- block20×3.50%
- item13×2.28%
- args9×1.58%
- context9×1.58%
- add8×1.40%
- page7×1.23%
- separator7×1.23%
- id6×1.05%
- return6×1.05%
- 'breadcrumb5×0.88%
- 'breadcrumb block5×0.88%
- blocks5×0.88%
Page scroll to id
Page scroll to id is a fully featured plugin which replaces browser’s “jumping” behavior with a smooth scrolling animation, when links with href value containing # are clicked. It provides all the basic tools and advanced functionality for single-page websites, in-page navigation, back-to-top links etc. with features like: Adjustable scrolling animation duration and easing (over 30 easing types) Link and target highlighting via ready-to-use CSS classes Vertical and/or horizontal scrolling Scrolling from/to different pages (scrolling to target id on page load) Offset scrolling by pixels or element selector with custom expressions Insert link and target id buttons in post visual editor Link-specific offset, scrolling duration, highlight target etc. Demo (default animation duration/easing, link highlighting etc.) Plugin resources, links and tutorials Plugin homepage Knowledge Base – FAQ Basic tutorial – Video tutorial Using Page scroll to id with the Divi Builder plugin Using Page scroll to id with SiteOrigin Page Builder Using Page scroll to id with WPBakery Page Builder Using Page scroll to id with Elementor Page Builder Support Requirements Page scroll to id requires WordPress version 3.3 or higher (jQuery version 1.7.0 or higher) and your theme must (and should) have wp_head() and wp_footer() functions. In some Microsoft Windows based web servers some plugins might produce an error 500 (depends on server/PHP configuration). To pinpoint the issue enable debugging in wp-config.php and check wp-content/debug.log file for relevant errors. GDPR (General Data Protection Regulation) The plugin is GDPR compliant. It does not use or store any kind of user information/data. In fact, it’s functionality has nothing to do with user data (personal or otherwise). So there’s that. Quick usage and tips Install the plugin. The plugin is enabled by default on your WordPress Menu links, so you can start adding custom links and set their URL to the id/target you want to scroll to. Create id targets within your content using plugin’s “Insert Page scroll to id target” button and/or shortcode (see contextual “Help” menu in plugin settings page) in post visual/text editor. Create targets in widgets areas using “Page scroll to id target” widget. Create links within your content using plugin’s “Insert/edit Page scroll to id link” button and/or shortcode in post visual/text editor. You can also add the class ps2id on any existing link you want to be handled by the plugin. For more info see plugin’s basic tutorial License MIT You should have received a copy of the MIT License along with this program. If not, see http://opensource.org/licenses/MIT. Donate If you like this plugin and find it useful, consider making a donation :). Plugin previous/other versions All plugin versions Other/external resources How to create anchor links on WordPress Gutenberg editor Using Page scroll to id with the Divi Builder plugin One Page WordPress Smooth Scrolling Menu – How to Use Page Scroll to ID Plugin 2017 Smooth scrolling between page sections using Page scroll to id Video tutorial: How to create a single page WordPress website GeneratePress – Elementor – Page Scroll to ID – One Page Website Onepage WordPress – Page scroll to iD plugin