jmccole83
8/16/2019 - 2:33 PM

Custom Blocks

ACF Pro must be at least version 5.8.0 before using.

Add the file custom-blocks.php to the app directory, include the file in functions.php. Add new blocks to their own sub-directory in the views directory.

<?php

namespace App;


add_filter( 'block_categories', function( $categories, $post ) {
    /*if ( $post->post_type !== 'post' ) {
        return $categories;
    }*/
    return array_merge(
        $categories,
        array(
            array(
                'slug'  => 'rp-client',
                'title' => __( 'Avacta', 'my-plugin' ),
            ),
        )
    );
}, 10, 2 );

// Check whether WordPress and ACF are available; bail if not.
if (! function_exists('acf_register_block')) {
    return;
}
if (! function_exists('add_filter')) {
    return;
}
if (! function_exists('add_action')) {
    return;
}

//wrap core blocks in container_class

add_filter( 'render_block', function( $block_content, $block ) {
    // Target core/* and core-embed/* blocks.
    if ( preg_match( '~^core/|core-embed/~', $block['blockName'] ) || $block['blockName'] == '' ) {
        $block_width = $block['attrs']['align'];

        if($block_width == 'full'){
            $block_content = sprintf( '<div>%s</div>', $block_content );
        }else{
            $arr_content_blocks = array('core/paragraph','core/heading','core/freeform');
            if ( in_array($block['blockName'], $arr_content_blocks) ) {
                $block_content = sprintf( '<div class="container-wide"><div class="row"><div class="col-12 col-sm-10">%s</div></div></div>', $block_content );
            }else{
                $block_content = sprintf( '<div class="container-wide">%s</div>', $block_content );
            }

        }

      //$block_content = var_dump($block);
    }
    return $block_content;
}, PHP_INT_MAX - 1, 2 );

function get_acf_post_id(){
    if (get_the_ID()) return get_the_ID();
    if (isset($_POST['post_id'])) return $_POST['post_id'];
    if (isset($_GET['page_id'])) return $_GET['page_id'];

    return false;
}

function get_column_size($percent, $parent = 100, $columns = 12, $height = 100){
  switch($columns){
    case 10 :

      switch($percent){
        case 100 :
          $css = 'col-sm-10';
          break;
        case 60 :
          $css = 'col-sm-6';
          break;
        case 50 :
          $css = 'col-sm-5';
          break;
        case 40 :
          $css = 'col-sm-4';
          break;
      }

      break;
    default :

      switch($percent){
        case 100 :
          $css = 'col-sm-12';
          break;
        case 67 :
          $css = 'col-sm-8';
          break;
        case 50 :
          $css = 'col-sm-6';
          break;
        case 33 :
          $css = 'col-sm-4';
          break;
      }

  }

  $column_heights =  explode('b',$height);
  $calc_height = 0;
  foreach($column_heights as $column_height){
    $calc_height += (int)$column_height;
  }

  if($height == 0){
    //$css .= ' '.$percent.'/'.$calc_height.'-'.$height.' v100';
    $css .= '';
  }elseif($calc_height <= 100){
    //$css .= ' '.$percent.'/'.$calc_height.'-'.$height.' v100';
    $css .= ' h-100';
  }elseif($calc_height <= 200){
    //$css .= ' '.$percent.'/'.$calc_height.'-'.$height.' v50';
    $css .= ' h-50';
  }

  return $css;
}


function my_acf_block_render_callback( $block ) {
  $slug = str_replace('acf/', '', $block['name']);
  $block['slug'] = $slug;
  $block['classes'] = implode(' ', [$block['slug'].'-block', $block['className'], 'align'.$block['align']]);
  echo \App\template("blocks/${slug}/${slug}", ['block' => $block]);
}

