Image

ACF

Last Upated: Thursday, Jan 25, 2024

image

The Image field is native to ACF (free) and allows for an image to be uploaded and selected by using the native WordPress media modal.

Resolve Type

The "image" field type resolves as a "AcfMediaItemConnectionEdge" Type in the GraphQL Schema.

This allows for the image to be queried as a node of the MediaItem Type, where the client can ask for any property of the Image.

Field Settings

Field Configuration

<?php
add_action( 'acf/include_fields', function() {
  if ( ! function_exists( 'acf_add_local_field_group' ) ) {
      return;
  }
  acf_add_local_field_group(
    [
      {
        "key": "my_field_group_",
        "title": "My Field Group with image",
        "show_in_graphql": 1,
        "graphql_field_name": "myFieldGroupWithImage",
        "map_graphql_types_from_location_rules": 0,
        "graphql_types": [
          "Page"
        ],
        "fields": [
          {
            "key": "my_field_",
            "label": "My Field",
            "name": "my_field",
            "type": "image",
            "show_in_graphql": 1,
            "graphql_field_name": "myFieldWithImage"
          }
        ],
        "location": [
          [
            {
              "param": "post_type",
              "operator": "==",
              "value": "page"
            }
          ]
        ]
      }
    ]
  );
});

Image

Resolve Type

Field Settings

Field Configuration

Querying the Image field