log1x / acf-blocks

此包已被废弃且不再维护。未建议替代包。

ACF Blocks 是一个用于 Sage 10 的小型包,可以帮助您轻松创建带有高级自定义字段的 Gutenberg Blocks。

dev-master 2019-09-21 02:37 UTC

This package is auto-updated.

Last update: 2020-03-21 04:01:12 UTC


README

ACF Blocks 是一个用于 Sage 10 的小型包,可以帮助您轻松创建带有高级自定义字段的 Gutenberg Blocks。

废弃:使用 acf-composer

安装

$ composer require log1x/blocks

App\Blocks\BlockServiceProvider::class 添加到 config/app.php 中的 providers 数组。

使用方法

  • 创建一个目录来存储您的 Blocks。
app/Blocks
└── Example # Your Block
    ├── Example.php # Where you register your block, fields, and data passed to it's view.
    └── views
        ├── example.blade.php # Block view
        ├── example.css       # Block CSS file (optional)
        └── example.js        # Block JS file (optional)
  • 注册您的 Block,附加其字段,并提供视图数据(类似于 Sage 10 的 Composers)。
# Blocks/Example/Example.php
<?php

namespace App\Blocks\Example;

use App\Blocks\Block;
use StoutLogic\AcfBuilder\FieldsBuilder;

class Example extends Block {
    /**
     * Data to be passed to the block before registering.
     * @see https://www.advancedcustomfields.com/resources/acf_register_block_type/
     *
     * @return array
     */
    public function register()
    {
        return [
            'name' => 'Example',
            'description' => 'Lorem ipsum',
            'category' => 'formatting',
        ];
    }

    /**
     * Fields to be attached to the block.
     *
     * @return array
     */
    public function fields()
    {
        $example = new FieldsBuilder('example');

        $example
            ->setLocation('block', '==', 'acf/example');

        $example
            ->addText('label')
            ->addTextarea('description')
            ->addRepeater('items')
                ->addText('item')
            ->endRepeater();

        return $example->build();
    }

    /**
     * Data to be passed to the rendered block.
     *
     * @return array
     */
    public function with()
    {
        return [
            'label' => $this->label(),
            'description' => $this->description(),
            'items' => $this->items(),
        ];
    }

    /**
     * Returns the label field.
     *
     * @return string
     */
    public function label()
    {
        return get_field('label');
    }

    /**
     * Returns the description field.
     *
     * @return string
     */
    public function description()
    {
        return get_field('description');
    }

    /**
     * Returns the items field.
     *
     * @return array
     */
    public function items()
    {
        return get_field('items') ?? [];
    }
}
  • 创建您的 Block 视图。
# Blocks/Example/views/example.blade.php
<div class="bg-blue-600 text-white p-4 mb-4">
  <h2 class="text-3xl mb-2">{{ $label }}</h2>
  <p>{{ $description }}</p>
  @if ($items)
    <ul>
      @foreach ($items as $item)
        <li>{{ $item['item'] }}</li>
      @endforeach
    </ul>
  @endif
</div>
  • config/blocks.php 中加载您的 Block。
'blocks' => [
    App\Blocks\Example\Example::class,
],

就是这样!

如果您的 Block 的 views 文件夹中存在 CSS 或 JS 文件,它们将自动与您的块一起在前端和后端排队。

许可

ACF Blocks 在MIT 许可证下提供。