add_action('acf/init', function() {

    // Global $sage_error so we can throw errors in the typical sage manner
    global $sage_error;

    // Look into views/blocks
    $dir = new \RecursiveIteratorIterator(new \RecursiveDirectoryIterator(\locate_template("views/blocks/"),
    \FilesystemIterator::KEY_AS_PATHNAME | \FilesystemIterator::CURRENT_AS_SELF));
    // Loop through found blocks
    foreach ($dir as $fileinfo) {


      if (!$fileinfo->isDot()) {
        // Only use PHP files
        if($fileinfo->getExtension() == 'php') {

            $slug = removeBladeExtension($fileinfo->getFilename());
            $sub_path = $fileinfo->getSubPath();
            // Get infos from file
            $file_path = locate_template("views/blocks/$sub_path/${slug}.blade.php");
            $file_headers = get_file_data($file_path, [
              'title' => 'Title',
              'description' => 'Description',
              'category' => 'Category',
              'icon' => 'Icon',
              'keywords' => 'Keywords',
              'align' => 'Align',
              'mode' => 'Mode',
              'post_types' => 'PostTypes',
            ]);
            if( empty($file_headers['title']) ) {
              die( _e('This block needs a title: ' . $file_path));
            }
            if( empty($file_headers['category']) ) {
              die( _e('This block needs a category: ' . $file_path));
            }
            // Register a new block
            $datas = [
              'name' => $slug,
              'title' => $file_headers['title'],
              'description' => $file_headers['description'],
              'category' => $file_headers['category'],
              'icon' => $file_headers['icon'],
              'keywords' => explode(' ', $file_headers['keywords']),
              'align' => $file_headers['align'],
              'mode' => $file_headers['mode'],
              'supports' => array(
                  'background-color',
                  'align' => array( 'full', 'wide'),
              ),
              'render_callback'  => __NAMESPACE__.'\\my_acf_block_render_callback',

            ];

            // If the PostTypes header is set in the template, restrict this block to thsoe types
           if (!empty($file_headers['post_types'])) {
               $data['post_types'] = explode(' ', $file_headers['post_types']);
           }

            acf_register_block($datas);
        }
      }
    }

});

/**
 * Function to strip the `.blade.php` from a blade filename
 */
function removeBladeExtension($filename)
{
  // Remove the unwanted extensions
    $return = substr($filename, 0, strrpos($filename, '.blade.php'));
    // Always return
    return $return;
}
/**
 * Enable wide gutenblocks
 * @link https://wordpress.org/gutenberg/handbook/designers-developers/developers/themes/theme-support/
 */
add_theme_support( 'align-wide' );
/* Admin Styles */
add_action( 'admin_enqueue_scripts', function () {
    wp_register_style( 'custom_wp_admin_css', asset_path('styles/admin-style.css'), false, '1.0.0' );
    wp_enqueue_style( 'custom_wp_admin_css' );
    wp_enqueue_script('sage/admin-scripts.js', asset_path('scripts/admin-scripts.js'), ['jquery'], null, true);
});
.acf-fields > .acf-field.fake-seamless { padding: 0 !important; }
.acf-field.fake-seamless > .acf-label { margin: 0 !important; }
.acf-field.fake-seamless > .acf-label label { display: none; }
.fake-seamless .acf-clone-fields { border: none !important; }

.fake-seamless  .acf-clone-fields.acf-fields.-border { border: none !important; }

.fake-seamless{
  .acf-field-settings-dialog > .acf-label {
    display: block;
  }
}

.hide-label {
  .acf-label {
    display: none;
  }
}

.edit-post-sidebar {
  .acf-block-fields {
    div.acf-field {
      padding: 13px 16px;
    }
  }
}

.acf-fields.-left > .acf-field.fake-seamless > .acf-input    { padding: 0 !important;width:100% !important; }

body.mce-content-body {
  height: inherit !important;
}

body#tinymce {
    padding-top: 0px;
  height: auto !important;
  background-color: #fff;
}

p.lead {
    font-size: 1.7;
    font-weight: 600;
}

.acf-fields > .acf-tab-wrap {
  margin-bottom:1px;
}

.acf-repeater {
  .acf-row + .acf-row {
    > td {
      border-top-width:15px;
    }
  }
}

.acf-field-flexible-content.acf-field-5a6258cf74eaf {
  .button-primary {
    background: #e6e6e6;
    border-color: #848484;
    box-shadow: 1px 1px 0 #999;
    color: #848484;
    text-decoration: none;
    text-shadow: none;
  }
}

.acf_colour_radio {
  li {
    label {
      input {
        display:none;
      }

      i {
        border: 2px solid #f7f7f7;
      }

      &.selected {
        i {
          border: 2px solid red;
        }
      }
    }
  }
}


.container-outer {
  margin: 0 auto;

  .container-inner {
    max-width: 1070px;
  }
}

.container-wide {
  width: calc(100% - 140px);
  max-width: 1070px;
  padding-right: 15px;
$(document).ready(function(){

})
$(document).ready(function(){

})
@import "common/variables";

/** Import everything from autoload */
@import "./autoload/**/*";
/**
 * Import npm dependencies
 *
 * Prefix your imports with `~` to grab from node_modules/
 * @see https://github.com/webpack-contrib/sass-loader#imports
 */
// @import "~some-node-module";

/** Import theme styles */
@import "common/global";
@import "layouts/tinymce";
@import "../../views/blocks/**/scss/*";
"blocks": [
"./scripts/blocks.js",
"./styles/blocks.scss"
],
"admin-style": [
  "./styles/admin-styles.scss"
],
"admin-scripts": [
  "./scripts/admin-scripts.js"
],