{"id":4021,"date":"2023-11-04T23:14:00","date_gmt":"2023-11-04T23:14:00","guid":{"rendered":"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/"},"modified":"2023-11-05T05:48:24","modified_gmt":"2023-11-05T05:48:24","slug":"how-to-build-a-blog-with-gatsby-and-contentful","status":"publish","type":"post","link":"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/","title":{"rendered":"How to Build a Blog with Gatsby and Contentful"},"content":{"rendered":"<p>In this tutorial, we will explore how to build a blog using Gatsby and Contentful. Gatsby is a popular static site generator built with React, and Contentful is a headless content management system (CMS). Combining these two technologies allows you to create a dynamic blog with a smooth development experience.<\/p>\n<h2>Prerequisites<\/h2>\n<p>Before we get started, make sure you have the following installed on your machine:<\/p>\n<ul>\n<li>Node.js (v12 or higher)<\/li>\n<li>npm (v6 or higher)<\/li>\n<\/ul>\n<h2>Step 1: Set up a Gatsby project<\/h2>\n<p>To begin, let&#8217;s create a new Gatsby project by opening a terminal and running the following command:<\/p>\n<pre><code class=\"language-bash\">npx gatsby new gatsby-blog\n<\/code><\/pre>\n<p>This will create a new Gatsby project called &#8220;gatsby-blog&#8221; in a directory of the same name. Go into the project directory:<\/p>\n<pre><code class=\"language-bash\">cd gatsby-blog\n<\/code><\/pre>\n<h2>Step 2: Install required dependencies<\/h2>\n<p>Next, we need to install the necessary packages for our blog. Run the following command to install the required dependencies:<\/p>\n<pre><code class=\"language-bash\">npm install gatsby-source-contentful contentful gatsby-transformer-remark react-helmet\n<\/code><\/pre>\n<ul>\n<li><code>gatsby-source-contentful<\/code> is a Gatsby plugin that allows us to pull data from Contentful into our Gatsby website.<\/li>\n<li><code>contentful<\/code> is the official Contentful JavaScript SDK.<\/li>\n<li><code>gatsby-transformer-remark<\/code> is a plugin for transforming Markdown files into HTML.<\/li>\n<li><code>react-helmet<\/code> allows us to manipulate the head of our HTML document.<\/li>\n<\/ul>\n<h2>Step 3: Configure Contentful<\/h2>\n<p>To connect our Gatsby project with Contentful, we need to set up a Contentful account and create a new space.<\/p>\n<ol>\n<li>Go to the <a href=\"https:\/\/www.contentful.com\/\">Contentful website<\/a> and sign up for a new account if you don&#8217;t already have one.<\/li>\n<li>Once logged in, click on the &#8220;Create space&#8221; button to create a new space.<\/li>\n<li>Give your space a name (e.g., &#8220;Gatsby Blog&#8221;) and select the option &#8220;Website&#8221; for the purpose of your space.<\/li>\n<li>After creating the space, you&#8217;ll be directed to the Contentful web app. <\/li>\n<\/ol>\n<p>Keep this browser tab open as we&#8217;ll need the information from this page later.<\/p>\n<h2>Step 4: Create a Contentful content model<\/h2>\n<p>In Contentful, a content model defines the structure of the content in each entry. We need to create a content model for our blog posts.<\/p>\n<ol>\n<li>In the Contentful web app, click on the &#8220;Content model&#8221; option on the left sidebar.<\/li>\n<li>Click on the &#8220;+ Add Content Type&#8221; button and name it &#8220;Blog Post&#8221;.<\/li>\n<li>Add the following fields to the &#8220;Blog Post&#8221; content type:<\/li>\n<\/ol>\n<ul>\n<li>Title (Text field)<\/li>\n<li>Slug (Symbol field)<\/li>\n<li>Published date (Date &amp; time field)<\/li>\n<li>Body (Rich text field)<\/li>\n<li>Cover image (Media field)<\/li>\n<\/ul>\n<ol>\n<li>Once you have added all the fields, click on the &#8220;Save&#8221; button to save the content model.<\/li>\n<\/ol>\n<h2>Step 5: Retrieve Contentful API keys<\/h2>\n<p>In order for our Gatsby project to access the content from Contentful, we need to retrieve our Contentful API keys.<\/p>\n<ol>\n<li>In the Contentful web app, go to &#8220;Settings&#8221; in the top-right corner.<\/li>\n<li>Under the &#8220;API keys&#8221; tab, click on the &#8220;Add API key&#8221; button.<\/li>\n<li>Give your API key a name (e.g., &#8220;Gatsby Blog API key&#8221;) and select the &#8220;Content Delivery&#8221; role.<\/li>\n<li>After creating the API key, you will see two keys: &#8220;Space ID&#8221; and &#8220;Content Delivery API &#8211; access token&#8221;.<\/li>\n<\/ol>\n<p>Make sure to keep these API keys safe and avoid sharing them publicly.<\/p>\n<h2>Step 6: Configure Gatsby to use the Contentful plugin<\/h2>\n<p>To connect our Gatsby project with Contentful, we need to configure the <code>gatsby-config.js<\/code> file.<\/p>\n<ol>\n<li>Open the <code>gatsby-config.js<\/code> file in the root of your project.<\/li>\n<li>Replace the existing <code>plugins<\/code> array with the following code:<\/li>\n<\/ol>\n<pre><code class=\"language-javascript\">module.exports = {\n  siteMetadata: {\n    title: \"Gatsby Blog\",\n  },\n  plugins: [\n    {\n      resolve: `gatsby-source-contentful`,\n      options: {\n        spaceId: process.env.CONTENTFUL_SPACE_ID,\n        accessToken: process.env.CONTENTFUL_ACCESS_TOKEN,\n      },\n    },\n    `gatsby-transformer-remark`,\n  ],\n};\n<\/code><\/pre>\n<p>We are setting the <code>spaceId<\/code> and <code>accessToken<\/code> options for the <code>gatsby-source-contentful<\/code> plugin. However, instead of hardcoding these values, we will use environment variables in the next step.<\/p>\n<h2>Step 7: Set up environment variables<\/h2>\n<p>We need to set up environment variables to securely store our Contentful API keys.<\/p>\n<ol>\n<li>Create a new file called <code>.env.development<\/code> in the root of your project.<\/li>\n<li>Add the following content to the file:<\/li>\n<\/ol>\n<pre><code>CONTENTFUL_SPACE_ID=&lt;your-contentful-space-id&gt;\nCONTENTFUL_ACCESS_TOKEN=&lt;your-contentful-access-token&gt;\n<\/code><\/pre>\n<p>Replace <code>&lt;your-contentful-space-id&gt;<\/code> and <code>&lt;your-contentful-access-token&gt;<\/code> with the corresponding values from step 5.<\/p>\n<ol>\n<li>Create a similar <code>.env.production<\/code> file and fill in the same values.<\/li>\n<\/ol>\n<h2>Step 8: Create a blog post template<\/h2>\n<p>To display the blog posts on our Gatsby blog, we need to create a template.<\/p>\n<ol>\n<li>Create a new directory called <code>src\/templates<\/code> in the root of your project.<\/li>\n<li>Inside the <code>templates<\/code> directory, create a new file called <code>blog-post.js<\/code>.<\/li>\n<li>Add the following content to the <code>blog-post.js<\/code> file:<\/li>\n<\/ol>\n<pre><code class=\"language-javascript\">import React from \"react\";\nimport { graphql } from \"gatsby\";\nimport { Helmet } from \"react-helmet\";\n\nexport default function BlogPost({ data }) {\n  const post = data.contentfulBlogPost;\n\n  return (\n    &lt;div&gt;\n      &lt;Helmet&gt;\n        &lt;title&gt;{post.title} - Gatsby Blog&lt;\/title&gt;\n      &lt;\/Helmet&gt;\n      &lt;h1&gt;{post.title}&lt;\/h1&gt;\n      {post.publishedDate}\n      &lt;div\n        dangerouslySetInnerHTML={{ __html: post.body.childMarkdownRemark.html }}\n      \/&gt;\n    &lt;\/div&gt;\n  );\n}\n\nexport const query = graphql`\n  query($slug: String!) {\n    contentfulBlogPost(slug: { eq: $slug }) {\n      title\n      publishedDate(formatString: \"MMMM Do, YYYY\")\n      body {\n        childMarkdownRemark {\n          html\n        }\n      }\n    }\n  }\n`;\n<\/code><\/pre>\n<p>The <code>BlogPost<\/code> component receives the <code>data<\/code> prop, which contains the blog post data from Contentful. We are using the <code>Helmet<\/code> component from <code>react-helmet<\/code> to set the page title dynamically based on the blog post.<\/p>\n<p>The GraphQL query at the bottom fetches the blog post data for the specified slug.<\/p>\n<h2>Step 9: Fetch and render blog posts<\/h2>\n<p>Now let&#8217;s fetch the blog posts from Contentful and render them on our Gatsby blog.<\/p>\n<ol>\n<li>Open the <code>gatsby-node.js<\/code> file in the root of your project.<\/li>\n<li>Replace the existing code with the following:<\/li>\n<\/ol>\n<pre><code class=\"language-javascript\">exports.createPages = async ({ graphql, actions }) =&gt; {\n  const { createPage } = actions;\n  const result = await graphql(`\n    query {\n      allContentfulBlogPost {\n        edges {\n          node {\n            slug\n          }\n        }\n      }\n    }\n  `);\n\n  result.data.allContentfulBlogPost.edges.forEach(({ node }) =&gt; {\n    createPage({\n      path: `\/blog\/${node.slug}`,\n      component: require.resolve(\".\/src\/templates\/blog-post.js\"),\n      context: {\n        slug: node.slug,\n      },\n    });\n  });\n};\n<\/code><\/pre>\n<p>We are using the <code>createPages<\/code> API from Gatsby&#8217;s Node API to dynamically create pages for each blog post. The <code>createPage<\/code> function creates a new page at the specified path, uses the <code>blog-post.js<\/code> template we created earlier, and passes the blog post slug as a context.<\/p>\n<h2>Step 10: Style the blog<\/h2>\n<p>The last step before launching our blog is to add some styling.<\/p>\n<ol>\n<li>Open the <code>src\/components\/layout.css<\/code> file.<\/li>\n<li>Replace the existing content with the following CSS:<\/li>\n<\/ol>\n<pre><code class=\"language-css\">body {\n  margin: 0;\n  padding: 0;\n  font-family: Arial, sans-serif;\n}\n\nh1 {\n  margin-bottom: 0.5rem;\n}\n\np {\n  color: #888;\n  margin-top: 0;\n}\n\na {\n  color: #007bff;\n  text-decoration: none;\n}\n\n.blog-post {\n  max-width: 800px;\n  margin: 2rem auto;\n}\n<\/code><\/pre>\n<p>This CSS will give the blog posts a simple and clean styling.<\/p>\n<h2>Step 11: Start the development server<\/h2>\n<p>Finally, let&#8217;s start our Gatsby development server and see the blog in action.<\/p>\n<p>Run the following command in the terminal:<\/p>\n<pre><code class=\"language-bash\">npm run develop\n<\/code><\/pre>\n<p>Your blog should now be accessible at `http:\/\/localhost:8000`.<\/p>\n<h2>Conclusion<\/h2>\n<p>In this tutorial, we learned how to build a blog using Gatsby and Contentful. We set up a Gatsby project, connected it with Contentful, created a content model for blog posts, and fetched and rendered the posts. With this foundation, you can extend your blog with features like pagination, comments, and search. Happy blogging!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In this tutorial, we will explore how to build a blog using Gatsby and Contentful. Gatsby is a popular static site generator built with React, and Contentful is a headless content management system (CMS). Combining these two technologies allows you to create a dynamic blog with a smooth development experience. <a href=\"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/\" class=\"btn btn-link continue-link\">Continue Reading<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_import_markdown_pro_load_document_selector":0,"_import_markdown_pro_submit_text_textarea":"","footnotes":""},"categories":[1],"tags":[872,871,873,49,870],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v21.5 (Yoast SEO v21.5) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How to Build a Blog with Gatsby and Contentful - Pantherax Blogs<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Build a Blog with Gatsby and Contentful\" \/>\n<meta property=\"og:description\" content=\"In this tutorial, we will explore how to build a blog using Gatsby and Contentful. Gatsby is a popular static site generator built with React, and Contentful is a headless content management system (CMS). Combining these two technologies allows you to create a dynamic blog with a smooth development experience. Continue Reading\" \/>\n<meta property=\"og:url\" content=\"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/\" \/>\n<meta property=\"og:site_name\" content=\"Pantherax Blogs\" \/>\n<meta property=\"article:published_time\" content=\"2023-11-04T23:14:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-11-05T05:48:24+00:00\" \/>\n<meta name=\"author\" content=\"Panther\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Panther\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\n\t    \"@context\": \"https:\/\/schema.org\",\n\t    \"@graph\": [\n\t        {\n\t            \"@type\": \"Article\",\n\t            \"@id\": \"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/#article\",\n\t            \"isPartOf\": {\n\t                \"@id\": \"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/\"\n\t            },\n\t            \"author\": {\n\t                \"name\": \"Panther\",\n\t                \"@id\": \"http:\/\/localhost:10003\/#\/schema\/person\/b63d816f4964b163e53cbbcffaa0f3d7\"\n\t            },\n\t            \"headline\": \"How to Build a Blog with Gatsby and Contentful\",\n\t            \"datePublished\": \"2023-11-04T23:14:00+00:00\",\n\t            \"dateModified\": \"2023-11-05T05:48:24+00:00\",\n\t            \"mainEntityOfPage\": {\n\t                \"@id\": \"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/\"\n\t            },\n\t            \"wordCount\": 920,\n\t            \"publisher\": {\n\t                \"@id\": \"http:\/\/localhost:10003\/#organization\"\n\t            },\n\t            \"keywords\": [\n\t                \"\\\"Contentful\\\"\",\n\t                \"\\\"Gatsby\\\"\",\n\t                \"\\\"SEO-friendly\\\"\",\n\t                \"\\\"Web development\\\"\",\n\t                \"[\\\"blog building\\\"\"\n\t            ],\n\t            \"inLanguage\": \"en-US\"\n\t        },\n\t        {\n\t            \"@type\": \"WebPage\",\n\t            \"@id\": \"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/\",\n\t            \"url\": \"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/\",\n\t            \"name\": \"How to Build a Blog with Gatsby and Contentful - Pantherax Blogs\",\n\t            \"isPartOf\": {\n\t                \"@id\": \"http:\/\/localhost:10003\/#website\"\n\t            },\n\t            \"datePublished\": \"2023-11-04T23:14:00+00:00\",\n\t            \"dateModified\": \"2023-11-05T05:48:24+00:00\",\n\t            \"breadcrumb\": {\n\t                \"@id\": \"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/#breadcrumb\"\n\t            },\n\t            \"inLanguage\": \"en-US\",\n\t            \"potentialAction\": [\n\t                {\n\t                    \"@type\": \"ReadAction\",\n\t                    \"target\": [\n\t                        \"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/\"\n\t                    ]\n\t                }\n\t            ]\n\t        },\n\t        {\n\t            \"@type\": \"BreadcrumbList\",\n\t            \"@id\": \"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/#breadcrumb\",\n\t            \"itemListElement\": [\n\t                {\n\t                    \"@type\": \"ListItem\",\n\t                    \"position\": 1,\n\t                    \"name\": \"Home\",\n\t                    \"item\": \"http:\/\/localhost:10003\/\"\n\t                },\n\t                {\n\t                    \"@type\": \"ListItem\",\n\t                    \"position\": 2,\n\t                    \"name\": \"How to Build a Blog with Gatsby and Contentful\"\n\t                }\n\t            ]\n\t        },\n\t        {\n\t            \"@type\": \"WebSite\",\n\t            \"@id\": \"http:\/\/localhost:10003\/#website\",\n\t            \"url\": \"http:\/\/localhost:10003\/\",\n\t            \"name\": \"Pantherax Blogs\",\n\t            \"description\": \"\",\n\t            \"publisher\": {\n\t                \"@id\": \"http:\/\/localhost:10003\/#organization\"\n\t            },\n\t            \"potentialAction\": [\n\t                {\n\t                    \"@type\": \"SearchAction\",\n\t                    \"target\": {\n\t                        \"@type\": \"EntryPoint\",\n\t                        \"urlTemplate\": \"http:\/\/localhost:10003\/?s={search_term_string}\"\n\t                    },\n\t                    \"query-input\": \"required name=search_term_string\"\n\t                }\n\t            ],\n\t            \"inLanguage\": \"en-US\"\n\t        },\n\t        {\n\t            \"@type\": \"Organization\",\n\t            \"@id\": \"http:\/\/localhost:10003\/#organization\",\n\t            \"name\": \"Pantherax Blogs\",\n\t            \"url\": \"http:\/\/localhost:10003\/\",\n\t            \"logo\": {\n\t                \"@type\": \"ImageObject\",\n\t                \"inLanguage\": \"en-US\",\n\t                \"@id\": \"http:\/\/localhost:10003\/#\/schema\/logo\/image\/\",\n\t                \"url\": \"http:\/\/localhost:10003\/wp-content\/uploads\/2023\/11\/cropped-9e7721cb-2d62-4f72-ab7f-7d1d8db89226.jpeg\",\n\t                \"contentUrl\": \"http:\/\/localhost:10003\/wp-content\/uploads\/2023\/11\/cropped-9e7721cb-2d62-4f72-ab7f-7d1d8db89226.jpeg\",\n\t                \"width\": 1024,\n\t                \"height\": 1024,\n\t                \"caption\": \"Pantherax Blogs\"\n\t            },\n\t            \"image\": {\n\t                \"@id\": \"http:\/\/localhost:10003\/#\/schema\/logo\/image\/\"\n\t            }\n\t        },\n\t        {\n\t            \"@type\": \"Person\",\n\t            \"@id\": \"http:\/\/localhost:10003\/#\/schema\/person\/b63d816f4964b163e53cbbcffaa0f3d7\",\n\t            \"name\": \"Panther\",\n\t            \"image\": {\n\t                \"@type\": \"ImageObject\",\n\t                \"inLanguage\": \"en-US\",\n\t                \"@id\": \"http:\/\/localhost:10003\/#\/schema\/person\/image\/\",\n\t                \"url\": \"http:\/\/2.gravatar.com\/avatar\/b8c0eda5a49f8f31ec32d0a0f9d6f838?s=96&d=mm&r=g\",\n\t                \"contentUrl\": \"http:\/\/2.gravatar.com\/avatar\/b8c0eda5a49f8f31ec32d0a0f9d6f838?s=96&d=mm&r=g\",\n\t                \"caption\": \"Panther\"\n\t            },\n\t            \"sameAs\": [\n\t                \"http:\/\/localhost:10003\"\n\t            ],\n\t            \"url\": \"http:\/\/localhost:10003\/author\/pepethefrog\/\"\n\t        }\n\t    ]\n\t}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"How to Build a Blog with Gatsby and Contentful - Pantherax Blogs","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/","og_locale":"en_US","og_type":"article","og_title":"How to Build a Blog with Gatsby and Contentful","og_description":"In this tutorial, we will explore how to build a blog using Gatsby and Contentful. Gatsby is a popular static site generator built with React, and Contentful is a headless content management system (CMS). Combining these two technologies allows you to create a dynamic blog with a smooth development experience. Continue Reading","og_url":"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/","og_site_name":"Pantherax Blogs","article_published_time":"2023-11-04T23:14:00+00:00","article_modified_time":"2023-11-05T05:48:24+00:00","author":"Panther","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Panther","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/#article","isPartOf":{"@id":"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/"},"author":{"name":"Panther","@id":"http:\/\/localhost:10003\/#\/schema\/person\/b63d816f4964b163e53cbbcffaa0f3d7"},"headline":"How to Build a Blog with Gatsby and Contentful","datePublished":"2023-11-04T23:14:00+00:00","dateModified":"2023-11-05T05:48:24+00:00","mainEntityOfPage":{"@id":"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/"},"wordCount":920,"publisher":{"@id":"http:\/\/localhost:10003\/#organization"},"keywords":["\"Contentful\"","\"Gatsby\"","\"SEO-friendly\"","\"Web development\"","[\"blog building\""],"inLanguage":"en-US"},{"@type":"WebPage","@id":"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/","url":"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/","name":"How to Build a Blog with Gatsby and Contentful - Pantherax Blogs","isPartOf":{"@id":"http:\/\/localhost:10003\/#website"},"datePublished":"2023-11-04T23:14:00+00:00","dateModified":"2023-11-05T05:48:24+00:00","breadcrumb":{"@id":"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/"]}]},{"@type":"BreadcrumbList","@id":"http:\/\/localhost:10003\/how-to-build-a-blog-with-gatsby-and-contentful\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"http:\/\/localhost:10003\/"},{"@type":"ListItem","position":2,"name":"How to Build a Blog with Gatsby and Contentful"}]},{"@type":"WebSite","@id":"http:\/\/localhost:10003\/#website","url":"http:\/\/localhost:10003\/","name":"Pantherax Blogs","description":"","publisher":{"@id":"http:\/\/localhost:10003\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"http:\/\/localhost:10003\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"http:\/\/localhost:10003\/#organization","name":"Pantherax Blogs","url":"http:\/\/localhost:10003\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"http:\/\/localhost:10003\/#\/schema\/logo\/image\/","url":"http:\/\/localhost:10003\/wp-content\/uploads\/2023\/11\/cropped-9e7721cb-2d62-4f72-ab7f-7d1d8db89226.jpeg","contentUrl":"http:\/\/localhost:10003\/wp-content\/uploads\/2023\/11\/cropped-9e7721cb-2d62-4f72-ab7f-7d1d8db89226.jpeg","width":1024,"height":1024,"caption":"Pantherax Blogs"},"image":{"@id":"http:\/\/localhost:10003\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"http:\/\/localhost:10003\/#\/schema\/person\/b63d816f4964b163e53cbbcffaa0f3d7","name":"Panther","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"http:\/\/localhost:10003\/#\/schema\/person\/image\/","url":"http:\/\/2.gravatar.com\/avatar\/b8c0eda5a49f8f31ec32d0a0f9d6f838?s=96&d=mm&r=g","contentUrl":"http:\/\/2.gravatar.com\/avatar\/b8c0eda5a49f8f31ec32d0a0f9d6f838?s=96&d=mm&r=g","caption":"Panther"},"sameAs":["http:\/\/localhost:10003"],"url":"http:\/\/localhost:10003\/author\/pepethefrog\/"}]}},"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"","_links":{"self":[{"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/posts\/4021"}],"collection":[{"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/comments?post=4021"}],"version-history":[{"count":1,"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/posts\/4021\/revisions"}],"predecessor-version":[{"id":4517,"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/posts\/4021\/revisions\/4517"}],"wp:attachment":[{"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/media?parent=4021"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/categories?post=4021"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/localhost:10003\/wp-json\/wp\/v2\/tags?post=4021"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}