Skip to content
Composer library for generating ACF Gutenberg blocks from templates.
Branch: master
Clone or download
MWDelaney Merge pull request #13 from palmiak/change_function_name
Changed acf_register_block to acf_register_block_type
Latest commit 229858c Jun 10, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.gitignore Initial commit Feb 6, 2019
README.md update readme: align, support(align, mode, multiple) May 16, 2019
composer.json Initial commit Feb 6, 2019
composer.lock Initial commit Feb 6, 2019
sage-acf-gutenberg-blocks.php Merge pull request #13 from palmiak/change_function_name Jun 10, 2019

README.md

Sage ACF Gutenberg Blocks

Generate ACF Gutenberg blocks just by adding templates to your Sage theme. This package is based heavily on this article by nicoprat.

Installation

Run the following in your Sage 9-based theme directory:

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

Creating blocks

Add blade templates to views/blocks which get and use ACF data. Each template requires a comment block with some data in it:

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

Example block template

{{--
  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
--}}

<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>

Creating ACF fields

Once a block is created you'll be able to assign ACF fields to it using the standard Custom Fields interface in WordPress. We recommend using sage-advanced-custom-fields to keep your ACF fields in version control with Sage.

You can’t perform that action at this time.