• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

I Like Kill Nerds

The blog of Australian Front End / Aurelia Javascript Developer & brewing aficionado Dwayne Charrington // Aurelia.io Core Team member.

  • Home
  • Aurelia 2
  • Aurelia 1
  • About
  • Aurelia 2 Consulting/Freelance Work

How to programmatically populate a TinyMCE Advanced Custom Fields field in WordPress

Wordpress · October 21, 2022

The Advanced Custom Fields plugin for WordPress is invaluable. It has filled a gap in WordPress for the better part of a decade and is one of the first plugins that I install in a new WordPress installation (I have a lifetime developer licence).

The ACF plugin provides a Javascript API available using acf it has numerous methods for interacting with ACF fields in your WordPress installation. You can programmatically get and set field values, observe for changes and react accordingly.

However, I encountered a use case recently where I wanted to programmatically update a WYSIWYG editor field. Using the standard acf.set method does not visibility update this value. To do this, we need to interact with the TinyMCE editor instance call the TinyMCE editor method setContent.

function updateAcfTinymce(fieldId, value) {
    const f = acf.getField(fieldId);
    const tinyID = f.$el.find("textarea").attr("id");
    const tinyInstance = tinyMCE.editors[tinyID];
    
    tinyInstance.setContent(value);
}

I’ve created a simple function you can use which takes the field key (the name of the field or the field key) and the second the value you want to set.

Dwayne

Leave a Reply Cancel reply

0 Comments
Inline Feedbacks
View all comments

Primary Sidebar

Popular

  • Thoughts on the Flipper Zero
  • Testing Event Listeners In Jest (Without Using A Library)
  • How To Get The Hash of A File In Node.js
  • How To Paginate An Array In Javascript
  • Waiting for an Element to Exist With JavaScript
  • Reliably waiting for network responses in Playwright
  • How To Get Last 4 Digits of A Credit Card Number in Javascript
  • How to Use Neural DSP Archetype Plugins With the Quad Cortex
  • Neural DSP Reveal Details About the Long-Awaited Quad Cortex Desktop Editor
  • How To Decompile And Compile Android APK's On A Mac Using Apktool

Recent Comments

  • Kevmeister68 on Start-Ups and Companies That Embrace Work From Anywhere Will Be More Likely to Survive the Coming Recession in 2023
  • kevmeister68 on What Would Get People Back Into the Office?
  • Dwayne on PHP Will Not Die
  • Dwayne on How to Create a Blockchain With TypeScript
  • kevmeister68 on PHP Will Not Die

Copyright © 2023 · Dwayne Charrington · Log in

wpDiscuz