TylerBarnes / wordsby

A toolset to glue Gatsby and WordPress together
65 stars 4 forks source link

Add better setup instructions #23

Open ghost opened 5 years ago

ghost commented 5 years ago

I am trying to test this and stuck in the installation I have installed the theme on my local WP setup, and created a new Wordsby starter now how can I connect them?

for example, in the gatsby source plugin,

 resolve: `gatsby-source-wordpress`,
      options: {
        baseUrl: `My Local WP Address`,
        // The protocol. This can be http or https.
        protocol: `http`,

but I dont know how can I connect my local WP to this, any ideas?

ghost commented 5 years ago

Also when running gatsby develop and accessing http://localhost:8000/ some content and pages are loaded, so it is connecting to some site?

TylerBarnes commented 5 years ago

Hey @LittleHamster. I definitely need to improve the setup instructions. It's such a big project that I haven't had time yet to make things fully clear. I'm considering the whole thing prerelease even though it works.

wordsby actually replaces gatsby-source-wordpress entirely. Instead of gatsby connecting via the rest api, WP actually commits data directly to your gatsby repo. If you check the starter you installed you'll see a folder called 'wordsby' and inside there should be a data folder and an uploads folder. Basically there is some data in there for demo purposes. If you follow the set up instructions to connect wp to your git repo at https://github.com/TylerBarnes/wordsby/wiki/Github---Gitlab-integration-setup WP will be able to commit uploads and data to your repo.

To commit the data just save a post or page and a menu. If you have existing uploads, copy/paste them to the wordsby/uploads folder (in the exact folder structure they're in in WP) and commit that to the repo.

Whenever a post or menu is saved or a media file is uploaded, WP will then commit this data to your gatsby site.

This means you don't need to pull the data from WP every time you run gatsby develop. It means you don't have to redownload your images over and over. It also means gatsby build and gatsby develop are faster!

It also means $2 shared hosting works for any number of posts / images. You can run a WP site with 100,000 images and your build will never hang forever or fail.

Let me know if I can clarify further or if you have any other questions.

ghost commented 5 years ago

@TylerBarnes oh ok, let me try again and connect to Github and see if I can get this up and running also may I ask why your admin theme changes WP look? is it because it was customized based on your requirements for a particular project?

TylerBarnes commented 5 years ago

No, it's because I think the wp look is outdated and the menu architecture in WordPress is bad. A lot of sites end up with 20 to 30+ admin menu items in the end. The idea was to hide WordPress features that aren't available in Gatsby and I updated the look at the same time. Going forward the entire theme will either be broken into separate plugins or configurable so things can easily be turned off. For now you can disable the visual changes by going into functions.php and commenting out "BetterAdmin.php"

On Jan 20, 2019, 12:36 PM, at 12:36 PM, LittleHamster notifications@github.com wrote:

@TylerBarnes oh ok, let me try again and connect to Github and see if I can get this up and running also may I ask why your admin theme changes WP look? is it because it was customized based on your requirements for a particular project?

-- You are receiving this because you were mentioned. Reply to this email directly or view it on GitHub: https://github.com/TylerBarnes/wordsby/issues/23#issuecomment-455900102

ghost commented 5 years ago

@TylerBarnes okay so here is what I did and I am not able to set it up:

  1. On my local WP I installed the WP Admin theme and activate it
  2. In WP-config file, I added the following:
define('WORDLIFY_GITHUB_API_TOKEN', 'MY TOKEN');
define('WORDLIFY_GITHUB_OWNER', 'MY USERNAME');
define('WORDLIFY_GITHUB_REPO', 'MY REPO NAME');

// for both
define('WORDLIFY_GIT_HOST', 'github'); // or "gitlab"
define('WORDLIFY_BRANCH', 'master'); // pick the main branch.
  1. I did gatsby new wordsby-starter https://github.com/TylerBarnes/wordsby-starter
  2. I committed to the repo I created
  3. In Netlify, I added the repo and I changed the deploy command to gatsby build

but the build fails:

4:47:31 PM:    5 |   const {
4:47:31 PM:    6 |     data: {
4:47:31 PM: >  7 |       allWordsbyCollections: { edges: posts }
4:47:31 PM:      |                                ^
4:47:31 PM:    8 |     }
4:47:31 PM:    9 |   } = props;
4:47:31 PM:   10 |
4:47:31 PM: 
4:47:31 PM:   WebpackError: TypeError: Cannot read property 'edges' of null

Also when adding a WP post, I get these error:

( ! ) Warning: array_walk_recursive() expects parameter 1 to be array, boolean given in /app/public/wp-content/themes/wordsby-admin-master/plugins/WordsbyCore/gatsby-endpoints/rest-api-endpoint-all-options.php on line 13
--

( ! ) Warning: Invalid argument supplied for foreach() in /app/public/wp-content/themes/wordsby-admin-master/plugins/WordsbyCore/gatsby-endpoints/rest-api-endpoint-all-options.php on line 15
--

( ! ) Warning: Cannot modify header information - headers already sent by (output started at /app/public/wp-content/themes/wordsby-admin-master/plugins/WordsbyCore/gatsby-endpoints/rest-api-endpoint-all-options.php:13) in /app/public/wp-admin/post.php on line 210
--

( ! ) Warning: Cannot modify header information - headers already sent by (output started at /app/public/wp-content/themes/wordsby-admin-master/plugins/WordsbyCore/gatsby-endpoints/rest-api-endpoint-all-options.php:13) in /app/public/wp-includes/pluggable.php on line 1223
--

I am running PHP 7.2.0 on the local server

thanks

TylerBarnes commented 5 years ago

The php warnings should be OK since they're just warnings not errors, I'll add those to my list to check out / fix though. It looks like gatsby isn't picking up the data in collections.json. To debug you can check your commit history to see if a file collections.json was committed to your repo. If it wasn't then those warnings could be preventing WP from committing to your repo.

If you see a commit similar to the following,

screen shot 2019-01-20 at 2 01 46 pm

then it's committing to your repo. If you look at the contents of wordsby/data/collections.json you can check if your posts are in there. Essentially gatsby is using gatsby-transformer-json (with modifications) to read from the local JSON data that was committed to your repo.

TylerBarnes commented 5 years ago

I just ran through a new install using the steps you mentioned. I was able to do it with no problems except that a lack of menu items was causing the build to fail.

One thing I thought of is that maybe your github api token doesn't have repo access. Do you remember if you checked this box?

screen shot 2019-01-20 at 2 35 40 pm
ghost commented 5 years ago

@TylerBarnes yes, when creating the token, I made sure to check the repo I didnt have any menu, maybe thats why the build failed.

also can you setup a demo on netlify? I managed to build but now homepage is just showing "Nope". Also permalink structure is not working.

thanks 👍

TylerBarnes commented 5 years ago

It looks like the "Nope" is from the 404 page.. I don't remember writing that in there. I'm going to add a bit more structure to the starter as I finish some other things. If you set a homepage in WP you wont see Nope anymore. check this sample page vs the 404 homepage