---
title: "Branding Editor"
slug: "branding-editor"
updated: 2026-05-21T16:24:07Z
published: 2026-05-21T16:24:07Z
---
> ## Documentation Index
> Fetch the complete documentation index at: https://knowledge.technolutions.net/llms.txt
> Use this file to discover all available pages before exploring further.
# Branding Editor
> [!WARNING]
> ☑️ Prerequisite Skills
>
> [Branding in Slate](/v1/docs/branding-in-slate)
The **Branding Editor** enables editing and previewing Slate branding while keeping current branding files unchanged. As you create and maintain a consistent brand identity across all of your Slate pages, you can test new branding ideas before you implement them in production.
Use the Branding Editor to:
- Change your logo, colors, or fonts
- Update your header and footer designs
- Add new branding elements to your pages
- Test different branding layouts
- Create custom branding for specific portals or pages
#### ▶️ Branding Editor in action
#### **Upload and Edit Branding**
#### **Impersonate a Record**
#### **Preview New Branding**
## Accessing the Branding Editor
To access the Branding Editor:
1. Select **Database** from the Slate navigation bar.
2. In the **Branding** section, locate and select **Branding Editor**.
## Using the Branding Editor
> [!WARNING]
> 📝 Note
>
> Make changes in the Branding Editor in your **test environment** before publishing anything in production. Need to roll any changes back? [Use the Files feature’s Version History tool.](/v1/docs/branding-editor#publish-changes)
To edit Slate branding in the Branding Editor:
1. Click **Import Current** to load existing branding files.
2. Make edits to the files as needed.
3. Click **Save.**
4. Click **Preview**.
5. Select a record to impersonate and review your changes.
6. When all the changes have been made and approved, click **Publish Changes** to update the files in the environment you are working in.
### Files
The Files list at left displays any files located in the **dev**folder of **Database > Files**.
To delete a file, click the to the ❌ to the right of the file name. Click **OK** in the system dialog to confirm deletion.
The files you see in the **Branding Editor** are pulled from the files in **Files > dev**.
### New
Click **New** to create an empty file. A prompt appears to enter a file name. Click **Create** to create a new blank file. The file is saved to the **dev**folder in **Database > Files**.
To edit a file in the Branding Editor, it must have one of the following extensions:
- .css
- .xslt
- .html
.png)
### Save
Saves changes to the current file.
### Preview
Preview your branding. A popup appears with two fields, **URL** and **Preview as**:
- The **URL**field is pre-populated with `/apply`. Update this field with a page you’d like to see your branding changes reflected on. Example URLs might include:
- `/register`
- `/register/<FORM_URL>`
- Optionally, enter the name of a record in the **Preview as**field to impersonate them.
When you click **Preview**, a new tab opens displaying the URL you entered. A banner indicates you are impersonating your selected record in Development Mode, meaning dev styles are being applied.
Any subsequent pages opened from within the preview will also be in Development Mode until you click the **Dismiss** link. For example, if a form is opened, it will also display with dev branding.
.png)
### Upload
Upload branding files from an external source, including text files or a live webpage.
Click **Upload**and a popup appears with two options for Type, **URL**or **File:**
#### URL (Branding Wizard)
Also known as the **Branding Wizard**, this feature lets you pull branding files into Slate from a website you operate.
To use the Branding Wizard:
1. Publish a page on your institutional website that contains the following code:
```xml
SLATE GOES HERE
```
2. Copy the URL of the page.
3. Paste the URL in the URL field.
4. Click **Upload.**
#### **File**
Select an existing local file to upload to the dev folder to be edited.
> [!WARNING]
> 📝 Note
>
> You may not overwrite an existing file via upload. Attempting to upload a file with the same name as a file already in the dev directory will cause an error message to appear. Delete the existing file by clicking ❌ prior to uploading a new version with the same name.
>
> [](https://cdn.us.document360.io/cd8ea7a6-07f3-4846-a554-627ac016d3e3/Images/Documentation/4412236689819.png)
### Import Current
Copies all files currently in the **share** folder in Files to the **dev** folder for editing.
> [!CAUTION]
> 🔔 Important!
>
> This will **overwrite** the files that currently exist in the dev folder, and any edits will be lost.
### Publish Changes
Copies all the files in the **dev** folder and writes them to the **shared** folder in Files, ***overwriting any existing files with the same names.*** The dev files are not removed.
[](https://cdn.us.document360.io/cd8ea7a6-07f3-4846-a554-627ac016d3e3/Images/Documentation/4412452932379.png)
## CSS file caching
The CSS files are cached on the server, and therefore changes made to build.css will not be immediately visible. To force an update to the file cache, edit the build.XSLT file and update the version parameter in the reference link to the build.css file:
```xml
```
Updating the timestamp will trigger a change to the file version. Please note that you may need to allow up to 15 minutes for the updated file to propagate across all production nodes, and you may need to wait a bit longer (sometimes up to 24 hours) for your browser to expire the cached files.
#### Version Control
To roll back published changes:
1. Go to **Database > Files.**
2. In the **dev**folder, select a file that you want to revert.
3. At bottom right, select **Version History.**A list of file versions appears.
4. Select the version to be reverted to.
5. Select **Revert.**Confirm the system dialog.
6. Select **Save.**
The file in the Branding Editor is reverted accordingly.
### Exit
Returns to **Database**.