Site Studio provides low-code site building tools for creating the front-end of your website. These tools are commonly used by site builders and developers in a development environment. For detailed information, see the Site Studio documentation.
The following table lists the main site building tools provided by Site Studio:
| Tool | Description | Reference |
|---|---|---|
| Style builder | Provides a low-code interface for creating CSS styles. You can use this tool to create styles for base html elements and custom classes. | See Style builder. |
| Component builder | Provides a low-code interface for building drag and drop components. It includes the components display and the form used by content authors to add content to the component. | See Components. |
| Content template builder | Provides a low-code interface for building display templates for Drupal content entities such as content types, taxonomy vocabularies, and users. You can use this tool to build templates for all display modes of the content, such as full page displays and teaser displays. | See Content templates. |
| Master template builder | Provides a low-code interface for building site level templates that typically contain the site header and footer. | See Master templates. |
| Menu template builder | Provides a low-code interface for building navigation systems for Drupal menus. You can use this tool to create static and interactive menus. | See Menu templates. |
| View template builder | Provides a low-code interface for building displays for Drupal views. Views are commonly used for displaying lists or grids of content or search result listings. You can use this tool to create the displays of views that include filters and pagination. | See View templates. |
| Color palette manager | Provides a low-code interface for managing the color palette of your site. Colors can be named and tagged so that they can be managed and updated across your site from a single interface. | See Creating your color palette. |
| Font libraries manager | Provides a low-code interface for managing your site’s fonts. You can import fonts or upload them as files. You can use this tool to set up one or multiple font stacks. You can manage and update fonts across your site from a single interface. | See Setting up font libraries and font stacks. |
| Icon font libraries manager | Provides a low-code interface for managing the icon fonts on your site. You can import icon fonts or upload them as files. You can manage and update icon fonts across your site from a single interface. | See Set up icon font libraries. |
| Responsive grid manager | Provides a low-code interface for managing the grid and responsive breakpoints on your site. You can use this tool to configure up to six different breakpoints for different device widths. You can also adjust the behavior of the columns of your site and the spacing between them. | See Configuring your responsive grid. |
| Style guide manager and style guides | Provides a low-code interface for creating overrides for site styling that can be applied at a theme level. Style guides are commonly used on multisite applications where a single code base and Site Studio theme must have different visual styling attributes for different sites. | See Style guide manager. |
| Sync package manager | Enables developers to package Site Studio configuration for deployment. This tool must be used for deploying Site Studio configuration packages separately from Drupal standard configuration. | See Configuration management and deployment. |