Home Forums ACF PRO $block param outputs differently in admin & frontend


$block param outputs differently in admin & frontend

  • Marry christmas everyone,
    I’m creating a custom block called “one-product”. The same javascript file (one-product.js) is loaded with each block:

    'enqueue_script' => get_stylesheet_directory_uri() . '/template-parts/blocks/one-product/one-product.js',

    This one-product.js file is loaded in the admin area and the front-end together with one-product.php. When I output $block in one-product.js the admin area returns

    a.fn.init [document, context: document, selector: ""]
    a.fn.init [div.acf-block-preview]

    The same file outputs this in the console in the front end

    a.fn.init [document, context: document, selector: ""]

    Which means, that I dont get the div.acf-block-preview object. But I see the block code in the front-end.

    My one-product.js is copied from the acf pro tutorail about creating blocks

    (function($) {
       * initializeBlock
       * Adds custom JavaScript to the block HTML.
       * @date    15/4/19
       * @since   1.0.0
       * @param   object $block The block jQuery element.
       * @param   object attributes The block attributes (only available when editing).
       * @return  void
      var initializeBlock = function($block) {
      // Initialize each block on page load (front end).
      $(document).ready(function() {
      // Initialize dynamic block preview (editor).
      if (window.acf) {

    Any idea why the $block code does not contain the

    a.fn.init [div.acf-block-preview]

    It contains the values that I need.

  • I found a solution to the issue, which works.

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.