Skip to content

Instantly share code, notes, and snippets.

@marklchaves

marklchaves/get_popup_ids_from_acf.php

Created July 9, 2025 11:54
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save marklchaves/82f983a42432fbbf609b4f4bfbfc0b68 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save marklchaves/82f983a42432fbbf609b4f4bfbfc0b68 to your computer and use it in GitHub Desktop.
Download ZIP
Grab a comma separated list of popup IDs from a specific page's or post's ACF field.
Raw
get_popup_ids_from_acf.php
<?php
/**
* PHP to get popup IDs from ACF and render them in a data attribute.
*
* This code should be placed in your theme's header.php, footer.php,
* or a specific template file, usually within the <body> but **before**
* the JS code that uses the popup IDs.
*
* This code example creates a <div> to store the popup IDs just before
* the popup's HTML. It does that because the hook's priority is set to 10.
* Where Popup Maker's hook priorities are set to 500.
*/
add_action( 'wp_footer', function () {
// Define the specific Post ID you want to target. You can change
// this value to the ID of the WordPress Post or Page where your
// ACF 'popup_ids' field is saved.
$my_post_id = 2; // CHANGE THIS TO YOUR POST/PAGE ID
// Check if ACF's get_field function exists (ACF is active).
if (function_exists('get_field')) {
// Get the value of the 'popup_ids' field (1st arg) for the specified post/page (2nd arg).
// The third argument 'false' means it won't format the value, just return raw.
$popup_ids_string = get_field('popup_ids', $my_post_id, false);
// Sanitize the string to ensure it's safe for HTML attribute.
// We expect comma-separated IDs, so we'll sanitize each segment.
$clean_popup_ids = '';
if (! empty($popup_ids_string)) {
$ids_array = explode(',', $popup_ids_string);
$sanitized_ids = array_map('sanitize_text_field', $ids_array);
$clean_popup_ids = implode(',', $sanitized_ids);
}
// Output a hidden div with the data attribute. You could place this
// just inside the <body> tag or anywhere **before** your JS.
echo '<div id="popup-config-data" data-popup-ids="' . esc_attr($clean_popup_ids) . '" style="display:none;"></div>';
}
}, 10 );
?>
@marklchaves
Copy link
Author

marklchaves commented Jul 9, 2025

Example JS for extracting the popup IDs from the
and saving them in a JS array

const configElement = document.getElementById('popup-config-data');
if (!configElement) {
        console.warn('Popup configuration element not found.');
        return; // Exit if the config element isn't there
}

const popupIdsString = configElement.dataset.popupIds;
// Split by comma, filter out empty strings (in case of leading/trailing commas or multiple commas), and trim whitespace
const idsToDisplay = popupIdsString ? popupIdsString.split(',').map(id => id.trim()).filter(id => id !== '') : [];

Example input

popup-ids-acf-field

Example output

inserting-list-of-popup-ids-before-popup

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment