Essas informações se aplicam apenas à experiência original.

Os temas são um elemento importante da interface de usuário (UI) para garantir uma aparência consistente e refletir um local específico. Eles podem ser editados para incorporar fontes e imagens culturais.

Você também pode adicionar imagens e alterar as cores da interface de usuário em outros locais:

  • Os administradores podem personalizar a configuração temática predefinida para reforçar a identidade cultural de uma instituição.
  • Os administradores podem usar o Catálogo da paleta e tema para alterar as cores usadas no Blackboard Learn.
  • Os professores podem usar a ferramenta Estilo do curso para personalizar os cursos, incluindo a adição de imagens de banner que reforçam o local.

Essa seção inclui informações detalhadas sobre como fazer o download e editar um tema, além de sugestões de ferramentas que podem ser usadas na edição.

Editar temas

Temas baixados do Blackboard Learn podem ser editados para alterar a aparência do sistema. Cada tema tem uma Folha de estilo em cascata (CSS) associada que determina a exibição da interface de usuário. Características como tipos e tamanhos de fonte, imagens de fundo e outros elementos XHTML são descritos pelo CSS. Ao usar o navegador da web Mozilla® Firefox® e um recurso adicional do Firefox chamado Firebug®, os usuários podem identificar facilmente elementos CSS individuais diretamente da interface de usuário.

Faça o download e instale a versão mais recente do Firefox e Firebug antes de tentar outros procedimentos.

Firefox e Firebug

O Firefox possui vários programas desenvolvidos por outras empresas. Um deles é chamado Firebug e é usado para editar, depurar e monitorar ambientes CSS, HTML e JavaScript em qualquer página da web. Um vez que os elementos foram identificados, o editor CSS pode ser utilizado para pesquisar os elementos e fazer alterações no CSS do tema.

Instalar o Firefox

  1. Acesse http://www.mozilla.com.
  2. (Opcional) Selecione seu idioma, caso ele não seja inglês.
  3. Selecione o botão verde de download.
  4. Siga as instruções de instalação.
  5. Abra o Firefox na sua área de trabalho.

Instalar o Firebug

  1. Abra o Firefox.
  2. Abra o menu Ferramentas e selecione Add-ons.
  3. Selecione Obter Add-ons.
  4. Digite Firebug na caixa de pesquisa e selecione Pesquisar.
  5. Selecione o ícone do Firebug.
  6. Selecione Instalar. O Firefox irá solicitar que você reinicie o navegador após a conclusão da instalação.
  7. Selecione Sim.

Usar o Firebug

Use o Firebug para examinar o CSS existente e identificar todos os elementos que precisam ser alterados.

  1. Abra o Firefox.
  2. Selecione o ícone do Firebug do lado direito na barra de status inferior.
  3. Selecione Inspecionar.
  4. Use o mouse para indicar a área de página que deseja inspecionar.
  5. Selecione a área para manter no lugar.
  6. Passe o mouse pelos elementos XHTML no console do Firebug.
  7. Selecione o nó XHTML para expandir ou minimizar a descrição do elemento XHTML.
  8. Veja o código ou classe CSS relevante para o elemento selecionado do lado direito no console do Firebug.
  9. Copie a classe ou o nome do código.
  10. Cole o nome do código ou classe em um editor CSS e pesquise o elemento.
  11. Faça as alterações necessárias.
  12. Salve o CSS quando concluir.

Baixar e editar o CSS de um tema

Quando os elementos CSS forem identificados, você poderá usar o CSS usando um editor de texto.

  1. Selecione Configurações temáticas e temas no Painel do administrador.
  2. Selecione Catálogo da paleta e tema.
  3. No tema apropriado, abra o menu e selecione Download.
  4. Salve o pacote ZIP.
  5. Abra o pacote ZIP e extraia o conteúdo.
  6. Abra o arquivo theme.css usando um editor de texto.
  7. Faça as alterações apropriadas e salve os arquivos CSS.
  8. Compacte o conteúdo novamente em um arquivo ZIP no seu computador local.
  9. Volte para o Painel do administrador e selecione Configurações temáticas e temas.
  10. Selecione Catálogo da paleta e tema.
  11. Selecione Criar tema.
  12. Dê um nome e um nome de referência ao tema. Opcionalmente, adicione uma descrição.
  13. Selecione Pesquisar Meu Computador para localizar o novo pacote ZIP.
  14. Selecione Enviar.

Exemplo de CSS

Veja a seguir um exemplo do tema Schoolhouse incluído no Blackboard Learn. As definições dos estilos de cabeçalho são exibidas neste exemplo, junto com a configuração de família de fontes.

* {font-family: Cursive, Georgia, Times, serif;}

/* a:focus { Remove o esboço do foco no Firefox (Mozilla) outline:none;

} */

img { /* Centraliza imagens verticalmente e define as bordas como 0 */

vertical-align:middle;

border:0px;

}

.hideme {

display:none!important;

}

h1 { /*Equals 19px*/

font-size:148%;

}

h2 {

font-size:123.1%;

}

h3 {

font-size:108%;

}

h1,h2,h3 {

margin:1em 0;

}

h1,h2,h3,h4,h5,h6,strong {

font-weight:bold;

}

Temas do sistema e temas do curso

Os temas do curso são apresentados no Service Pack 8 para permitir que os professores alterem a aparência de três cursos. Os temas do curso são separados dos temas do sistema. Para ativar os temas do curso para que os instrutores os utilizem em seu curso, acesse Painel do administrador > Configurações do curso > Temas e ícones do curso e marque a caixa Ativar temas do curso.

Saiba mais sobre como os instrutores usam os temas do curso

Um novo tema do sistema deve ter uma imagem PNG em miniatura nomeada após o nome de referência do tema do sistema. Se o arquivo estiver ausente, um símbolo de imagem ausente será exibido como padrão na lista de temas do curso. A maneira mais fácil de criar essa imagem no novo tema do sistema é renomear a imagem as_2012.png fornecida no tema as_2012 com o novo nome de referência do tema do sistema. Como a função da imagem é indicar que o tema do curso padrão está sendo usado e não mostrar a aparência do tema, renomear o arquivo evita que o símbolo de imagem ausente seja exibido na interface de usuário.

Temas do sistema personalizados e building blocks

Se você tiver um tema de sistema personalizado, talvez queira que suas personalizações se estendam para novas páginas em um building block. Nem todos os building blocks possuem suas próprias folhas de estilo específicas de ferramentas, mas alguns sim.

Informações sobre se o building block contém folhas de estilo de ferramentas específicas estão disponíveis no Painel do administrador. Na seção Integrações, selecione Building Blocks e selecione Ferramentas instaladas. Abra o menu de qualquer building block listado e selecione Ver Componentes. Se o Building Block tiver folhas de estilo de ferramentas específicas em qualquer um dos temas padrão do Learn, os identificadores do tema serão listados nessa página.