Skip to content

SebbeJohansson/vrtx.ContentSystem

Repository files navigation

vrtx ContentSystem

Uses nuxt3 and storyblok.


Setup

Make sure to install the dependencies:

# yarn
yarn install

Storyblok

How to set up Vrtx.ContentSystem with Storyblok:

  1. Login to Storyblok CLI in your command line while in the project directory (make sure you have run yarn install first) - yarn storyblok login image
  2. Create a new Storyblok Space - yarn storyblok quickstart image
  3. Grab your new storyblok space id - yarn storyblok spaces
  4. Push the Vrtx.ContentSystem components to your new Storyblok space - yarn storyblok push-components --space {your-space-id} storyblok/components.vrtx.json
  5. Remove all the components that does not belong to vrtx.ContentSystem - yarn storyblok delete-components storyblok/components.vrtx.json --space {your-space-id} --reverse
  6. ???
  7. You are now ready to create content in Storyblok

(To update the component file, use yarn storyblok pull-components --space {your-space-id} to generate new files)


Development Server

Start the development server on http://localhost:3000

yarn run dev

Production

Build the application for production:

yarn run build

Locally preview production build:

yarn run preview

Creating Content

Storyblok

Home page

Since the home page requires some special care because of the fact that we cant have the root page have the slug "/" we need to have the slug as index.

  1. Create a new story with the type "Content Page".
  2. Name it anything.
  3. Put 'slug' as "index" - That way Vrtx.ContentSystem knows its the home page. image
  4. Add content.
  5. Publish.

Header Menu

Since menu is special it needs to be of the content type 'Menu' and have the 'slug' "menu" .

  1. Create a new story with the type "Menu".
  2. Name it anything.
  3. Put 'slug' as "menu" - That way Vrtx.ContentSystem knows its the menu. image
  4. Add a few departments (each department is a menu option).
  5. Publish.

Footer Menu

Since footer is special it needs to be of the content type 'Menu' and have the 'slug' "footer".

  1. Create a new story with the type "Menu".
  2. Name it anything.
  3. Put 'slug' as "footer" - That way Vrtx.ContentSystem knows its the footer. image
  4. Add a few departments (each department is a footer option).
  5. Publish.

Creating a private fork

Sometimes you might wanna create a private fork (even if the license and github don't allow it). The easiest way to create a private version is to use the template function: image image

The other option is to manually create a repo and add the repo as an upstream you can pull from. If you want to do that do this:

  1. Create an empty private repo.
  2. Clone the empty repo locally.
  3. Add Vrtx.ContentSystem repo as an upstream with: git remote add upstream https://github.com/SebbeJohansson/Vrtx.ContentSystem.git
  4. Disable pushing to upstream (since you are not allowed to do that either way): git remote set-url --push upstream DISABLE
  5. Pull main from the upstream: git pull upstream/main main
  6. Fix any potential merge issues.

Multi-CMS version

Go to the multi-cms branch to see the older version that were prepped for multiple cmses.