Get started with Brandguide

Welcome to the new Brandguide experience!

This article, as well asBrandguide Building and Stylingand使用CSS Brandguide定制,will walk you through how to migrate your content to the new experience.

Editing capabilities on your existing Brandguide will be going away on September 1, 2023. On December 1, 2023, the legacy Brandguide editor will no longer be available.

Creating a Brandguide

Brandguides can be created in three ways.

1. At the organization level, from the Create New block.
2. At the Brandfolder level by selecting + New Brandguide.
3. At the Collection level by selecting+ New Brandguide.

组织级别创建

1. Once you select, Create New, a modal with options will appear.
2. Choose the Brandfolder or Collection you want your Brandguide to associate with. The Brandfolder or Collection that you choose determines the colors and images you can use in your Brandguide.Do note:the associated Brandfolder or Collection cannot be altered after creation.
3. Name your Brandguide.
4. Create a unique value for your Brandguide slug.
5. Determine your privacy settings. A Brandguide can be set to public or private.
   • Public mode allows for the public-facing URL to be accessed by anyone.
   • Private mode allows users with specific permissions to access and edit the guide, but the URL will remain inaccessible to others.
6. Select Create Brandguide.

Brandfolder and collection level creation

Use the steps outlined in the Organization Level Creation section, with the exception of choosing the Brandfolder or Collection to associate the Brandguide. Instead, the Brandguide will be associated with whatever Brandfolder or Collection you select + Create New Brandguide from.

一旦Brandguide created, you will be able to access it from the organization level, or through the Brandguide drop-down at the Brandfolder and Collection level. Brandguides will appear in the dropdown of the Brandfolder or Collection that the Brandguide was created from.

Edit and preview mode

一旦Brandguide created you can view it in edit and preview modes. In the top right hand corner, you will find aPreview button. In Preview mode in the top left-hand corner, you will find anEdit [Brandguide Name] button.

• Edit modeallows you to add blocks of content and customize Brandguide settings.
• Preview modedemonstrates how the Brandguide will appear for those viewing the Brandguide publicly.

Saving Brandguides

Brandguide will automatically save changes for you. This is denoted by theSaved!popup will appear at the bottom of your screen after you make changes. This means that all changes to the Brandguide will appear in the public version. At this time, drafts are not supported however, you can put your Brandguide in private mode if you do not want to publish your changes.

Terms:

• Canvas:the main editable area where users can drag and drop content onto the page.
• Sidebar:the navigation bar on the side of Brandguide that contains blocks, pages, and settings.
• Flyout:the menu that houses blocks and appears from the sidebar navigation.
• Block:combine to create sections. They can be added via the sidebar or canvas areas.
• Section:combine to create pages. Blocks live within sections.
• Pages:When pages are combined, they make a Brandguide.
• Header image:the image that appears at the top of the Brandguide.

Brandguide permissions

	Public View	Private View	Can Edit	Can Create	Can Delete
Anonymous	✔️
Guest	✔️	✔️
Collaborator	✔️	✔️
Admin	✔️	✔️	✔️	✔️	✔️
Owner	✔️	✔️	✔️	✔️	✔️

Settings

On the sidebar, select the gear icon to access global Brandguide settings.

Background color

Select a background color by inputting a hex code or using the color selector.

Default typeface and color

Selecting a default typeface and color will change all text on the Brandguide unless you make a block-level specification.

Adding a favicon and header CDN URL

You can add a favicon or header to your Brandguide by copying and pasting a CDN link from an asset in Brandfolder. Favicon file size must be 16x16px, and the recommended header size is 2880x720px.

There are two ways to acquire the CDN link.

The first option is via your Brandfolder.

1. Navigate to your Brandfolder, locate the asset, and open its asset modal.
2. Selectthe embed tab(if you do not see this option, reach out tosupport@brandfolder.comto have it added to your account)
3. Copythe Attachment CDN link.
4. Pastethe URL into the favicon CDN URL or header CDN URL text input.

The second option is via the image flyout in Brandguide

1. Open the image flyout
2. Locate the asset andselect the ellipsis menuandchooseView asset details.
3. Locate the CDN embed link options section, and selectCopy Link.
4. Pastethe URL into the favicon CDN URL or header CDN URL text input.

CSS

Please visit theBrandguide Customization using CSSarticle for details.

User Management

Click the link in this section to be redirected to the Brandfolder User Management interface. Users must be provisioned access to the Brandguide directly. Users are not automatically added even if they have access to the Brandfolder or Collection the Brandguide is associated with.

Brandguide Management

Admins can modify or delete your Brandguide on the organization page. Hover over the Brandguide card and select the ellipses menu. This will bring up three options: Edit, Settings, and Delete Brandguide.

If you selectDelete Brandguide, your Brandguide will be deleted, and there is no way to undo this action.SelectingSettings会让你to modify the name of the Brandguide, URL, Privacy settings, and Card Image.

Brandguide migration video

Video file