README

只需将模板添加到您的 Sage 主题中即可生成 ACF Gutenberg 块。此包在很大程度上基于这篇文章，作者是 nicoprat。

安装

在基于 Sage (v9 或 10) 的主题目录中运行以下命令

composer require "drifterdnl/sage-acf-gutenberg-blocks"

创建块

将 blade 模板添加到 views/blocks 中，这些模板获取并使用 ACF 数据。每个模板都需要一个包含一些数据的注释块

{{--
  Title:
  Description:
  Category:
  Icon:
  Keywords:
  Mode:
  Align:
  PostTypes:
  SupportsAlign:
  SupportsMode:
  SupportsMultiple:
  EnqueueStyle:
  EnqueueScript:
  EnqueueAssets:
--}}

示例块模板

{{--
  Title: Testimonial
  Description: Customer testimonial
  Category: formatting
  Icon: admin-comments
  Keywords: testimonial quote
  Mode: edit
  Align: left
  PostTypes: page post
  SupportsAlign: left right
  SupportsMode: false
  SupportsMultiple: false
  EnqueueStyle: styles/style.css
  EnqueueScript: scripts/script.js
  EnqueueAssets: path/to/asset
--}}

<blockquote data-{{ $block['id'] }} class="{{ $block['classes'] }}">
    <p>{{ get_field('testimonial') }}</p>
    <cite>
      <span>{{ get_field('author') }}</span>
    </cite>
</blockquote>

<style type="text/css">
  [data-{{$block['id']}}] {
    background: {{ get_field('background_color') }};
    color: {{ get_field('text_color') }};
  }
</style>

数据选项

文件头部的选项与 acf_register_block_type 函数中的选项相对应。

创建 ACF 字段

创建块后，您将能够使用 WordPress 中的标准自定义字段界面将 ACF 字段分配给它。我们建议使用 sage-advanced-custom-fields 来将您的 ACF 字段与 Sage 一起进行版本控制。

过滤块数据

可以通过 'sage/blocks/[block-name]/data' 过滤器更改块数据。例如，如果您的块模板名为 my-block.blade.php，您可以这样更改数据

add_filter('sage/blocks/my-block/data', function ($block) { // Do your thing here. });

过滤模板文件夹

默认情况下，所有在 views/blocks 中的模板文件都将被加载。如果您希望，可以使用模板过滤器添加更多文件夹。下面是一个示例，说明如何添加自己的文件夹。

add_filter('sage-acf-gutenberg-blocks-templates', function ($folders) { 
    $folders[] = 'views/your-folder'; // Adds your folder
    return $folders;
});

drifterdnl / sage-acf-gutenberg-blocks

维护者

详细信息