At the top of your Site is your Site Header in gray. This UI element displays key information about your Site on the left, such as Site icon, name, branch, and project, and important tools on the right, including the Avatar list, Testing Domain link, Configuration Mode switch, and Save button.
Some of these sections may not appear depending on your Site's configuration.
Site Header sections#
Site details#
On the left of your Site Header are your Site details, including the Site Icon, Site Name, Branch, and Project (if configured).
The Site Icon and Site Name enable you to identify the site you have open and help you distinguish between sites in the Sites Browser. The Branch tells you which branch of your Git repository this Site is connected to.
If your Site is part of a Project, the Branch and Project name will become a link. Clicking on the Project name will open the Project pop-up, allowing you to navigate to your Project page easily. For more information about the Projects, please read our documentation on Projects.
The Avatar list#
The first tool on the right side of your Site Header in the Avatar list displays the avatars for any team members active on your Site. Clicking on an avatar will display a list of files they have open, with an eye icon indicating files they are viewing and a pencil icon indicating files they are editing.
The Testing Domain link#
If your Site has a successful build, a link to your Testing Domain will appear in the Site Header. If you have a Custom Domain as well, the Open URL dropdown will appear instead, allowing you to choose which domain you want to open. For more information about hosting on a domain, please read our documentation on Testing Domains and Custom Domains.
The Configuration Mode switch#
If you want to customize the appearance and functionality of your Site, you can turn on Configuration Mode using the Configuration Mode switch in the Site Header. This will reveal purple Edit Configuration buttons that enable you to add content to your CloudCannon Configuration File. For more information, please read our documentation on Configuration Mode.
The Save button#
The Save button on the right of the Site Header allows you to save changes to your files. The Save button is also in the same place when you have any editing interface. For more information, please read our documentation on Saving your Changes.