如何在单个页面gatsby站点中将所有wordpress页面呈现为一部分

问题描述 投票:-3回答:2

我要构建一个单页的投资组合,其结构如下:介绍项目简历接触

对于在WordPress中创建的每个部分,我都有单独的页面。如何使用gatsby将每个wordpress页面呈现为一页?

这里是我通过wordpress API创建gatsby页面的位置:https://github.com/joeymorello/port-site/blob/master/gatsby-node.js

reactjs wordpress gatsby headless-cms
2个回答
0
投票

一个非常简单的示例可能是在pages/index.js中添加类似的内容:

import React from "react"
import { graphql } from "gatsby"

const IndexPage = ({ data }) => {
  const { allWordpressPage } = data
  return (
  <>
    {allWordpressPage.edges.node.map(node => {
      const { title, content, id } = node
      return (
        <section key={ id }>
          <h2>{{ title }}</h2>
          <div>{{ content }}</div>
        </section>
      )
    })}
  </>
}
)}

export default IndexPage



export const pageQuery = graphql`
  query {
    allWordpressPage {
      edges {
        node {
          id
          title
          content
        }
      }
    }
  }
`

1
投票

如果您希望将一页的内容嵌入到另一页中,而不必复制整个内容,则需要使用简码。您可以为此尝试一个插件:https://wordpress.org/plugins/insert-pages/

© www.soinside.com 2019 - 2024. All rights reserved.