An unopinionated Gatsby/WordPress starter written in TypeScript.
Hosted Site: https://arnonate.github.io/gatbsy-wordpress-starter/
Associated Blog Post:
-
Download Flywheel Local and spin up a new local Wordpress Site.
-
Install the Headless Wordpress theme in the
wp
directory of this repo or get the most recent version of the Headless theme from this repo. -
Install the following plugins:
- Current versions of these plugins (at the time of writing the associated blog post) are available in the
wp
directory.
- Import sample
.xml
content from thewp
directory using the "Wordpress Importer" plugin which is available by going to "Tools > Import". If you don't want to import content then you can simply publish the required Pages (Home, About, Contact, Thanks), Posts and Custom Posts yourself. You will also need to add "Featured Images" to your pages and posts if you want that to show
-
Add your Wordpress website url to
gatbsy-config.ts
. -
Open the Gatsby project and run the following command:
yarn && yarn develop
(or the npm alternative).
-
Start developing.
Navigate into your new site’s directory and start it up.
cd my-default-starter/ gatsby develop
-
Open the source code and start editing!
Your site is now running at
http://localhost:8000
!Note: You'll also see a second link:
http://localhost:8000/___graphql
. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the Gatsby tutorial.Open the
my-default-starter
directory in your code editor of choice and editsrc/pages/index.js
. Save your changes and the browser will update in real time!