Composer library for generating ACF Gutenberg blocks from templates.
Branch: master
Clone or download
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.gitignore Initial commit Feb 6, 2019
README.md Update README.md Feb 8, 2019
composer.json Initial commit Feb 6, 2019
composer.lock Initial commit Feb 6, 2019
sage-acf-gutenberg-blocks.php Update sage-acf-gutenberg-blocks.php Feb 15, 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: 
--}}

Example block template

{{--
  Title: Testimonial
  Description: Customer testimonial
  Category: formatting
  Icon: admin-comments
  Keywords: testimonial quote
--}}

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