() translation by (you can also view the original English article)
WordPress é o mundialmente favorito CMS por causa de sua interface simples, temas altamente customizáveis e uma variedade infinita de plugins poderosos. Ele tem simplificado o desenvolvimento e gerenciamento de website para até mesmo os usuários mais amadores.
Porém, ainda há momentos em que você vê um determinado design de website, do qual imediatamente capta sua atenção, e você quer modificar seu próprio site para deixá-lo parecido. Infelizmente, se você é um completo amador, você não conseguirá fazer muito até mesmo com o Wordpress, uma vez que modificar temas requer um certo grau de experiência em HTML, CSS, PHP e muitas outras habilidades dependendo da origem do seu tema. Mas mesmo se você for um coder expert, isso poderá lhe tomar algumas horas para fazer as modificações desejadas.
Felizmente, o plugin Visual Composer do Wordpress tem simplificado esse problema. Com esse incrível plugin contrustor de página, até mesmo os mais leigos usuários do Wordpress podem modificar o design do tema e criar uma aparência completamente única para o seu site. Para os experts em Wordpress, ele é um grande otimizador de tempo e pode ajudá-los modificar páginas em apenas alguns minutos. No geral, o plug-in tem sido um sucesso tão grande que ele já está incluído em muitos dos mais recentes temas para WordPress.
Então com essas informações, deixe-me guiar você através de alguns dos principais destaques do Visual Composer, e como ele pode ser configurado para o seu site em Wordpres.
Principais Destaques
Visual Composer foi projetado pelo pessoal da WP Bakery. Ele é um plugin pago que não está disponível no diretório de plugins do Wordpress. Você pode baixar apenas pelo CodeCanyon.
Ele já foi baixado por mais de 70,000 usuários e demonstra caminhar para mais sucesso! Visual Composer tem muitos recursos autamente úteis que pode tornar a construção de páginas no Wordpress uma experiência extremamente agradável. Aqui está uma prévia de alguns deles.
Contrutor de Página para Frontend e Backend
O mais poderoso destaque do Visual Composer é que ele te da um fácil construtor de páginas drag and drop que pode ser usado na área de páginas/postagens padrão do Wordpress ou diretamente do frontend.
Compatibilidade Universal com Temas
Visual Composer não é para um tema específico. Isso quer dizer que você pode usar em qualquer tema para Wordpress sem pecisar de fazer qualquer ajustes em seu código existente.
Layout Altamente Customizável
Os elementos drag and drop do Visual Composer tem um layout e tema padrão. Portanto, você pode modificar isso de acordo com o esquema de cores e aparêcia do seu site.
Mais de 40 Elementos de Design Prontos para Usar
A interface drag and drop do Visual Composer tem mais de 40 elementos drag and drop prontos para serem usados dos quais também podem ser utilizados para criar layouts únicos para seu site em poucos minutos.
Elementos Completamente Responsivos
Os elementos de página e design criados com o Visual Composer são completamente responsivos e mobile ready.
Amigável ao Desenvolvedor
O Visual Composer é cheio de elementos drag & drop versáteis. Se você desejar adicionar mais, você pode fazer isso facilmente graças à sua estrutura amigável para o desenvolvedor.
Instalação do Plugin e Configuração
Como eu mencionei anteriormente, Visual Composer é um plugin pago. Então, você vai precisar comprá-lo primeiro e então fazer upload para o seu site em Wordpress.
Passo 1
O processo de instalação é o mesmo de qualquer outro plugin para Wordpress. Uma vez ativado, o plugin vai aparecer na opção de Configurações no menu esquerdo principal no painel do Wordpress.
Passo 2
Aqui, você pode ajustar algumas configurações básicas do plugin.
Passo 3
Você pode habilitar o Visual Composer para Páginas e Postagens, ou um dos dois. Você também pode definir permissões de acesso específicos para os tipos de usuários individualmente. Para cada tipo de usuário, você pode escolher exibir o Visual Composer na área de edição de postagem e no editor padrão do Wordpress, ou você pode exibir apenas o Visual Composer. Você também pode habilitar ou desabilitar elementos do Visual Composer individualmente para os usuários.
Passo 4
Na aba Design Options, você pode modificar o visual e alguns dos elementos do Visual Composer de acordo com o tema do seu site. A aba Custom CSS permite você modificar o CSS sem modificar qualquer arquivo, enquanto a aba Product License permite você integrar sua conta da Envato para habilitar o suporte e atualizações automáticas. Na aba My Shortcodes, você pode inserir qualquer shortcodes adicional manualmente desenvolvido para a lista de shortcodes existente no Visual Composer.
Agora vamos partir para o uso real do plugin!
Usando o VC nas Páginas e Postagens
Como eu mencionei acima, você pode habilitar o Visual Composer para Postagens, Páginas ou um deles. Depois de ativar o plugin, você vai ver as abas do Visual Editor no topo do seu editor de texto padrão do Wordpress.
As duas abas que aparecem no topo do editor de texto são Backend Editor e Frontend Editor. Essas são as opções que fazem desse plugin tão legal de se usar. Daqui, você pode criar qualquer estrutura de página que quiser. vamos começar com o backend editor.
Backend Editor
Passo 1
Quando você clica na aba Backend editor, sua área de edição de texto vai virar uma caixa drag in drop onde você poderá adicionar elementos simplesmente selecionando-os da lista. Mas primeiro, você vai precisar adicionar uma row (linha). Daqui, a única coisa que vai limitar o seu design vai ser sua imaginação.
Passo 2
Você pode adicionar diferentes elementos dentro da row e também escolher diferentes formatos de coluna para cada linha passando a seta do mouse no botão acima do editor de conteúdo. Você pode adicionar diferentes elementos para o design de sua página na aba Add element. A caixa Add elements contém tudo que você precisa para o design de seu site.
Os elementos estão divididos nas categorias Content, Social, Site Structure, New Elements e WordPress Widgets, mas você pode ver todas elas juntas também. Seja qual for a opção desejada, basta clicar e arrastar ela para o conteúdo de sua caixa. Sua página será basicamente dividida em duas rows diferentes, Você pode continuar adicionando novas rows e novos elementos nessas rows.
Passo 3
Para editar, deletar ou duplicar qualquer row em particular, basta usar os ícones no topo de cada caixa da row
Passo 4
Você pode salvar um grupo de conteúdo como um template pronto para ser usado que poderá ser carregado da lista a qualquer momento que você precisar dele.
Passo 5
O Visual Composer também permite você adicionar um CSS customizado para páginas e postagens individuais. Os efeitos desses CSS customizados vão estar limitados apenas para essa página ou postagem em particular.
Visual Composer também suporta vários plugins famosos como Contact Form 7, Layer Slider, Revolution Slider e Gravity Forms. Se você tem qualquer um desses plugins instalados, eles serão adicionados automaticamente à caixa Add element. Quando você selecionar qualquer um deles da lista de elementos, ele será inserido diretamente na sua página, sem a necessidade da adição de quaisquer shortcodes. O backend editor lhe dará muita flexibilidade e opções que lher permitirá criar qualquer tipo de design até mesmo se você for um usuário amador.
Frontend Editor
O frontend editor permite você arrastar e soltar os elementos instantaneamente na página. Ele torna mais fácil de ver o impacto de suas alterações imediatamente enquanto tem todas as opções do backend editor também.
Passo 1
Começando da esquerda, você pode adicionar novos elementos clicando no sinal de + e editar o formato da coluna com o botão column próximo a ele.
Passo 2
Você também pode adicionar novas rows ou colunas pelo sinal de + dentro do conteúdo da página.
Passo 3
Todos os elementos do Visual Composer são completamente responsivos e mobile ready. Você pode obter uma prévia ao vivo em diferentes dispositivos no frontend editor pelos ícones abaixo.
Passo 4
Apesar de todas estas características e a vasta gama de elementos, Visual Composer permite você adicionar seus próprios shortcodes e elementos de design também. Você pode criar os elementos você mesmo ou importar dos serviços de terceiros.
Em Resumo
WordPress sempre foi uma plataforma flexível no que se refere as diferentes funções que ele pode suportar através de seus plugins. Mas com o plugin para construção de páginas Visual Composer, até mesmo as fuções de design do Wordpress, do qual estava limitado para apenas os usuários mais avançados, agora pode ser editado em muito pouco tempo.
Para mim, pessoalmente, o Visual Composer da uma redução de tempo significante, de algumas horas, eu passei a gastar alguns minutos no design do site dos meus clientes e na edição de tarefas. E com o aumento na popularidade desse plugin, eu posso ver cada vez mais usuários do Wordpress aderí-lo daqui pra frente.
Seja o primeiro a saber sobre novas traduções–siga @tutsplus_pt no Twitter!
