Personalizar

Privado: Design personalizado » CSS personalizado

Sumário

CSS personalizado

O CSS Personalizado faz parte do Personalizador, e é uma funcionalidade dos  planos WordPress.com Premium, Negócios e eCommerce. É possível adicionar CSS personalizado ao seu blog do WordPress.com, usando o Editor CSS em Meus Sites → Design → Personalizar → CSS no painel de seu blog.

Observação: Nos sites dos nossos planos WordPress.com Negócios e eCommerce com plugins instalados, é possível encontrar a seção CSS personalizado em Meus sites → Design → Personalizar → CSS adicional no painel do seu blog.

CSS significa Cascading Style Sheets (folhas de estilos em cascata). e é uma linguagem de marcação que controla a aparência dos elementos HTML em uma página da web. Há um potencial praticamente infindável para o que você pode fazer com o CSS, a fim de modificar o design de um site, conforme mostramos no famosíssimo projeto CSS Zen Garden, uma vitrine do que pode ser realizado com o CSS, simplesmente alterando a aparência de um único arquivo HTML.

Aproveitar essa funcionalidade ao máximo requer alguns conhecimentos sobre o funcionamento do CSS e HTML, ou no mínimo boa vontade para aprender. Consulte a seção Ajuda do CSS, mais abaixo nesta página, para obter mais informações.

Se você busca personalizar diversos temas do WordPress.com e não se interessa em aprender CSS, recomendamos contratar um designer para fazer as alterações que você deseja.


↑ Tabela de Conteúdo ↑

Ajuda de CSS

Precisa de ajuda com CSS? Nós podemos fornecer suporte limitado ao CSS , por meio de chat ao vivo ou e-mail. Fique à vontade para entrar em contato e nós o avisaremos caso possamos ajudá-lo com sua solicitação de CSS. Do contrário, podemos apontar a direção certa para você seguir!

Para saber como o CSS funciona no WordPress.com, consulte Como adicionar um CSS personalizado. Se o CSS for novidade para você, que tal conferir um tutorial sobre CSS, como o Tutorial para Iniciantes em HTML Dog CSS primeiro?

Apesar de o processo de aprendizagem ser maior para iniciantes, saber usar o CSS é algo valioso e reutilizável. Há vários recursos excelentes online para ajudar você a saber mais sobre HTML e CSS.

Aqui vão algumas dicas que podem ajudá-lo:

Tutoriais de CSS sugeridos

Livros sugeridos sobre CSS

↑ Tabela de Conteúdo ↑

Perguntas frequentes

O CSS personalizado me permite editar HTML? 

Não. O CSS personalizado permite que você adicione ou substitua CSS apenas nos temas. Ele não concede acesso às alterações de marcação HTML ou código PHP. É possível transformar qualquer tema do WordPress.com em uma tela em branco, desativando o CSS do tema nas configurações personalizadas de CSS.

O CSS Personalizado permite o upload de temas?

Não. O upload de temas personalizados é compatível apenas com os planos WordPress.com Negócios e eCommerce. Leia mais sobre isso aqui.

Posso remover os links de créditos, como “Blog no WordPress.com”, temas, fontes ou links da barra de ferramentas? 

Todos os usuários do WordPress.com precisam manter a barra de administração (a barra escura exibida na parte superior dos sites do WordPress.com no login). Os clientes dos planos WordPress.com Negócios e eCommerce podem entrar em contato com o suporte, a fim de que recebam ajuda para remover a Barra de administração, se necessário.

O crédito do rodapé pode ser ocultado se os planos WordPress.com Negócios ou eCommerce estiverem ativos em um site. Não use CSS para ocultar ou alterar os créditos, caso não pertença a nenhum desses planos.

Todos os usuários do WordPress.com podem escolher dentre diversas opções para o crédito de rodapé, desde um logotipo minimalista do WordPress.com a opções de texto como “Um site WordPress.com” ou “Tecnologia WordPress.com.” Por favor, consulte esta documentação para maiores informações.

A modificação do estilo do texto do rodapé (ex.: cores e tamanho de fonte) é aceitável, desde que o texto continue legível. Ao usar CSS, você também pode acrescentar conteúdos tais quais uma notificação de direitos autorais ao rodapé existente.

Posso usar o CSS personalizado para fazer pequenas alterações em um tema existente?

