Edite usando Fusion Builder no tema Avada WordPress

Publicados: 2015-09-21

ATUALIZAÇÃO de novembro de 2016 : ThemeFusion atualizou Avada para a versão 5.0. Esta atualização separa o construtor Fusion em um plug-in individual, em vez de ser incorporado ao plug-in Fusion Core. O Fusion Builder foi completamente redesenhado e é muito diferente das versões anteriores.

Quando for solicitado que você atualize o Avada BACKUP de todo o seu site, incluindo o plug-in Fusion Core anterior, esteja preparado para gastar algum tempo reorganizando suas páginas, pois elas não se movem perfeitamente.

Se você já fez a atualização do Avada 5.0 e suas páginas estão quebradas, coloque as mãos em uma versão anterior do Avada. Usando o FTP, vá para a pasta wp-content / themes e faça backup da nova versão. Em seguida, renomeie-o e envie por FTP a versão anterior. Você deve obter a versão mais limpa de suas páginas de volta.


Esta postagem é para a versão 2.0.3 ou anterior.

Usando o tema Avada

Se você tiver o tema Avada em sua instalação do WordPress, é possível usar o Fusion Builder para construir seus posts e páginas, o que é bastante diferente de uma atualização de página padrão.

Fusion Builder é um plugin desenvolvido pela ThemeFusion, os desenvolvedores do Avada, que permite um layout responsivo dentro do tema.

Pode ser um pouco confuso para os iniciantes.

Eu escrevi algumas instruções para ajudá-lo a editar páginas ou posts, usando Fusion Builder dentro do tema Avada WordPress.

Sempre faça backup antes de fazer alterações

Nunca atualize o núcleo, temas ou plug-ins do WordPress sem primeiro fazer um backup completo dos plug-ins, temas, uploads e banco de dados.

As atualizações podem fazer com que algo mais seja interrompido e você precisa ser capaz de reverter ou depurar facilmente. Eu recomendaria fazer atualizações importantes em um site de desenvolvimento para que você possa testá-lo primeiro.

Ative o Fusion Builder do Avada

Primeiro, ative o Fusion Builder na página ou postagem, usando o botão azul acima da área de edição de conteúdo.

Ative o Fusion Page Builder

Se o seu web designer já configurou as páginas, ele pode já ter clicado no botão. Isso mudará a aparência do seu editor de conteúdo, conforme abaixo.

Usando o Fusion Builder da Avada, você pode criar páginas da web responsivas.

Como editar páginas usando Fusion Builder

Faça login no back-end do WordPress.

Acesse as páginas ou poste, usando as guias do lado esquerdo, e depois edite.

A caixa Fusion Builder deve estar na parte superior da tela de edição da página. Os botões na parte superior são identificados como 'Opções de coluna', 'Elementos do construtor', 'Modelos personalizados' e 'Modelos pré-construídos'.

Vamos ignorar os modelos personalizados e os modelos pré-compilados para este post.

iniciar

Opções de coluna do Fusion Builder

Escolha uma opção de coluna quando quiser dividir sua página em colunas. Isso insere uma estrutura de colunas em sua página, na qual você então coloca os Elementos do Construtor. Os tamanhos e números das colunas podem ser alterados posteriormente.

Depois de escolher uma opção de coluna, essa opção aparece no espaço em branco abaixo. Para construir sua página, pense como se estivesse montando um quebra-cabeça.

Se você adicionou uma coluna de 5 x 6º à esquerda, a única outra opção que caberá à direita é 1 x 6º.

Você pode arrastar uma coluna da esquerda para a direita da página.

Clicar no botão menos em qualquer opção de coluna diminui o número de colunas que o elemento terá. O botão de adição é exatamente o oposto.

Elementos do Fusion Builder

Os elementos do construtor podem ser adicionados sem primeiro escolher uma opção de coluna. Os elementos serão inseridos em uma linha que se estende por toda a sua página. Eles podem ser arrastados para dentro de uma coluna, se necessário.

Existe uma variedade de opções de Elemento Construtor no Avada. Vamos começar com o texto. Depois de adicionar suas colunas, como acima, você pode querer adicionar um bloco de texto a uma coluna.

Basta clicar no botão Elemento Construtor, localizar TEXTO e, em seguida, clicar e arrastá-lo para sua coluna.

Passe o mouse sobre o elemento e clique no ícone de pincel que aparece no canto superior direito para adicionar ou editar o texto.

Todos os elementos podem ser editados usando o mesmo ícone de edição.

Altere o texto ou a mídia dentro do elemento e clique em SALVAR para fechar a caixa.

