Magento 2 How to get Home Page in GraphQL

In this article we will show you how to get the home page data using GraphQL. First of all, we need to get the home page identifier using storeConfig query.

Use following query to get Home page identifier using storeConfig query.

Request

Copy
{
  storeConfig {
    cms_home_page
  }
}

Response

Copy
{
  "data": {
    "storeConfig": {
      "cms_home_page": "home"
    }
  }
}

Now, you can get the CMS Home Page data using above identifier home in the following cmsPage query. Check cmsPage GraphQL query article more informations.

Request

Copy
{
  cmsPage(identifier: "home") {
    title
    url_key
    content_heading
    content
    page_layout
    meta_title
    meta_keywords
    meta_description
  }
}

Response

Copy
{
  "data": {
    "cmsPage": {
      "title": "Home Page",
      "url_key": "home",
      "content_heading": "Home Page",
      "content": "<p><div class=\"message info\" style=\"margin-top: 50px;\">\n    <p><strong>Try Demo Customer Access</strong></p>\n    <p><span style=\"display:inline-block; width: 80px; padding-right: 10px;\">Email:</span>roni_cost@example.com</p>\n    <p><span style=\"display:inline-block; width: 80px; padding-right: 10px;\">Password:</span>roni_cost3@example.com</p>\n</div></p>",
      "page_layout": "1column",
      "meta_title": "",
      "meta_keywords": "",
      "meta_description": ""
    }
  }
}

Now, in case if you want to get a static block then use CMS Block identifier and get CMS Block data using cmsBlock query. You can also get other data like sliders, banners, etc using block identifier.

That's it!!

If you are looking for more GraphQL solutions then check out our another article which is List of GraphQL Queries and Mutations for Magento 2.

I hope this article helps you to find what you were looking for.

Bookmark it for your future reference. Do comment below if you have any other questions on that.

P.S. Do share this article with your team.



Search
Recent Posts
    Tags
    Newsletter
    SocialFollow on Twitter
    Visit now!