Integrating Crafter CMS with GitHub

This section details how to create a new project in GitHub and then start a new project in Crafter CMS in a way that connects to GitHub as an upstream remote repository.

Create a New Project and Connect it to GitHub

Step 1: Create a Project in GitHub

How-Tos - Create a project in GitHub

Figure 1: Create a project in GitHub

  1. Select Blank Project to create a bare project

  2. Enter your project name

  3. Provide a project description

  4. Choose your security level

  5. Do not initialize the repository with a readme

  6. Click create repository

Once your repository is created you will see a screen similar to the one below. You want to make note of the Git URL for the site. You will need this URL in the next step.

How-Tos - New project in GitHub

Figure 2: New Project in GitHub

Step 2: Create Your Project In Crafter Studio

Next, you want to log in to Crafter Studio as the admin user. The admin user has the rights to create new projects (called sites.) Click Create Site.

How-Tos - Site screen in Crafter Studio

Figure 3: Create site via Crafter Studio

Clicking Create Site will present you with the Create Site dialog. This dialog changes depending on what you choose. Below is an example of the dialog filled out in a way that creates your project locally, set the Github repository as its upstream remote and pushes the initial project contents to the upstream repository.

Let’s walk through each part of the dialog:

Developer How Tos - Create Site Dialog Walk Through step 1
  1. The first thing you need to do is to choose your blueprint. There are several out of the box blueprints provided by default. Choose one of these or one of your own. For our example, we’ll choose the Website Editorial blueprint.

Developer How Tos - Create Site Dialog Walk Through step 2
  1. The next thing to do is give your site an ID. The ID itself doesn’t matter in a sense. It doesn’t need to match anything per se, technically speaking the only requirement is that it’s unique. That said, it’s a best practice to provide an ID that is meaningful/recognizable to the team. If your website is called FreshFlowers.com a good ID might be “freshflowerscom”

  2. Click on the Push the site to a remote repository after creation slider button to turn it on, which will display more fields where we can fill in all the information for our remote Git repository.

Developer How Tos - Create Site Dialog Walk Through step 4 - 8
  1. With the Push the site to a remote Git repository after creation slider in the on position, Crafter Studio will create a new site based on the blueprint you chose, link the remote repository as an upstream and then once the blueprint is installed in the local repositories it will be pushed automatically to the upstream remote.

  2. In the Git Repo URL field you must provide the link to the Git repository discussed in Step #1: https://github.org/myuser/mysweetdotcom.git

  3. Provide your credentials based on the authentication method selected. In our example, we chose Username & Password as the authentication method and we’ll need to fill in Username and Password

  4. In the Git Remote Name field you want to provide a repository name that makes sense. It’s common to use “origin” or “upstream.”

  5. Click Review. The next screen will give you a chance to review your entries and make corrections as needed by clicking on the Back button

Developer How Tos - Create Site Dialog Walk Through step 5
  1. Once you’re satisfied with your entries for creating your site, click on the Create Site button. Crafter CMS will create the local repositories, search index and internal data structures required to support the project and install the blueprint. Once complete it will connect to the upstream and push the contents of the Sandbox repository to the remote.

Developer How Tos - Site is created and the contents of the sandbox are automatically pushed to the upstream repository

Figure:: Site is created and the contents of the sandbox are automatically pushed to the upstream repository

Step 3: Check GitHub to Make Sure Your Site is There

Go back to your Github project and refresh the screen. You will see the contents of your CMS project in the repository.

How-Tos - Your project in GitHub

Your project is there!

Pushing and Pulling from the Remote Repository

Crafter Studio helps you manage and interact with your remote repositories via the user interface and via API. Using Crafter Studio’s remote repositories console, you can add any remotes to the project you like and sync with them via pull and push operations at any time.

Developer How-Tos - Pushing and Pulling from the Remote Repository

Now you are ready to set up your entire development process and CI/CD automation.

Creating a Project in Crafter CMS Based on an Existing GitHub Project

Let’s consider for a moment that you’re a new developer joining the team. The topology above is already set up and you just want to get a local environment up and going. Simple. Follow these instructions.

  1. Install Crafter Studio locally (Source build or Binaries bundle)

  2. Login as Admin

  3. Click Create Site

    Developer How Tos - Setting up to work locally against the upstream

  4. Fill out the Create Site Form as in a similar fashion described in Step 2 above, except this time, instead of selecting a blueprint, select the Remote Git Repository to create your site based on an existing upstream repository. This can be your team’s branch or your own fork. The exact workflow is up to you.

    Developer How Tos - Setting up to work locally against the upstream

    Developer How Tos - Setting up to work locally against the upstream review entries