Editors

Studio Editor

Learn how to browse and edit your content files on Nuxt Studio.

Notion like editor on Studio

Browse pages

When entering the Content tab of the Studio editor, you can browse your website pages. Your website architecture is represented by a tree structure with all your folder and files.

I'm currently editing the page located at https://nuxt.studio/docs/editors/content . In order to find this page on Studio, I need to go in docs folder then editors folder and finally open the content page.

Actions

From the tree you can achieve actions on your pages.

  • Create a page/folder
  • Delete a page/folder
  • Rename a page/folder
  • Revert a page/folder to its original value

Reorder navigation

You can reorder your pages in your navigation thanks to our drag & drop system. Change page position within the current folder or move it in another folder.

Edit a page

Browse through your folders and select the page you want to edit. If the live preview is open, you should be redirected to the corresponding page on your website.

There is a two way binding meaning that you can also click on the page you want to edit from the preview and the corresponding page should be opened in the editor.

Notion-like editor

Once you click on the page you want to edit, you'll be redirected to the page editor. It's an editor similar to Notion where you can even integrate custom block components. This is where you can take advantage of the customization, your developer can create complex blocks and let you edit them.

While editing, simply type / anywhere in the editor to access all Studio editor features including components, medias, text formatting...

Checkout this section for more info about the editor

Demo