Assim que a janela fechar, clique no botão azul ATUALIZAR para salvar suas alterações.

Editando caixas de conteúdo no Avada

As caixas de conteúdo são encontradas em Elementos do construtor. Eles são úteis porque são realmente flexíveis.

Dentro de um elemento 'Caixas de conteúdo', pode haver várias 'caixas filho' ou 'Itens', que podem ser adicionados ao rolar até a parte inferior da tela da Caixa de conteúdo.

A tela principal da Caixa de conteúdo muda as opções para todas as caixas filho, a menos que o 'filho' tenha seu próprio estilo.

Vá para a tela de edição de sua caixa de conteúdo, usando o ícone de pincel.

As opções na Caixa de conteúdo são as seguintes:

Configurações de pais / filhos
As configurações de “Nível pai” controlarão todos os estilos de caixa juntos. As configurações de “Nível infantil” controlarão cada estilo de caixa individualmente.

Layout da caixa de conteúdo
Selecione o layout para a caixa de conteúdo

Numero de colunas
Defina o número de colunas por linha.

Alinhamento de Conteúdo
Funciona com as opções de layout “Ícone clássico com título” e “Ícone clássico na lateral”.

Tamanho do Título
Controla o tamanho do título. Deixe em branco para a seleção de opções de tema. Em pixels, ex: 18 px.

Cor da fonte do título
Controla a cor da fonte do título. Deixe em branco para a seleção de opções de tema. ex: # 000

Cor da fonte do corpo
Controla a cor da fonte do corpo. Deixe em branco para a seleção de opções de tema. ex: # 000

Cor de fundo da caixa de conteúdo
Deixe em branco para a seleção de opções de tema.

Fundo do ícone
Escolha mostrar um plano de fundo atrás do ícone. Selecione o padrão para a seleção de opções de tema.

Raio de fundo do ícone
Escolha o raio da borda do plano de fundo do ícone. Deixe em branco para a seleção de opções de tema. Em pixels (px), ex: 1px ou “redondo”.

Cor do ícone
Deixe em branco para a seleção de opções de tema.

Cor de fundo do ícone
Deixe em branco para a seleção de opções de tema.

Cor da borda interna do fundo do ícone
Deixe em branco para a seleção de opções de tema.

Tamanho da borda interna do fundo do ícone
Deixe em branco para a seleção de opções de tema.

Cor da borda externa do fundo do ícone
Deixe em branco para a seleção de opções de tema.

Tamanho da borda externa do fundo do ícone
Deixe em branco para a seleção de opções de tema.

Tamanho do ícone
Controla o tamanho do ícone. Deixe em branco para a seleção de opções de tema. Em pixels, ex: 18 px.

Tipo de animação flutuante de ícone
Selecione o tipo de animação para o ícone ao pairar. Selecione o padrão para a seleção de opções de tema.

Hover Animation Color
Selecione uma cor de destaque para a animação flutuante. Deixe em branco para a seleção de opções de tema.

Tipo de Link
Selecione o tipo de link que deve ser mostrado na caixa de conteúdo. Selecione o padrão para a seleção de opções de tema.

Link Area
Selecione a área à qual o link será atribuído. Selecione o padrão para a seleção de opções de tema.

Link alvo
_self = aberto na mesma janela
_blank = abrir em uma nova janela. Selecione o padrão para a seleção de opções de tema.

Atraso de animação
Controla o atraso da animação entre cada elemento em um conjunto. Em milissegundos, 1000 = 1 segundo.

Offset of Animation
Escolha quando a animação deve começar.

Tipo de Animação
Selecione o tipo de animação para usar no shortcode

Direção de Animação
Selecione a direção de entrada para a animação

Velocidade de Animação
Digite a velocidade da animação em segundos (0,1 - 1)

Margem superior
Em pixels (px), ex: 1px.

Margem inferior
Em pixels (px), ex: 1px.

Classe CSS
Adicione uma classe ao elemento HTML envolvente.

ID CSS
Adicione um id ao elemento HTML envolvente.

Editando uma caixa de conteúdo 'filho'

Clique no ícone de pincel para editar a caixa de conteúdo.

Role até a parte inferior para encontrar 'Adicionar nova caixa de conteúdo' ou, possivelmente, 'Item 1+ da caixa de conteúdo', se já houver um item na caixa de conteúdo.

Edite texto, imagens, adicione ícones e mude várias opções na caixa de conteúdo 'filho' aqui. Essas configurações substituirão as configurações principais.

Agora clique no botão azul SALVAR. A caixa de edição será fechada.

Lembre-se de clicar no botão ATUALIZAR no lado direito para salvar a página.

Links Úteis

Avada Update Information