Support

Account

Home Forums Backend Issues (wp-admin) Changes to acf-pro-input.js not showing up

Solving

Changes to acf-pro-input.js not showing up

  • Hi,

    I’m trying to edit acf-pro-input.js to add some features to the flexible content field. I’m not great with JS.

    The issue I’m seeing is that acf-pro-input.js isn’t loading onto the page. The minified version of the file is what actually gets loaded onto the site.

    Does ACF automatically minify this? Should I start minifying the JS myself? How should I go about editing the JS in this file?

  • Firstly, you are probably aware that altering a file in the plugin is not a good idea. When ACF is updated your changes will be overwritten and need to be made again and again for every update. The best way to make changes is to include a separate custom javascript file that extends the functionality provided by ACF.

    That being said, the minified version of the script is manually created from the unminified version whenever there is an update. Which version is loaded is dependent on the value of the SCRIPT_DEBUG constant. The unminified version is loaded when this constant is set to true. https://codex.wordpress.org/Debugging_in_WordPress#SCRIPT_DEBUG

  • Thanks for your feedback and the info about how the minified script gets.

    I don’t really see how I can make the changes I want to make without editing the acf-pro-input.js file directly. I’m looking to make changes to the flexible_content object and that will require me editing the aforementioned JS file and class-acf-field-flexible-content.php. So I would have to create new files that would get loaded into the plugin instead of those two files. Basically I’d need to create a child theme for the plugin and I’m not sure how to do that! Any guidance as to where I’d start?

  • What you need to do is create a new field type that includes your changes and custom JS that is basically a copy of the flex field. Three is documentation to get started here https://www.advancedcustomfields.com/resources/creating-a-new-field-type/

  • Hi, I’m circling back on this. I went through and created a new plugin using that “create a new field type” link you provided. I wondering if you could recommend a direction on how to move forward.

    Basically, we are using a page-builder created using flexible content fields and a number of add-ons. I’d like to add a button here:

    https://www.screencast.com/t/dUFyZhyTW

    That allows you to duplicate the entire row layout.

    I’m sort of stuck on how to do the duplication itself. Would you recommend I use JS or PHP to duplicate the layout? If I go with JS, what sort of values would I have to increment in order to avoid problems when the database gets updated?

  • If I was going to do this I would do it with JS. The exact details of what you would need to do would be hard to say. ACF uses hidden copies of each field and each row layout that it copies when adding rows. I would start by investigating how ACF does it and then do something similar.

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

The topic ‘Changes to acf-pro-input.js not showing up’ is closed to new replies.