The DatoCMS interface: main screen

The sidebar menu shows the structure of the website, divided into pages and subpages: the three horizontal lines indicate a page and let you change its order relative to the others. They resemble the hamburger menu found on websites, although here they serve a different purpose.  For pages  with an arrow in front of them, clicking the arrow opens a dropdown with the other subpages (also marked with a hamburger icon)

Above the sidebar menu, in the red bar, you'll find “Content” and “Media”. These let you switch between the site pages, with the blocks for managing your content, and the Media Area, where you'll find all your media files. 

We'll cover the Media Area in our next blog post.

Right below the red bar you'll find the name of the page you're working on.

At the bottom left you'll find the “build status” field. Every time you save and publish  content and want it to appear on your website, click there and choose “update the deploy”. After a few minutes, your site will be live with the changes. 

At the top left, instead, you'll find the status of your changes. It helps you see whether you've saved your content, whether it's a draft (gray dot), published (green dot) or updated (yellow dot). 

Below the page “status” you'll find a gear icon that lets you switch language if your site was built in multiple languages. The language of the section you're working on is also shown at the top center, highlighted in red.  If you want to know more about managing multilingual content, we covered it in another blog post.

Each page contains the blocks that make up its structure. Some are predefined, created during development, and those are the ones that aren't highlighted. 

The ones highlighted in gray, on the other hand, are the ones you can customize. To the left of each block you'll find a vertical three-dot menu that lets you add, move, delete, duplicate or expand blocks. 

How you enter content depends on the logic behind the blocks. For more details, we recommend reading our first article on DatoCMS training. 

To add a new block, you can also use the orange “+ add new block” button, which lets you choose from the available blocks. 

The edit and duplicate buttons usually look similar to the add button, while the delete button has a contrasting color. In the example shown, it's red. 

The asterisk marks a required field. If required fields are left empty, DatoCMS highlights them in red and won't let you save. The minimum required content is defined during development, so if you need more information, don't hesitate to contact the team that built your site.

Our hands-on guide to DatoCMS icons doesn't end here. We decided to split it into several parts to make it easier to consult. In the meantime, at the bottom of the article you'll find a summary legend of the icons covered so far.