Sim. Esta é a opção mais popular e a mais simples de implementar. Se você simplesmente adicionar pequenos trechos de códigos CSS para fazer as alterações desejadas em um tema existente, elas serão aplicadas após o carregamento do CSS do tema e o substituirá sem precisar que você gerencie toda uma configuração independente de CSS. Esta ação torna possível a realização de pequenas alterações com rapidez e facilidade, usando apenas algumas linhas de código no editor CSS.

Posso usar o CSS personalizado para fazer alterações importantes no layout do meu blog?

Alterações importantes são possíveis, com certeza, com o CSS personalizado, mas a facilidade de implementação delas dependerá do tema e das suas habilidades em CSS. Em vez de adicionar estilos ao CSS do tema existente, é possível substitui-lo totalmente e começar do zero, basicamente transformando qualquer tema do WordPress.com em uma tela em branco. Alguns temas são mais flexíveis do que os outros e a melhor forma de descobrir o que é possível é começar a experimentar.

Posso usar as regras de CSS como @import e @font-face?

O WordPress.com Premium, no momento, não permite o carregamento de arquivos externos via CSS, mas isso é possível nos planos WordPress.com Negócios e eCommerce.

Posso usar fontes da Web no CSS?

O painel de fontes em Meus sites → Design → Personalizar → Fontes permite que você escolha um par de fontes. Você está limitado para escolher duas fontes da Web no front end ao trabalhar com CSS. Além disso, se os planos WordPress.com Negócios ou eCommerce estiverem ativos, é possível incluir fontes adicionais, usando plugins de terceiros.

Os meus estilos CSS personalizados serão usados em vez dos estilos padrão do tema, ou além deles?

Depende de você. Há opções para ambos os casos! Você pode optar pela inclusão de CSS para substituir o CSS do tema existente (essa é a opção mais popular), ou você pode começar do zero, sem carregar o CSS original do tema. Se você adicionar a um tema do CSS existente, a folha de estilos padrão do tema será carregado primeiro, para que as regras de CSS personalizado sejam aplicadas em seguida. Selecione esta opção se você simplesmente deseja fazer pequenas alterações em um tema, como alterar a aparência do texto ou a cor de fundo. Se você começar do zero, a folha de estilos padrão do tema não será carregada. Selecione esta opção se você deseja começar do zero e realizar o design de tudo por conta própria.

Posso aplicar meu CSS ao tema para dispositivos móveis?

Sim. É possível optar por aplicar seu CSS personalizado aos temas para dispositivos móveis, o nosso tema padrão para navegadores de dispositivos móveis. Para habilitar esta opção, acesse Meus Sites → Design → Personalizar → CSS e procure pelas configurações abaixo no Editor CSS.  Marque a caixa de seleção ao lado de “Incluir este CSS no tema para dispositivos móveis”. Seus estilos agora serão aplicados ao Minileven. O tema Minileven tem uma classe do corpo de texto própria para dispositivos móveis, que você pode usar para escrever estilos voltados apenas para o Minileven. Veja um exemplo simples que usa a classe de corpo de texto do “tema para dispositivos móveis” a fim de deixar o plano de fundo do Minileven vermelho:

body.mobile-theme {
cor-de-fundo: #ff0000;
}

Posso fazer o upload de imagens para usá-las com meu CSS?

Sim. É possível fazer o upload de uma imagem para a sua Biblioteca de mídia para, em seguida, vinculá-la ao seu URL direto, de dentro da folha de estilos CSS. Veja um exemplo simples de como usar uma imagem de fundo em sua folha de estilos:

div#content {
imagem-de-fundo: url('http://example.files.wordpress.com/1999/09/example.jpg');
}

Fiz uma besteira. Como posso redefinir os estilos do meu tema?

Acesse Meus sites → Design → Personalizar → CSS, remova todo o código CSS do editor e clique em Salvar.

O que acontece se eu cancelar a assinatura dos planos WordPress.com Premium, Negócios ou eCommerce?

Todos os upgrades do WordPress.com são renovados anualmente. Caso você opte pelo cancelamento da assinatura, seu CSS personalizado será salvo, mas deixará de ser aplicado ao seu site, para que outras pessoas o vejam. Se você desejar reaplicá-lo ao seu site, é possível comprar novamente o upgrade e os estilos serão reaplicados automaticamente, desde que você não tenha alterado os temas. Se você tiver alterado os temas, encontrará seu antigo CSS no link Revisões de CSS, localizados acima do editor, no painel CSS.


Ainda confuso?

Contate o suporte.