Permalink
Browse files

Create an index of WordPress posts

  • Loading branch information...
booyaa committed Jan 1, 2019
1 parent 5015672 commit 2249ea842a18e4da39c6e3abcf8eeabd78a17116
Showing with 30 additions and 10 deletions.
  1. +30 −10 src/pages/index.js
@@ -1,21 +1,41 @@
import React from 'react'
import { Link } from 'gatsby'
import { Link, graphql } from 'gatsby'

import Layout from '../components/layout'
import Image from '../components/image'
import SEO from '../components/seo'

const IndexPage = () => (
const IndexPage = ({data}) => (
<Layout>
<SEO title="Home" keywords={[`gatsby`, `application`, `react`]} />
<h1>Hi people</h1>
<p>Welcome to your new Gatsby site.</p>
<p>Now go build something great.</p>
<div style={{ maxWidth: `300px`, marginBottom: `1.45rem` }}>
<Image />
</div>
<Link to="/page-2/">Go to page 2</Link>
<h1>Welcome to the Gatsby demo</h1>
<h3>There are {data.allWordpressPost.totalCount} posts</h3>
{data.allWordpressPost.edges.map(({ node }) => (
<div key={node.id}>
<Link to={node.slug}>
<h4><span dangerouslySetInnerHTML={{ __html: node.title}} /> - {node.date}</h4>
</Link>

<div dangerouslySetInnerHTML={{ __html: node.excerpt }} />
</div>
))}
</Layout>
)

export default IndexPage

export const pageQuery = graphql`
query {
allWordpressPost(sort: { fields: [date], order: DESC }) {
totalCount
edges {
node {
id
title
excerpt
slug
date(formatString: "Do MMMM")
}
}
}
}
`

0 comments on commit 2249ea8

Please sign in to comment.