Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Harsh Dagariya 6 posts 86 karma points
    Feb 21, 2022 @ 10:48
    Harsh Dagariya
    0

    Issue in image cropper in GraphQL queries.

    I am using umbraco heartcore and when I tried to fetch data using GraphQL query then I am not able to get the cropped alias in GraphQL query. So can you please help me out to resolve this.

  • Lindow 106 posts 1000 karma points admin hq
    Feb 21, 2022 @ 11:12
    Lindow
    0

    Hey

    Try this:

    {
      content(url: "URL of the page") {
        ... on DocTypeAlias{
          AliasOfTheImagePicker{
          url
          cropped: url(width: 1200, height: 2400)
          }
        }
      }
    }
    

    The url line will return the default URL of the image

    The one I called cropped will return the URL with the crops. You can call it anything you like.

  • Harsh Dagariya 6 posts 86 karma points
    Feb 21, 2022 @ 11:25
    Harsh Dagariya
    0

    I am querying like this.

    query { allWellnessHubProgram( where: { category:"Mind" }, orderBy: createDate_DESC, first: 6, , ){ items{id, title, description, programAuthor, jWPlayerPlaylistID, category, totalSessionStages, level, environment, tags, bannerImage{focalPointUrlTemplate}, renderSection }, pageInfo{hasNextPage, endCursor} } }

    what I need to change to get cropping alias URL?

  • Lindow 106 posts 1000 karma points admin hq
    Feb 21, 2022 @ 11:36
    Lindow
    100
    query {
      allWellnessHubProgram(
        where: { category: "Mind" }
        orderBy: createDate_DESC
        first: 6
      ) {
        items {
          id
          title
          description
          programAuthor
          jWPlayerPlaylistID
          category
          totalSessionStages
          level
          environment
          tags
          bannerImage {
            focalPointUrlTemplate
            yourBannerImageWithACropp: url(width:100, height:100)
          }
          renderSection
        }
        pageInfo {
          hasNextPage
          endCursor
        }
      }
    }
    

    Try this. Essentially, you just need to add the crop property as a subselection of the media property. You can find more details on how to query your content/media in GraphQL playground docs in the backoffice :)

Please Sign in or register to post replies

Write your reply to:

Draft