[Function] Get URL of an Image-type field from ACF Options page

This tutorial provdes the steps to pull the URL of an Image-type field (in Options page) for the specified field and image size.

Step 1

Install and activate Advanced Custom Fields Pro.

Go to Snippets > Add New.

Title: ACF Options Page

Code:

if ( function_exists( 'acf_add_options_page' ) ) {

    acf_add_options_page();

}

Step 2

Go to Custom Fields > Add New.

Title: Sitewide

Add an image field. Leave the Return Value a Image Array.

Set the group to appear on Options page.

Step 3

Install and activate Code Snippets plugin.

Go to Snippets > Add New.

Title: [Function] Get URL of an Image-type field (in Options page) for the specified field and image size

Code:

function wpdd_get_options_image_url( $field, $size ) {
	// if ACF is not active, abort.
	if ( ! class_exists( 'ACF' ) ) {
		return;
	}

	$image = get_field( $field, 'option' );
	
	return esc_url( $image['sizes'][ $size ] );
}

Set the snippet to run on the front-end. Save changes and activate.

Step 4

The function can be used like so:

<?php 

wpdd_get_options_image_url( 'logo', 'medium' );

?>

where logo is the field name and medium is the desired image size.

If using Oxygen, Dynamic Data feature can be used like so:

with the resulting shortcode being:

Reference

https://www.advancedcustomfields.com/resources/image/