Soluções de identidade visual de site do SharePoint e de personalização de página
É possível personalizar a aparência de um site do SharePoint de duas formas:
Usando o mecanismo de temas para criar temas personalizados (aparências compostas no SharePoint e no SharePoint Online). No mínimo, os temas definem as cores. Um tema completo define as cores, fontes, uma imagem de fundo, a página mestra associada e um arquivo .preview que define como a página mestra será visualizada. É possível usar o padrão de provisionamento remoto para aplicar temas a sites.
Criando folhas de estilo em cascata (CSS) personalizadas para aplicar a sites do SharePoint Online. Use um suplemento do SharePoint e o padrão de provisionamento remoto a fim de provisionar sites do SharePoint para usar CSS personalizado.
Importante
Essas opções de extensibilidade estão disponíveis apenas para experiências clássicas do SharePoint. Você não pode usar essas opções com experiências modernas no SharePoint Online, como nos sites de comunicação.
As alterações de identidade visual vão das mais simples e baratas a mais caras e complexas. É possível usar a interface de usuário para aplicar aparências compostas, o que inclui uma imagem de plano de fundo, uma paleta de cores, fontes, uma página mestra e um arquivo .preview associado para a página mestra. Use o mecanismo de temas do SharePoint para projetar aparências compostas e provisionar sites, assim você poderá criar CSSs personalizados para alterar a aparência do seu site e dos elementos dele.
Importante
Apesar de ser possível criar páginas mestras e outros elementos estruturais personalizados como parte de um projeto de identidade visual personalizado, os custos de manutenção em longo prazo para isso são muito altos. A identidade visual personalizada pode fazer com que sua organização gaste mais para aplicar atualizações e oferecer suporte contínuo.
Esta seção parte de seu conhecimento prévio sobre as ferramentas e práticas de design e desenvolvimento no SharePoint para mostrar como é possível personalizar a aparência de um site do SharePoint.
Termos e conceitos
Tabela 1. Principais termos e conceitos relacionados à identidade visual do SharePoint
| Termo ou conceito | Definição | Mais informações |
|---|---|---|
| CSS alternativo | Um arquivo CSS diferente do padrão que pode ser aplicado à aparência do seu site. | Use o CSS alternativo para aplicar um CSS personalizado a um site e a todos os seus subsites. |
| CSS | Uma linguagem que informa a um navegador como processar os estilos de documentos em HTML ou XML. O CSS separa o conteúdo do documento (HTML ou XML) de como o conteúdo é apresentado. | |
| Aparência composta | Uma combinação de fontes, paleta de cores, imagem de plano de fundo e página mestra associada que é aplicada ao site. Esquemas de fonte e imagens coloridas são opcionais. Este é o local de arquivo padrão para aparências compostas: Theme Gallery\15 folder | Aparências compostas são uma maneira conveniente de alterar a aparência dos sites sem fazer alterações na estrutura de um site. O SharePoint contém várias aparências compostas por padrão. Quando um usuário aplica uma aparência composta, o SharePoint aplica todos os elementos de design associados à aparência composta ao site. |
| Web Part de Pesquisa de Conteúdo | Renderiza o conteúdo dos resultados da pesquisa com base em uma consulta especificada. | Web Part de Pesquisa de Conteúdo no SharePoint |
| corev15.css | O arquivo CSS que contém a maioria dos principais recursos do SharePoint. A seguir está o local do arquivo padrão: _layouts\15 pasta | |
| CSSRegistration | Uma referência na página mestra, como seattle.master, que carrega a maioria dos CSSs que são aplicados à maioria das interfaces de usuário padrão. | Use o controle CSSRegistration em uma página mestra para substituir o CSS padrão. |
| Ação personalizada | Ações que podem ser usadas para personalizar e interagir com listas e com a faixa de opções no webhost. | Criar ações personalizadas para implantação com Suplementos do SharePoint |
| Canais de dispositivo | Processa um único site de publicação do SharePoint de várias maneiras usando canais exclusivos para adequar o conteúdo processado a dispositivos específicos. | Canais de dispositivo do Gerenciador de Design do SharePoint |
| Modelos de exibição | Modelos usados por Web Parts de Pesquisa para mostrar os resultados de uma consulta feita ao índice de pesquisa. | Modelos de exibição do Gerenciador de Design do SharePoint |
| Representação de imagem | Exiba imagens de tamanhos diferentes em um site de publicação com base na mesma imagem original. | Reprodução de imagens do Gerenciador de Design do SharePoint |
| Metadados gerenciados | Recursos no SharePoint que possibilitam definir termos, conjuntos de termos, grupos e etiquetas para termos. Às vezes, isso é chamado de taxonomia. No SharePoint, o sistema de metadados gerenciados é a base para a navegação gerenciada. | Metadados e navegação gerenciados no SharePoint |
| Navegação gerenciada | Navegação para sites de publicação criada com base em metadados gerenciados. A navegação é criada a partir de um conjunto de termos especificado no repositório de termos. | Navegação gerenciada no SharePoint |
| Página mestra | Uma página que padroniza o comportamento e a apresentação das áreas de navegação à esquerda e à direita em uma página do SharePoint. | Páginas mestras, Galeria de Páginas Mestras e layouts do SharePoint |
| Galeria de Páginas Mestras | Uma biblioteca especial de documentos no SharePoint, em que todos os elementos de identidade visual (páginas mestras, layouts de página, arquivos JavaScript, CSS e imagens) são armazenados por padrão. Cada site tem sua própria Galeria de Páginas Mestras. Ao criar elementos de identidade visual personalizados, recomendamos armazenar os ativos personalizados na estrutura de arquivos da Galeria de Páginas Mestras padrão. | Páginas mestras, Galeria de Páginas Mestras e layouts do SharePoint |
| Oslo.master | Uma página mestra no SharePoint. | Move a navegação atual para a mesma posição que a região de navegação superior. |
| Controle de conteúdo de página | Um controle em um site de publicação em que uma Web Part pode ser adicionada. | |
| Layout de página | Um modelo de uma página de site de publicação do SharePoint que possibilita aos usuários apresentar informações na página de forma consistente. | |
| Inicialização rápida | Gerencia os elementos de navegação no lado esquerdo da página de um site de colaboração. | É possível adicionar links de cabeçalho aos itens de navegação do grupo. |
| REST | Um estilo de arquitetura sem estados que remove os elementos da arquitetura e usa verbos HTTP para ler e gravar dados de páginas da Web que contêm arquivos XML. | Conheça o serviço REST do SharePoint |
| Web raiz | A primeira página da Web em um conjunto de sites. | A página raiz também é, por vezes, conhecida como Raiz do aplicativo Web. |
| Seattle.master | A página mestra padrão de sites de equipe e sites de publicação do SharePoint. | |
| Layout do site | Consulte Página mestra. | O layout do site combina a página mestra de um tema com seu arquivo .preview correspondente. |
| Navegação estruturada | Uma estrutura de navegação para sites de publicação baseada na hierarquia do site do site de publicação. É possível adicionar cabeçalhos e links para substituir ou personalizar manualmente a navegação estruturada que o SharePoint gera automaticamente. | Como personalizar a navegação no SharePoint Server 2010 (ECM) |
| Tema | Uma maneira descomplicada de aplicar identidade visual simples a um site do SharePoint. O local de arquivo padrão para temas é a pasta _themes do site. | Os temas são uma maneira descomplicada de aplicar identidade visual personalizada a sites do SharePoint. - Visão geral de temas para o SharePoint - Implantar um tema personalizado no SharePoint |
| Mecanismo de temas | Um conjunto de arquivos e recursos que define a aparência, o comportamento e as associações de arquivos de aparências compostas. | |
| Cadeia de caracteres de agente do usuário. | Informações que um navegador passa para um site que identificam o software que faz a solicitação do servidor. | Gerenciador de identidade visual de design do SharePoint e recursos de design |
| Ação personalizada do usuário | Uma propriedade CSOM que retorna o conjunto de ações personalizadas para um site, uma lista ou um conjunto de sites. O local do arquivo padrão é: 15\TEMPLATE\FEATURES Por exemplo: <HideCustomAction GroupId="Galleries" HideActionId="Themes" Location="Microsoft.SharePoint.SiteSettings"> |
- Classe UserCustomAction - Criar ações personalizadas para implantação com Suplementos do SharePoint - Como trabalhar com ações personalizadas do usuário - IDs e locais de ação personalizada padrão |
Nesta seção
| Artigo | Mostra como... |
|---|---|
| Usar a aparência composta para aplicar identidade visual aos sites do SharePoint | Aplicar aparências compostas, incluindo cores, fontes e uma imagem de plano de fundo, a sites do SharePoint e SharePoint Online. |
| Usar provisionamento remoto para identidade visual de páginas do SharePoint | Use o provisionamento remoto para interagir com temas no SharePoint. |
| Usar a CSS em páginas de identidade visual do SharePoint | Use o provisionamento remoto para interagir com temas no SharePoint. |
| Personalizar uma página do SharePoint usando provisionamento remoto e CSS | Use CSS para personalizar campos rich text e zonas de Web Parts do SharePoint. |
| Atualizar a identidade visual de sites e regiões de página existentes do SharePoint | Personalize e atualize a identidade visual de sites existentes do SharePoint ou de regiões de páginas do SharePoint, incluindo a faixa de opções, a navegação no site, o menu Configurações, o modo de exibição de árvore e o conteúdo da página. |
| Personalizar os sites do OneDrive for Business | Personalize a identidade visual dos sites do OneDrive for Business no Office 365 ou com o uso do modelo de suplemento, dependendo dos requisitos da sua organização. |
Confira também
- Recursos da Comunidade de desenvolvedores do SharePoint (SharePoint PnP)
- Padrões e Práticas de Desenvolvedores do Office 365 no GitHub
- Páginas do SharePoint e o modelo de página
- Práticas e ferramentas de desenvolvimento e design do SharePoint
- Recursos de metadados, sites de publicação e navegação no site do SharePoint
- Soluções de identidade visual e provisionamento do SharePoint