Because Unibit is a superset of existing static site generators you can convert a Unibit site into a Hugo, Jekyll or Gatsby site (with more static site generators being added soon).

Converting Unibit into other SSG's is done using Stackbit. But before we can import our theme into Stackbit we need to add a stackbit.yaml and define a content schema.

Defining a content model in the stackbit.yaml

Content models are defined in the stackbit.yaml - there are many available properties and I recommend you read over the Content Model documentation.

We need to define 2 new content models.

stackbitVersion: ~0.2.39
models:
  config:
    type: config
    label: Global Site Config
    fields:
      - type: string
        name: homepage_heading
        label: Homepage Heading
        description: The title displayed on the homepage.
  home:
    type: page
    label: Home
    template: home
    file: index.md
    singleInstance: true
    fields:
      - type: string
        name: title
        label: Title
        description: The title of the page.
        required: true
      - type: string
        name: sub_heading
        label: Sub Heading
        description: a subheading of the page.

Validating the content model

Before we import the theme and convert it we need to validate the Content Model using Unbit CLI.

unibit validate

Hopefully all the tests are passing. If so we are ready to import the custom theme into Stackbit.

Importing into Stackbit

Create a new Github Repo

At this stage, Stackbit can only import themes from Github. So you will need to create a new repository on your Github account and push your custom theme.

Import with Stackbit Via the Dashboard

  1. Create a Stackbit account
  2. Create a new project
  3. In the top corner where it says "Use Your Own Theme" click the Learn More link
  4. Paste the Github URL of your Unibit theme into the importer and then follow the steps to convert it.

Import with Stackbit Using Wizard Link

https://app.stackbit.com/wizard?privateThemeUrl=https://github.com/USERNAME/REPONAME&theme=custom

Import Custom Theme Screenshot

Troubleshooting importing

If you have only just created a Stackbit account you may see the following error when importing.

Can't connect to your repo. Please make sure it's public, or that Stackbit has the permissions required to access it. Retry Approving Permissions >

Normally this means you need to connect your Github account with Stackbit. Click the "Retry Approving Permissions" link and it should prompt you to authorize Stackbit with your Github.

Select a Static Site Generator

In the stackbit dashboard, select a static site generator you would like to convert to. For this tutorial we will choose "Hugo".

Select a CMS

For the CMS choose "No CMS"

Deploy Your Site

Once you have selected a SSG and CMS, you can click "connect accounts". Your Github account should already be authorized. Click "Create Project".

The converted site will be available on your Github in a new repo. I encourage you to clone it and take a look at the code, its a Hugo site!