Como administrador, você pode usar o Editor de Temas para criar temas personalizados para sua instituição. Os temas são criados a partir de modelos existentes do Canvas. Qualquer tema aplicado à conta também se aplica a todas as subcontas, embora o Editor de Temas também possa ser usado para criar temas para subcontas individuais. Depois de criar e salvar um tema, você pode aplicá-lo à sua conta a qualquer momento. Você também pode criar novos temas com base em temas anteriores. Saiba como gerenciar temas salvos .
Veja um vídeo sobre o Editor de Temas .
Herança de Temas
A personalização da marca é feita no nível da conta e, por padrão, as subcontas e seus respectivos cursos herdam a identidade visual da conta. No entanto, você pode habilitar o Editor de Temas para subcontas ; quaisquer elementos que não forem especificamente alterados ainda serão herdados pela conta.
As matrículas de usuários são associadas ao nível da conta e as matrículas em cursos são associadas ao nível da subconta. Uma matrícula é criada quando um usuário e um curso são vinculados. Se um usuário não estiver matriculado em nenhum curso, o Painel exibirá a identidade visual da conta. Esse algoritmo também se aplica a páginas não associadas a um curso, incluindo a conta e as configurações do usuário, o Calendário e as Conversas. Os dados do usuário são sempre hospedados no nível da conta, motivo pelo qual não podem herdar a identidade visual da subconta.
Se um usuário estiver matriculado em um curso na conta, o Painel exibirá a identidade visual da conta. Se um usuário estiver matriculado em um curso dentro de uma subconta, o Painel exibirá a identidade visual da subconta. Se um usuário estiver matriculado em cursos em várias subcontas, ou se um dos cursos estiver na conta, o Painel exibirá a identidade visual da conta.
Componentes do Editor de Temas
Para obter detalhes sobre os componentes do Editor de Temas, incluindo os componentes exibidos em aplicativos Canvas, consulte o documento de recursos Componentes do Editor de Temas do Canvas . Para obter ajuda com modelos de imagem, consulte o documento de recursos Modelos de Imagem do Editor de Temas do Canvas . Logotipos, imagens e marcas d'água não são visíveis para usuários que ativam a opção Estilos de Alto Contraste nas configurações do usuário.
Arquivos CSS/JS
Não é obrigatório o uso de arquivos CSS (folhas de estilo em cascata) ou JavaScript (JS) personalizados, mas arquivos de sobrescrita também são suportados no Editor de Temas. A funcionalidade de arquivos CSS/JS deve ser habilitada pelo seu Gerente de Sucesso do Cliente. Antes de enviar arquivos CSS ou JS personalizados, esteja ciente dos riscos associados, pois esses arquivos podem causar problemas de acessibilidade ou conflitos com futuras atualizações do Canvas. Saiba mais sobre as restrições de CSS/JS personalizados .
Notas:
- O Editor de Temas não está disponível para contas gratuitas para professores.
- Se você for administrador de uma subconta e o link "Temas" não estiver visível na Navegação da Conta, significa que os Temas não foram habilitados para subcontas. Se a aba "Upload de CSS/JS" não estiver visível, significa que o upload de arquivos não foi habilitado para subcontas.
- Para visualizar a personalização do Editor de Temas, você precisa desativar a opção Interface de Alto Contraste.
- Por padrão, as contas filhas do consórcio herdam o tema aplicado na conta principal. No entanto, uma conta filha do consórcio pode criar um novo tema para a conta filha.
Abrir conta
Na Navegação Global, clique no link Admin [1] e, em seguida, clique no nome da conta [2].
Temas abertos
Na Navegação da Conta, clique no link Temas .
Observação: Se os temas de subconta estiverem ativados, cada subconta também incluirá um link "Temas" . Para abrir o Editor de Temas de uma subconta, clique no link "Subcontas" para localizar e abrir a subconta e, em seguida, clique no link "Temas" da subconta.
Modelo de tema aberto
Se você ainda não possui um tema Canvas para sua conta, use um modelo para criar um novo tema. Você pode escolher entre o modelo Canvas padrão, um modelo minimalista e um modelo State U. Se o seu Gerente de Sucesso do Cliente tiver habilitado a opção de recurso específica para o Ensino Fundamental e Médio (K12), o Tema K12 também aparecerá como um modelo.
Para criar um novo tema, passe o cursor sobre um modelo e clique no botão Abrir no Editor de Temas [1], ou clique no botão Adicionar Tema [2] e selecione um modelo da lista.
Abrir tema salvo
Se você criou e salvou um tema anteriormente, pode editá-lo a qualquer momento. Os temas salvos são exibidos na seção Meus Temas. Para abrir um tema salvo, passe o mouse sobre o nome do tema e clique no botão Abrir no Editor de Temas [1].
Para criar um novo tema baseado em um tema salvo, clique no botão Adicionar tema [2] e selecione o nome do tema salvo na lista [3]. Esta opção ajuda você a evitar sobrescrever seu tema salvo anteriormente.
Visualizar Editor de Temas
O Editor de Temas exibe uma página de exemplo para que você possa visualizar sua identidade visual personalizada. Esses componentes serão alterados de acordo com as cores e a identidade visual que você adicionar usando o Editor de Temas.
Exibir guia de upload de CSS/JS
Se arquivos de estilo em cascata (CSS) ou JavaScript (JS) personalizados tiverem sido habilitados para sua conta, a barra lateral do Editor de Temas exibirá uma guia Editar [1] e uma guia Carregar [2]. O Editor de Temas abre por padrão na guia Editar e exibe todos os componentes do Editor de Temas. A guia Carregar permite que você carregue arquivos personalizados.
Localizar componentes
O Editor de Temas possui quatro grupos de componentes: Identidade Visual Global, Navegação Global, Marcas d'água e Outras Imagens e Tela de Login. Por padrão, a barra lateral do Editor de Temas exibe o grupo Identidade Visual Global.
Localize o componente que deseja personalizar. Você pode expandir e recolher os grupos clicando no ícone de seta ao lado do título do grupo.
Selecionar cor via CSS
O valor padrão de cada componente aparece esmaecido no campo de texto.
Para especificar um componente de cor, localize o campo de texto do componente e insira uma nova cor CSS. Você pode inserir cores por meio de código hexadecimal, valor RGB ou nome de cor válido.
Observação: as cores inseridas serão convertidas e exibidas como códigos hexadecimais.
Selecione a cor através do Seletor de Cores.
Em navegadores que suportam campos de cor nativos , o seletor de cores pode ser usado para escolher um valor. Localize o componente e clique na caixa de cor. O seletor de cores aparecerá em uma nova janela.
Selecione a cor
Selecione uma cor na janela de seleção de cores [1]. Assim que uma cor for selecionada, o componente exibirá a nova cor na caixa [2]. A cor hexadecimal do componente também será atualizada com o novo valor da cor.
Adicionar imagens
Para componentes que requerem imagens, localize o componente e clique no link Selecionar Imagem . A descrição da imagem incluirá os tipos de arquivo suportados.
Tema de pré-visualização
Para pré-visualizar o seu tema, clique no botão "Pré-visualizar as suas alterações" .
O Canvas irá gerar uma pré-visualização dos componentes com base nas alterações feitas no seu modelo. Se necessário, faça alterações adicionais e visualize o tema novamente.
Salvar tema
Quando estiver satisfeito com as alterações no seu modelo, salve o tema clicando no botão Salvar Tema .
Criar nome do tema
Se você modificou um tema a partir de um modelo, o Editor de Temas cria uma cópia do tema. Os modelos não podem ser editados diretamente. No campo Nome do Tema [1], insira um nome para o seu tema. Clique no botão Salvar Tema [2].
Observação: Se você editou um tema salvo anteriormente, salvar o tema sobrescreve a versão anterior, mantendo o mesmo nome.
Aplicar tema
Para aplicar o tema à sua conta, clique no botão Aplicar tema [1].
Para sair do tema e retornar à página de Temas, clique no botão Sair [2]. Você pode abrir o tema e aplicá-lo à sua conta a qualquer momento.
Para aplicar o tema a toda a sua conta, clique no botão OK [1]. Para retornar ao Editor de Temas, clique no botão Cancelar [2].
Observação: Se sua conta permitir que subcontas personalizem seus próprios temas, quaisquer alterações aplicáveis feitas por você também serão aplicadas a todas as subcontas associadas. O Canvas mostra o status das atualizações do Editor de Temas; quando o processo para cada subconta for concluído, a subconta desaparecerá da janela de progresso. Quando todas as subcontas forem atualizadas, o Editor de Temas redirecionará você de volta para a página de Temas.
