Você deseja adicionar uma imagem de plano de fundo ao seu site WordPress?
Imagens de fundo podem ser usadas para tornar seu site mais atraente e esteticamente agradável.
Neste artigo, mostraremos como adicionar facilmente uma imagem de plano de fundo ao seu site WordPress.
Se preferir as instruções por escrito, continue lendo.
Método 1. Adicione uma imagem de fundo usando as configurações de tema do WordPress
Os Temas WordPress mais populares vem com suporte de fundo personalizado. Esse recurso permite que você defina facilmente uma imagem de plano de fundo em seu site WordPress.
Se a sua tema WordPress suporta a funcionalidade de plano de fundo personalizado, recomendamos usar este método para adicionar uma imagem de plano de fundo ao seu site.
No entanto, se o seu tema WordPress não suporta esse recurso, ou se você não gostar da maneira como ele implementa imagens de fundo, tente as outras opções mencionadas em nosso tutorial.
Você deve primeiro visitar a página Aparência »Personalizar no seu administrador do WordPress. Isso iniciará o Personalizador tema WordPress onde você pode alterar diferentes configurações deste tema enquanto visualiza uma visualização em tempo real.
Então você tem que clicar na opção 'Imagem de fundo'. O painel deslizará e mostrará as opções para fazer upload ou selecionar uma imagem de plano de fundo para o seu site.
Clique no botão Selecionar imagem para continuar.
Isso abrirá um pop-up do WordPress, onde você poderá fazer upload de uma imagem do seu computador. Você também poderá selecionar uma imagem baixada anteriormente da biblioteca de mídia.
Então você precisa clicar no botão Escolher imagem após fazer o upload ou selecionar a imagem que deseja usar no plano de fundo.
Isso fechará o pop-up do carregador de mídia e você verá a visualização da imagem selecionada na personalização do tema do WordPress.
Abaixo da imagem você também poderá ver as opções da imagem de fundo. Debaixo " PresetVocê pode selecionar como deseja que a imagem de fundo apareça: preencher a tela, ajustar a tela, repetir ou personalizada.
Você também pode selecionar a posição da imagem de fundo clicando nas setas abaixo. Ao clicar no centro, a imagem irá alinhar a imagem ao centro da tela.
Não se esqueça de clicar no botão « publicar Para armazenar suas configurações. É isso, você adicionou com sucesso uma imagem de fundo ao seu site WordPress.
Vá em frente e visite seu site para vê-lo em ação.
Método 2. Adicionar uma imagem de fundo personalizada no WordPress usando um plugin
Este método é muito mais flexível. Funciona com qualquer tema WordPress e permite configurar várias imagens de fundo.
Você também pode definir planos de fundo diferentes para qualquer postagem, página, categoria ou qualquer outra seção do seu site WordPress.
Ele automaticamente torna todas as suas imagens de fundo em tela cheia e responsivas. Isso significa que sua imagem de plano de fundo será redimensionada automaticamente em dispositivos menores.
Primeiro de tudo, você precisa instalar e ativar o plugin Full Screen Background Pro. Para obter mais detalhes, consulte nosso guia passo a passo sobre como instalar um plugin do WordPress.
Após a ativação, você deve visitar a página Aparência »Imagem BG em tela inteira para definir as configurações do plug-in.
Você será solicitado a adicionar sua chave de licença. Você pode obter essas informações no e-mail que recebeu após a compra do plugin ou na sua conta no site do plugin.
Então você tem que clicar no 'Salvar configurações'para armazenar suas alterações. Agora você está pronto para começar a adicionar imagens de fundo ao seu site WordPress.
Vá em frente e clique no botão Adicionar nova imagem Na página de configurações do plugin. Isso o levará para a tela de download da imagem de fundo.
Clique no botão 'Escolha a imagem'para baixar ou selecionar uma imagem. Assim que você selecionar a imagem, poderá ter uma visualização em tempo real da imagem na tela.
Então você precisa fornecer um nome para esta imagem. Este nome será usado internamente, então você pode usá-lo em qualquer lugar.
Finalmente, você precisa selecionar onde deseja que esta imagem seja usada como imagem de fundo.
Full Screen Background Pro também permite que você configure imagens de fundo para todo o site, ou você pode escolher entre diferentes seções do seu site, como categorias, arquivos, página inicial ou blog.
Não se esqueça de salvar para armazenar sua imagem de fundo.
Você pode adicionar quantas imagens quiser visitando a página apparence »Imagem BG em tela inteira
Se você definir várias imagens para serem usadas globalmente, o plug-in exibirá automaticamente imagens de fundo como uma apresentação de slides.
Você pode ajustar o tempo que leva para uma imagem desaparecer e o tempo após o qual uma nova imagem de fundo aparece.
O tempo que você insere aqui é em milissegundos. Se você quiser que uma imagem de plano de fundo desapareça após 20 segundos, será necessário inserir 20000.
Não se esqueça de clicar no botão Salvar opções para salvar suas alterações.
Imagens de fundo para postagens, páginas e categorias
Full Screen Background Pro também permite definir imagens de fundo para postagens, páginas, categorias, tags e muito mais.
Apenas edite a postagem / página onde você deseja exibir uma imagem de fundo diferente. Na página de edição do artigo, você notará o novo grupo " Imagem de fundo em tela inteira »No editor de artigos.
Para usar uma imagem de fundo para uma categoria específica, você precisa visitar a página Aparência »imagem de fundo em tela cheia, em seguida, clique no botão "Escolha a imagem ".
Depois de enviar sua imagem, você pode selecionar “categoria” como o contexto onde deseja exibir a imagem de fundo.
Insira o ID da categoria ou slug específico onde deseja exibir a imagem.
Lembre-se de salvar sua imagem para armazenar suas configurações.
Método 3. Adicionar imagens de fundo personalizadas em qualquer lugar no WordPress usando código CSS
Por padrão, o WordPress adiciona várias classes CSS a diferentes elementos HTML em seu site WordPress. Você pode adicionar facilmente imagens de fundo personalizadas a postagens, categorias, autores e outras páginas usando essas classes CSS geradas pelo WordPress.
Por exemplo, se você tiver uma categoria em seu site chamada TV, o WordPress adicionará automaticamente essas classes CSS à tag body quando alguém visualizar a página da categoria de TV.
Você pode usar ferramenta de inspeção para ver exatamente quais classes CSS são adicionadas pelo WordPress à tag body.
Você pode usar qualquer classe CSS para estilizar esta página de categoria de maneira diferente.
categoria-tvcategoria-4
Vamos adicionar uma imagem de fundo personalizada a uma página de arquivo de categoria. Você precisará adicionar este CSS personalizado ao seu tema WordPress.
corpo.categoria-tv { imagem de fundo: url ("http://example.com/wp-content/uploads/2017/03/your-background-image.jpg"); posição de fundo: centro central; tamanho do plano de fundo: capa; repetição de fundo: sem repetição; anexo de fundo: fixo; }
Você também pode adicionar planos de fundo personalizados a postagens e páginas individuais. O WordPress adiciona uma classe CSS com o post ou ID da página no corpo da tag. Você pode usar o mesmo código CSS, basta substituir .category-tv pela classe CSS de um post específico.
Descubra também alguns plugins premium do WordPress
Você pode usar outro WordPress plugins para dar uma aparência moderna e otimizar o manuseio do seu blog ou site.
Oferecemos a você aqui alguns plugins premium do WordPress que ajudarão você a fazer isso.
1. Easy Custom JS e CSS
Ce WordPress Plugin premium é um poderoso editor de código CSS e JavaScript que permite adicioná-los a qualquer seção do seu site. Ele permite que você mantenha suas personalizações mesmo após uma grande atualização no seu tema WordPress. 
Você tem a opção de limitar o campo de uso do seu código personalizado. Por exemplo, você pode usar seu código apenas para um artigo no formato de vídeo.
Veja nossos artigos sobre Como exigir a aceitação dos termos de uso no WordPress
Ou você pode limitar seu código a um tema específico do WordPress; O que é útil se você estiver alterando temas para o seu blog WordPress.
Descarregar | Demo | hospedagem na web
2. Lápis Amarelo: Editor de Estilo Visual CSS
Yellow Pencil é um editor de estilo visual que você pode usar com qualquer tema para personalizar seu site em minutos (fontes, cores, animações e muito mais ...).
Ce WordPress Plugin premium criará estilos CSS por fundo enquanto você joga com as cores como se fosse um jogo. Foi projetado tanto para iniciantes quanto para usuários experientes.
Descubra também o nosso Plugins 5 WordPress para mostrar notificações
Nenhum conhecimento de codificação é necessário. No entanto, o WordPress Plugin tem um bom editor de CSS para quem gosta de codificar. Você pode codificar ao vivo com este editor e personalizar seu CSS.
Descarregar | Demo | hospedagem na web
3. Widget de Comentários Recentes no Facebook
Este widget permite que você exiba uma lista dos comentários mais recentes do Facebook do seu blog WordPress na primeira página ou em qualquer lugar onde haja um widget usado pelo site.
Como recursos você terá entre outros: a exibição de todos os comentários mais recentes do seu site ou blog WordPress, oAprovação automática ou manual de comentários a serem exibidos no widget,enviar uma notificação por e-mail quando uma pessoa comenta através do plug-in de comentários do Facebook, bom SEO, compatibilidade com qualquer tema WordPress, oopções para personalizar o widget e muito mais.
Descarregar | Demo | hospedagem na web
Recursos Recomendados
Descubra outros recursos recomendados para ajudá-lo a criar e gerenciar seu site.
- Como ocultar um widget WordPress no celular
- Plugins 10 WordPress para melhorar o visual do seu site
- Como migrar manualmente um site WordPress: o guia
- 7 plug-ins do WordPress para botões de call to action no WordPress
Conclusão
Aqui ! É isso neste tutorial. Esperamos que este artigo tenha ajudado você a aprender como adicionar uma imagem de fundo no WordPress. Não hesite em compartilhe com seus amigos em suas redes sociais favoritas.
No entanto, você também pode consultar nossos recursos, se você precisar de mais elementos para realizar seus projetos de criação de sites da Internet, consultando nosso guia em Criação de blog WordPress.
Se você tiver sugestões ou comentários, deixe-os em nossa seção Comentários.
...
