README

eighteen73使用的块集合。

块列表

手风琴

一个可访问的手风琴，支持多个打开项，最初打开第一个项，并支持FAQs模式。

属性

• openMultiple
• startOpen
• level
• hasSchema

轮播

一个由 Splide 驱动的轮播，支持innerBlocks。

默认情况下，它使用一个 pulsar/carousel-slide 内部块。然而，可以通过使用变体和自定义子块来扩展这个块作为任何类型轮播块的基础。

属性

• carouselOptions
• advancedCarouselOptions
• mergeOptions
• ariaLabel
• hasTrack
• template
• templateLock
• allowedBlocks

扩展轮播块

轮播应该足够强大和灵活，可以通过变体进行扩展。

以下是一个简短的示例步骤

1. 注册一个变体

假设我们想要创建一个显示最新文章的轮播。这里的重要部分是我们将 hasTrack 设置为 false（这样我们就可以在子块中包裹文章），以及 template 和 templateLock。

import domReady from '@wordpress/dom-ready';
import { registerBlockVariation } from '@wordpress/blocks';

domReady(() => {
	registerBlockVariation('pulsar/carousel', {
		name: 'carousel-posts',
		title: 'Posts Carousel',
		attributes: {
			templateLock: 'all',
			hasTrack: false,
			template: [['pulsar/posts', {}]],
		},
		isActive: ['template'],
	});
});

2. 创建一个用作模板的子块

// Barebones example of the pulsar/posts child block edit function.
// Markup must include `splide__track` and `splide__list`.

import { useBlockProps } from '@wordpress/block-editor';

/**
 * The edit function describes the structure of your block in the context of the
 * editor. This represents what the editor will render when the block is used.
 *
 * @return {WPElement} Element to render.
 */
export default function Edit() {
	const blockProps = useBlockProps({ className: 'splide__track' });

	return (
		<div {...blockProps}>
			<ul className="splide__list">
				// Your block content here
			</ul>
		</div>
	);
}

过滤器

轮播

pulsar_blocks\carousel\force_carousel

如果轮播的幻灯片总数等于或小于每页幻灯片数，轮播将包含逻辑以禁用轮播功能。如果您想启用/禁用此行为，请使用此过滤器。

示例

add_filter( 'pulsar_blocks\carousel\force_carousel', '__return_true' );