Sulu CMS Admin Panel Owerview

This article is the beginning of a three-part series of tutorials that will describe the admin panels we develop for our projects. This one describes the admin panel of an information website based on ours.

Our website is built on sulu cms, a content management system based on the Symfony framework.

The admin panel has several main sections: page management (web space), snippets, media management, users, and settings. We have also developed a separate module that collects all feedback from the website.

This module is the main one in the admin panel, because the basic content is edited in it. On the screenshot, you can see that there are three columns on the page: the first one contains only one element - Skylex. This is your website, and you can edit the content of the main page here. You can have several websites that will be managed from one admin panel, we currently have only one. The next column contains a list of next-level pages, for example, "About Us" and so on, as many subpages as you need.

The system automatically understands how pages are nested within each other and generates page breadcrumbs and URLs accordingly.

You can also see that there is a switch between languages in the upper right corner. SUlu cms allows you to add several language versions for each website, and you can customize your links for each of them. For example, for the "About us" page for the Ukrainian version of the site, the link will be "/pro-nas", but if you add an English version, the link to the "About us" page may be different - "/en/about-us". The prefix "/en" can be any, but it must be unique for one localization.

To customize the page, you can use additional actions: SEO, Extraction and taxonomy, Settings, Access rights, Event.

The content of the page is edited within blocks. In general, the very idea of sulu cms is that all content in the admin panel can be presented in separate blocks. There can be a lot of different blocks, they can be a part of other ones, they can be added to the lists of blocks. Within one block you can use many different widgets, for example, "text fields", "single page selection", "multiple media selection", "text with editor", and you can create your own lists with your own data in them. By combining all these features, we create an admin panel that does not require any programming knowledge from the content manager, no understanding of HTML or CSS, no knowledge of how FTP works, because everything is done as simply as possible with the mouse. This gives developers a clearer project markup, which reduces the number of errors and "file polishing". In the picture below you can see how many blocks we have on our website. For example, in the Aquamen project, there are 56 such blocks, and some of them contain other ones, but none of the content on the Aquamen website is edited through code, everything is done with the mouse.

Websites often have information that is repeated on every page. For example, information about opening hours, address, phone number, and a link to the User Agreement. For this purpose, we use snippets. This is a separate type of blocks on the website where you can customize the content in the same way as the page content. Then the information from the snippets will be used on all pages. Snippet content, just like page content, can be translated into several language versions of the website.

The Media module is designed to manage all static content on the website - images, videos, documents.

This module has the ability to update a picture or document, i.e. change its version, which allows you to automatically change the version of the file on the entire website. The file will be automatically updated in all places where it is used. You can view the history of changes for each file.

We can develop informational websites with user-friendly admin panels that allow administrators to manage content in a comfortable and understandable way. Our websites are SEO optimized and have all the necessary tools to manage SEO optimization.