What's the best way to query the logo?

[jeffabailey]

It appears that the best way is to create a mediaItem that is called logo and query for that.

Is there a better way?

[jeffabailey]

Here is the query I'm currently using.

 mediaItems(where: {name: "logo"}) {
    nodes {
      mediaItemUrl
      mediaDetails {
        height
        width
      }
    }
  }

[jasonbahl]

@jeffabailey nice! That's a creative solution. As long as the logo is always named logo, that should work!

[jeffabailey]

Curiously, this query is throwing this error. I am able to run it fine within Graphiql.

const {
    mediaItems: {
      nodes: {
        mediaItemUrl,
        mediaDetails: { height, width },
      },
    },
  } = useStaticQuery(graphql`
    query LogoQuery {
      mediaItems(where: { name: "logo" }) {
        nodes {
          mediaItemUrl
          mediaDetails {
            height
            width
          }
        }
      }
    }
  `)

Should this query be executable out of the box?

[jeffabailey]

I changed it to this, and now it works.

It's confusing that what you query in Graphqiql doesn't work.

     allWpMediaItem {
        edges {
          node {
            title
            mediaDetails {
              height
              width
            }
            altText
            sourceUrl
          }
        }
      }

[jasonbahl]

@jeffabailey at the moment the logo isn't explicitly exposed in the Schema with its own entry point, but you could expose it to the schema by registering a new field to the Schema using register_graphql_field()

You can read more about register_graphql_field function here: https://www.wpgraphql.com/functions/register_graphql_field/

And the other register_graphql_* functions here: https://www.wpgraphql.com/functions/

[jeffabailey]

Good to know that it's not exposed!

Thank you

[jasonbahl]

@jeffabailey so, the logo ID is stored as the custom_logo within Theme Mods.

So, we can add a field like so:

add_action( 'graphql_register_types', function() {

	register_graphql_field( 'RootQuery', 'siteLogo', [
		'type' => 'MediaItem',
		'description' => __( 'The logo set in the customizer', 'your-textdomain' ),
		'resolve' => function() {

			$logo_id = get_theme_mod( 'custom_logo' );

			if ( ! isset( $logo_id ) || ! absint( $logo_id ) ) {
				return null;
			}

			$media_object = get_post( $logo_id );
			return new \WPGraphQL\Model\Post( $media_object );

		}
	]  );

} );

Then, if I upload an image to the logo:

Then I can query it like so:

{
  siteLogo {
    sourceUrl
  }
}

Here it is in action:

[jeffabailey]

I found this query, but it's failing for me.

query {
  allWordpressWpLogo {
    edges {
      node {
        url {
          source_url
        }
      }
    }
  }
}

More hits: https://github.com/search?q=allWordpressWpLogo&type=code

Here's the error I'm seeing.

[jasonbahl]

I'm not sure where allWordpressWpLogo is coming from. Do you have a custom post type called WordPressWpLogo? 🤔

That is definitely not exposed by WPGraphQL out of the box.

[jeffabailey]

I am not sure where that is coming from. It's in a few repos here on Github.