Uma introdu\u00e7\u00e3o ao Elementor<\/h2>\n
Nos primeiros tempos da Internet, a cria\u00e7\u00e3o de um site exigia habilidades avan\u00e7adas de desenvolvimento e web design<\/a>, ou acesso a uma equipe especializada. Isto significava que construir um site era demorado, muitas vezes frustrante, e potencialmente caro.<\/p>\n Gra\u00e7as aos construtores de p\u00e1ginas modernos<\/a>, voc\u00ea pode agora criar um site de design profissional<\/a>, de alto desempenho<\/a> e sem habilidades especializadas. Uma vez que seu site esteja pronto e funcionando, voc\u00ea pode r\u00e1pida e facilmente adicionar conte\u00fado ou mudar o layout a qualquer momento, mesmo que voc\u00ea seja um n\u00e3o-codificador<\/a>.<\/p>\n Existem v\u00e1rios construtores de p\u00e1ginas WordPress, mas com mais de cinco milh\u00f5es de instala\u00e7\u00f5es ativas<\/a>, o plugin do Elementor<\/a> \u00e9 um dos mais populares. O Elementor<\/a> permite que voc\u00ea crie tudo, desde sites inteiros at\u00e9 p\u00e1ginas de destino<\/a> individuais atrav\u00e9s de um editor intuitivo de arrastar e soltar.<\/p>\n Com o Elementor, voc\u00ea pode controlar todos os aspectos do design do seu site usando uma \u00fanica plataforma. Dessa forma, seu site pode refletir perfeitamente a sua marca<\/a>.<\/p>\n O editor intuitivo do Elementor \u00e9 particularmente popular entre os propriet\u00e1rios de sites que n\u00e3o t\u00eam experi\u00eancia em design e desenvolvimento. \u00c9 tamb\u00e9m um \u00f3timo ajuste para empreendedores e pequenas empresas<\/a> com uma ideia para um empreendimento online, mas n\u00e3o necessariamente tem os fundos para contratar uma equipe dedicada a design ou desenvolvimento.<\/p>\n Mesmo que voc\u00ea seja um profissional experiente, h\u00e1 muitas raz\u00f5es para usar o Elementor. S\u00f3 porque voc\u00ea tem habilidades de codifica\u00e7\u00e3o n\u00e3o significa que seja s\u00e1bio criar sempre tudo do zero.<\/p>\n o Elementor tem muitos recursos para ajudar voc\u00ea a construir sites premiados em menos tempo. Isto inclui mais de 90 widgets prontos<\/a> e templates web desenhados profissionalmente<\/a>.<\/p>\n Desta forma, o Elementor pode aumentar sua produtividade e seus lucros. Estes recursos de economia de tempo podem ser particularmente lucrativos se voc\u00ea construir regularmente sites WordPress (ou seja, para desenvolvedores aut\u00f4nomos<\/a> e ag\u00eancias WordPress<\/a>).<\/p>\n\n Elementor \u00e9 um software “freemium”. Voc\u00ea pode baixar o plugin central do Elementor<\/a> gratuitamente ou comprar uma licen\u00e7a Elementor Pro<\/a>.<\/p>\n O plugin gratuito do WordPress vem com tudo que voc\u00ea precisa para construir p\u00e1ginas de vendas visualmente atraentes, listagens de produtos<\/a>, sites de neg\u00f3cios<\/a> e muito mais. Ele inclui mais de 40 widgets, 100 templates e mais de 300 blocos. Os blocos s\u00e3o templates de se\u00e7\u00e3o pr\u00e9-desenhados que voc\u00ea pode misturar e combinar para criar designs exclusivos.<\/p>\n Se voc\u00ea quiser funcionalidades mais avan\u00e7adas, voc\u00ea pode adquirir o Elementor Pro. Isto desbloqueia alguns widgets extras, juntamente com o Elementor Theme Builder<\/a>.<\/p>\n Usando o Theme Builder, voc\u00ea pode editar quase todos os elementos do site, incluindo o cabe\u00e7alho e o rodap\u00e9. Voc\u00ea tamb\u00e9m pode criar designs personalizados de posts e p\u00e1ginas de arquivo.<\/p>\n Se voc\u00ea est\u00e1 desenvolvendo uma loja online, o Elementor Pro tamb\u00e9m inclui um WooCommerce Builder<\/a>. Voc\u00ea pode usar isso para personalizar o conte\u00fado do WooCommerce do seu site, incluindo a p\u00e1gina do produto, o arquivo do produto e a p\u00e1gina de checkout. Voc\u00ea tamb\u00e9m ter\u00e1 acesso a widgets explicitamente projetados para impulsionar as convers\u00f5es, tais como Custom Add To Cart<\/a>, Upsells<\/a>, e Product Related<\/a>.<\/p>\n o Elementor Pro tamb\u00e9m vem com um Popup Builder<\/a> e um Form Builder<\/a>. Embora existam plugins separados que podem ajud\u00e1-lo a criar formul\u00e1rios<\/a> e popups, ao optar pelo Elementor, voc\u00ea pode minimizar o n\u00famero de plugins que voc\u00ea precisar\u00e1 instalar e manter.<\/p>\n Usar muitos plugins pode tornar o seu site mais vulner\u00e1vel a hackers<\/a>. Isso pode at\u00e9 impactar o desempenho do seu site<\/a>. Portanto, \u00e9 uma melhor pr\u00e1tica minimizar o n\u00famero que voc\u00ea tem instalado. Al\u00e9m disso, como voc\u00ea est\u00e1 projetando todos os elementos do seu site usando a mesma plataforma, voc\u00ea deve achar mais f\u00e1cil conseguir uma apar\u00eancia e uma sensa\u00e7\u00e3o consistente.<\/p>\n As licen\u00e7as do Elementor Pro incluem o acesso a mais de 60 kits de sites profissionais. Estes s\u00e3o pacotes de templates, p\u00e1ginas, popups e outros componentes que podem ajudar voc\u00ea a criar um site completo. Se voc\u00ea adquirir uma licen\u00e7a Expert ou superior, voc\u00ea tamb\u00e9m ter\u00e1 acesso a 20 kits de site Expert.<\/p>\n Al\u00e9m disso, cada licen\u00e7a Pro inclui suporte premium. Tipicamente, voc\u00ea receber\u00e1 respostas da equipe de suporte especializado do Elementor dentro de um dia. Entretanto, se voc\u00ea optar pelo Elementor Pro Studio ou superior, voc\u00ea ser\u00e1 atualizado para o suporte VIP. Isto permite que voc\u00ea participe de chats ao vivo com a equipe de suporte VIP do Elementor. Voc\u00ea tamb\u00e9m receber\u00e1 respostas priorit\u00e1rias em seus ingressos, que normalmente chegam em menos de 30 minutos.<\/p>\n Se voc\u00ea \u00e9 uma ag\u00eancia, desenvolvedor ou designer, voc\u00ea pode estar interessado em um perfil de Rede de Especialistas<\/a>. L\u00e1, voc\u00ea pode mostrar seu trabalho e captar a aten\u00e7\u00e3o de clientes em potencial.<\/p>\n Se voc\u00ea est\u00e1 interessado em publicidade atrav\u00e9s da Rede de Especialistas, voc\u00ea tamb\u00e9m pode estar interessado nas licen\u00e7as do Elementor Pro Expert, Studio, ou Agency. Estas licen\u00e7as lhe d\u00e3o o direito de criar um perfil neste mercado popular.<\/p>\n Os planos do Elementor Pro variam de $49 a $999 por ano<\/a>. A empresa tamb\u00e9m oferece uma garantia de 30 dias de devolu\u00e7\u00e3o do dinheiro, para que voc\u00ea possa experiment\u00e1-la antes de comprar.<\/p>\n Por ser um plugin WordPress, a instala\u00e7\u00e3o do Elementor<\/a> \u00e9 r\u00e1pida e f\u00e1cil. Voc\u00ea pode baixar o plugin gratuito<\/a> diretamente do seu painel do WordPress.<\/p>\n Para baixar a vers\u00e3o gratuita, navegue at\u00e9 Plugins > Add New<\/strong>. No campo de busca, digite Elementor<\/strong>. Quando o plugin aparecer, clique em Install Now<\/strong>.<\/p>\n Quando solicitado, clique em Activate<\/strong>. O plugin adicionar\u00e1 uma op\u00e7\u00e3o Elementor <\/strong>\u00e0 sua barra lateral do WordPress.<\/p>\n Agora voc\u00ea est\u00e1 pronto para come\u00e7ar a usar o Elementor! Para come\u00e7ar, basta clicar na op\u00e7\u00e3o Elementor na barra lateral.<\/p>\n Alternativamente, voc\u00ea pode baixar o plugin do Elementor diretamente do reposit\u00f3rio WordPress. Ent\u00e3o, entre no seu painel do WordPress e navegue at\u00e9 Plugins > Adicionar Novo > Upload Plugin<\/strong>. Voc\u00ea pode ent\u00e3o clicar em Choose File<\/strong>, e selecionar o arquivo .zip<\/em> do Elementor que voc\u00ea acabou de baixar.<\/p>\n H\u00e1 duas maneiras de conectar o Elementor Pro ao WordPress. Se voc\u00ea ainda n\u00e3o comprou uma licen\u00e7a do Elementor Pro, voc\u00ea precisar\u00e1 ir para o site oficial, e selecionar Get Started<\/strong>.<\/p>\n Voc\u00ea pode ent\u00e3o seguir as instru\u00e7\u00f5es na tela para criar uma conta do Elementor. Quando solicitado, insira algumas informa\u00e7\u00f5es sobre o tipo de site que voc\u00ea deseja fazer.<\/p>\n A seguir, escolha o plano que voc\u00ea quer comprar. Como o Elementor requer um site WordPress ativo, voc\u00ea precisar\u00e1 entrar no dom\u00ednio do seu site. o Elementor ent\u00e3o realizar\u00e1 uma verifica\u00e7\u00e3o para verificar se o seu site est\u00e1 usando a plataforma WordPress.<\/p>\n Assumindo que voc\u00ea tenha um site WordPress ativo, o pr\u00f3ximo passo \u00e9 clicar em Install Elementor<\/strong>. Voc\u00ea ser\u00e1 redirecionado automaticamente para a p\u00e1gina do plugin Elementor se voc\u00ea estiver atualmente conectado ao seu site.<\/p>\n Quando solicitado, clique em Install Now > Activate<\/strong>. o Elementor ir\u00e1 ent\u00e3o adicionar o plugin do construtor de p\u00e1ginas ao seu site.<\/p>\n Alternativamente, se voc\u00ea j\u00e1 comprou uma licen\u00e7a do Elementor Pro, v\u00e1 at\u00e9 o site oficial e fa\u00e7a o login usando os detalhes que voc\u00ea recebeu em seu e-mail de confirma\u00e7\u00e3o.<\/p>\n Em sua conta do Elementor, selecione Subscriptions\u00a0<\/strong>no menu do lado esquerdo. Voc\u00ea pode ent\u00e3o clicar em Download Zip.<\/strong><\/p>\n Em seguida, entre no seu painel de controle do WordPress e navegue at\u00e9 Plugins > Add new<\/strong>. Voc\u00ea pode ent\u00e3o carregar o arquivo .zip<\/em> do Elementor Pro que voc\u00ea acabou de baixar.<\/p>\n Depois de instalar e ativar o Elementor Pro, o WordPress deve solicitar que voc\u00ea digite sua chave de licen\u00e7a. Alternativamente, voc\u00ea pode navegar para Elementor > License > Connect & Activate<\/strong>.<\/p>\n O WordPress deve verificar sua licen\u00e7a automaticamente se voc\u00ea est\u00e1 atualmente logado em sua conta do Elementor. Se voc\u00ea n\u00e3o estiver, digite seu nome de usu\u00e1rio e senha do Elementor quando for solicitado a ativar sua licen\u00e7a.<\/p>\n Com o Elementor, voc\u00ea pode projetar sites \u00fanicos sem habilidades especiais de design ou desenvolvimento. No entanto, isso ajuda a se familiarizar com os fundamentos antes de construir um site completo. Aqui est\u00e1 uma r\u00e1pida introdu\u00e7\u00e3o ao fluxo de trabalho do Elementor com isso em mente.<\/p>\n Para criar uma nova p\u00e1gina ou postar no construtor de p\u00e1ginas do Elementor, navegue para Pages\/Posts > Add New<\/strong>. Voc\u00ea pode lan\u00e7ar o editor do Elementor clicando em Edit with Elementor<\/strong>.<\/p>\n Alternativamente, voc\u00ea pode ter uma p\u00e1gina existente que poderia se beneficiar de uma mudan\u00e7a de visual. Basta navegar at\u00e9 a p\u00e1gina em quest\u00e3o e abri-la para edi\u00e7\u00e3o neste cen\u00e1rio. Voc\u00ea pode ent\u00e3o clicar no bot\u00e3o Edit with Elementor<\/strong>.<\/p>\n No lado esquerdo da tela, voc\u00ea ver\u00e1 a barra lateral do Elementor. Aqui voc\u00ea encontrar\u00e1 todos os elementos que voc\u00ea pode adicionar aos seus designs, tais como bot\u00f5es e cabe\u00e7alhos.<\/p>\n A barra lateral do Elementor tamb\u00e9m cont\u00e9m uma se\u00e7\u00e3o Global Widgets<\/strong>. Se voc\u00ea planeja reutilizar o mesmo widget em v\u00e1rios projetos, voc\u00ea pode querer salv\u00e1-lo como um Global Widget. Isto torna seu elemento personalizado facilmente acess\u00edvel a qualquer momento. Ele tamb\u00e9m fornece um local central onde voc\u00ea pode editar o seu widget uma vez para fazer mudan\u00e7as universais. o Elementor ir\u00e1 ent\u00e3o replicar estas mudan\u00e7as em todo o seu site.<\/p>\n \u00c0 direita est\u00e1 a tela de pr\u00e9-visualiza\u00e7\u00e3o ao vivo, onde voc\u00ea pode criar o seu design. o Elementor ir\u00e1 se atualizar automaticamente para exibir suas mudan\u00e7as em tempo real enquanto voc\u00ea faz suas edi\u00e7\u00f5es.<\/p>\n O editor do Elementor fornece acesso a tr\u00eas blocos principais de constru\u00e7\u00e3o: Se\u00e7\u00f5es, Colunas e Widgets. J\u00e1 abordamos os widgets prontos da Elementor, ent\u00e3o vamos ver como voc\u00ea pode adicion\u00e1-los aos seus projetos.<\/p>\n Tipicamente, voc\u00ea come\u00e7ar\u00e1 criando uma Se\u00e7\u00e3o, clicando no \u00edcone +<\/strong> dentro da tela principal. o Elementor ir\u00e1 ent\u00e3o pedir que voc\u00ea Select Your Structure<\/strong>.<\/strong><\/p>\n As op\u00e7\u00f5es de estrutura consistem em uma ou mais Colunas. Eventualmente, voc\u00ea ir\u00e1 colocar sua widget dentro dessas Colunas. Elas desempenham um papel importante na cria\u00e7\u00e3o de layouts mais organizados.<\/p>\n Ap\u00f3s tomar sua decis\u00e3o, o Elementor adicionar\u00e1 esta Se\u00e7\u00e3o ao seu layout. Para mover esta Se\u00e7\u00e3o para um novo site, d\u00ea um clique e ent\u00e3o pegue o cabo azul pontilhado que aparece.<\/p>\n Para editar uma se\u00e7\u00e3o, simplesmente clique em Control-clique neste cabo azul pontilhado. Isto ir\u00e1 lan\u00e7ar um menu de contexto, onde voc\u00ea pode fazer mudan\u00e7as simples, como copiar ou apagar a Se\u00e7\u00e3o selecionada.<\/p>\n Suponha que voc\u00ea queira fazer edi\u00e7\u00f5es mais complexas, controle – clique na alavanca azul e selecione Edit Section<\/strong>. A barra lateral do Elementor agora ser\u00e1 atualizada para exibir todas as mudan\u00e7as adicionais que voc\u00ea pode fazer nesta Se\u00e7\u00e3o.<\/p>\n Voc\u00ea tamb\u00e9m pode adicionar widgets a esta se\u00e7\u00e3o. Na barra lateral Elementor, encontre o widget que voc\u00ea quer usar e arraste-o para a tela principal.<\/p>\n Enquanto voc\u00ea estiver arrastando o widget, o Elementor ir\u00e1 destacar todas as diferentes Se\u00e7\u00f5es e Colunas onde voc\u00ea pode soltar este item. Quando voc\u00ea estiver pronto, simplesmente solte seu mouse. o Elementor ir\u00e1 agora adicionar este widget \u00e0 sua Se\u00e7\u00e3o escolhida.<\/p>\n Voc\u00ea pode usar o Elementor para editar as configura\u00e7\u00f5es de todo o seu site. Isto inclui a mudan\u00e7a da fonte padr\u00e3o<\/a> e das cores HTML<\/a>. Voc\u00ea tamb\u00e9m pode modificar as bordas e sombras que o WordPress adiciona a elementos como as imagens do seu site.<\/p>\n Ajustando essas configura\u00e7\u00f5es no n\u00edvel do site, voc\u00ea pode garantir uma apar\u00eancia consistente em todo o seu site WordPress. Este processo tamb\u00e9m \u00e9 significativamente mais r\u00e1pido e f\u00e1cil do que aplicar estas mudan\u00e7as p\u00e1gina por p\u00e1gina. Para visualizar as configura\u00e7\u00f5es dispon\u00edveis no site, clique no menu hamb\u00farguer na barra lateral do Elementor.<\/p>\n Agora voc\u00ea pode explorar suas op\u00e7\u00f5es e fazer quaisquer mudan\u00e7as necess\u00e1rias. Quando voc\u00ea estiver pronto para publicar suas novas configura\u00e7\u00f5es do site, clique no bot\u00e3o Update<\/strong>, na parte inferior da barra lateral do Elementor.<\/p>\n Enquanto voc\u00ea est\u00e1 editando seus projetos, a Elementor est\u00e1 silenciosamente registrando suas mudan\u00e7as. Voc\u00ea pode facilmente recuperar suas edi\u00e7\u00f5es, o que pode ser um salva-vidas se voc\u00ea perceber que cometeu um erro.<\/p>\n O registro de hist\u00f3rico do Elementor tamb\u00e9m lhe d\u00e1 a liberdade de experimentar. Voc\u00ea pode testar v\u00e1rias mudan\u00e7as e depois remov\u00ea-las rapidamente. Ao encoraj\u00e1-lo a experimentar, o Elementor pode melhorar a qualidade de seus projetos acabados<\/a>.<\/p>\n Para ver o log do Elementor, clique no \u00edcone History<\/strong>\u00a0na parte inferior da barra lateral. A guia Actions<\/strong>\u00a0registra cada mudan\u00e7a que voc\u00ea faz no Elementor. Isto pode ser qualquer coisa, desde a cria\u00e7\u00e3o de uma nova se\u00e7\u00e3o at\u00e9 a edi\u00e7\u00e3o de textos existentes:<\/p>\n Toda vez que voc\u00ea pressiona Save<\/strong>, o Elementor registra a vers\u00e3o atual da sua p\u00e1gina como uma nova revis\u00e3o. Voc\u00ea pode ver todos esses instant\u00e2neos na aba Revisions<\/strong>. Se voc\u00ea quiser reverter para uma revis\u00e3o anterior, basta encontr\u00e1-la na lista de Revisions<\/strong>\u00a0e clicar sobre ela.<\/p>\n Agora que voc\u00ea est\u00e1 familiarizado com o fluxo de trabalho essencial do Elementor, vamos ver como voc\u00ea pode usar este know-how para projetar algumas p\u00e1ginas novas. Primeiro, vamos cobrir a cria\u00e7\u00e3o de uma p\u00e1gina WordPress padr\u00e3o usando o plugin gratuito do Elementor. Depois veremos como voc\u00ea pode desenvolver uma p\u00e1gina de produto de alta convers\u00e3o usando o WooCommerce e o Elementor Pro.<\/p>\n Cada p\u00e1gina da web \u00e9 diferente. Entretanto, h\u00e1 alguns elementos comuns que voc\u00ea encontrar\u00e1 em v\u00e1rios sites. Isto inclui cabe\u00e7alhos, corpo de texto e m\u00eddia, como imagens<\/a>. Vamos ver como voc\u00ea pode criar uma p\u00e1gina com estes componentes cr\u00edticos.<\/p>\n Para come\u00e7ar, crie uma nova p\u00e1gina navegando em Pages > Add New > Edit with Elementor<\/strong>. A seguir, adicione uma Se\u00e7\u00e3o ao seu design clicando no \u00edcone +<\/strong>. Vamos come\u00e7ar com nosso cabe\u00e7alho, ent\u00e3o vamos querer optar por um layout de uma \u00fanica coluna.<\/p>\n Na barra lateral do Elementor, encontre o widget Heading. Agora, arraste e solte este widget em sua nova se\u00e7\u00e3o. Voc\u00ea pode ent\u00e3o digitar seu texto de cabe\u00e7alho na barra lateral do Elementor e usar v\u00e1rias configura\u00e7\u00f5es para dar estilo ao seu t\u00edtulo.<\/p>\n Ent\u00e3o, clique no \u00edcone +<\/strong> para adicionar uma segunda se\u00e7\u00e3o. N\u00f3s vamos incorporar uma imagem e ent\u00e3o fornecer algum texto de suporte, ent\u00e3o agora n\u00f3s vamos optar por um layout com v\u00e1rias colunas.<\/p>\n Em seguida, arraste o widget do Editor de Texto da barra lateral do Elementor, e solte-o nesta nova se\u00e7\u00e3o. Voc\u00ea pode ent\u00e3o adicionar e estilizar seu texto usando as configura\u00e7\u00f5es da barra lateral.<\/p>\n Quando voc\u00ea estiver satisfeito com o seu texto, encontre o widget Imagem. Mais uma vez, use o arrastar e soltar para adicionar este widget \u00e0 sua Se\u00e7\u00e3o.<\/p>\n Na barra lateral, clique na miniatura de visualiza\u00e7\u00e3o. Agora voc\u00ea pode usar a Biblioteca de M\u00eddia do WordPress para carregar uma nova imagem ou escolher um gr\u00e1fico previamente carregado.<\/p>\n Para ver seu projeto em a\u00e7\u00e3o, clique no \u00edcone do olho na parte inferior da barra lateral do Elementor. Isto exibe uma pr\u00e9via do layout da sua p\u00e1gina em uma nova aba.<\/p>\n Quando voc\u00ea estiver satisfeito com o seu projeto, clique no bot\u00e3o Publish<\/strong>. Note que se a sua p\u00e1gina j\u00e1 estiver ao vivo, este bot\u00e3o ir\u00e1 pedir que voc\u00ea Update<\/strong>\u00a0em seu lugar.<\/p>\n Se voc\u00ea estiver administrando uma loja WooCommerce<\/a>, voc\u00ea pode usar o Elementor Pro para criar uma p\u00e1gina de produto personalizada. Isto pode envolver a modifica\u00e7\u00e3o da p\u00e1gina de WooCommerce de estoque para refletir melhor a marca do seu site. Alternativamente, voc\u00ea pode estar tentando otimizar sua p\u00e1gina para conduzir mais convers\u00f5es.<\/p>\n Para projetar uma p\u00e1gina de produto WooCommerce personalizada, selecione Templates<\/strong> no painel do WordPress. Em seguida, clique no bot\u00e3o Add New<\/strong>. Na pr\u00f3xima janela, abra o primeiro menu suspenso e selecione Single Product<\/strong>.<\/p>\n D\u00ea um nome descritivo ao seu novo modelo e clique em Create Template<\/strong>. Isto lan\u00e7ar\u00e1 a biblioteca do Elementor com todos os designs de Produtos \u00danicos dispon\u00edveis.<\/p>\n Para dar uma olhada mais de perto em um modelo, passe o mouse sobre ele e depois clique no \u00edcone da lupa quando ele aparecer. Se voc\u00ea quiser aplicar este desenho na sua loja, clique em Insert<\/strong>.<\/p>\n Os templates do Elementor apresentam uma gama de componentes prontos para uso. Para editar qualquer um desses elementos, basta clicar sobre eles. A barra lateral do Elementor ser\u00e1 atualizada para exibir todas as configura\u00e7\u00f5es para aquele item em particular.<\/p>\n O Elementor Pro fornece uma gama de widgets de WooCommerce<\/a> que voc\u00ea pode adicionar aos seus designs. Para ver o que est\u00e1 dispon\u00edvel, v\u00e1 para as se\u00e7\u00f5es WooCommerce<\/strong> ou Product<\/strong>\u00a0na barra lateral do Elementor.<\/p>\n Estas se\u00e7\u00f5es incluem widgets com funcionalidades avan\u00e7adas embutidas, tais como WooCommerce Breadcrumbs<\/a>, Cart, e Checkout. Para adicionar estes elementos ao seu design, simplesmente arraste-os para a tela do Elementor e solte-os. Voc\u00ea pode ent\u00e3o soltar o widget na se\u00e7\u00e3o onde voc\u00ea quer exibir este conte\u00fado.<\/p>\n Quando voc\u00ea estiver satisfeito com o seu projeto, clique em Publish<\/strong>. Voc\u00ea pode ent\u00e3o selecionar Add Condition<\/strong>\u00a0e especificar as \u00e1reas onde voc\u00ea quer usar este design. Por exemplo, voc\u00ea pode aplicar este modelo a uma categoria espec\u00edfica de produto ou us\u00e1-lo em toda a sua loja.<\/p>\n Os templates Elementor s\u00e3o P\u00e1ginas e Blocos pr\u00e9-desenhados que simplificam o processo de cria\u00e7\u00e3o do site. P\u00e1ginas s\u00e3o layouts de conte\u00fado completo, enquanto Blocos s\u00e3o Se\u00e7\u00f5es que cont\u00eam widgets pr\u00e9-constru\u00eddos. Alguns exemplos populares de Blocos incluem cabe\u00e7alhos, rodap\u00e9s, revis\u00f5es e testemunhos<\/a>, e Perguntas Frequentes (FAQs<\/a>).<\/p>\n O plugin livre do Elementor vem com mais de 100 templates de p\u00e1gina inteira e mais de 300 Blocos. Se voc\u00ea atualizar para o Elementor Pro, voc\u00ea ter\u00e1 acesso a algumas op\u00e7\u00f5es adicionais.<\/p>\n Clique no \u00edcone Adicionar Modelo para aplicar um modelo ao seu projeto atual. Este bot\u00e3o deve aparecer como parte de cada bloco de Se\u00e7\u00e3o e \u00e9 representado por uma pasta branca. Isto ir\u00e1 lan\u00e7ar a Biblioteca do Elementor.<\/p>\n Aqui, voc\u00ea encontrar\u00e1 todos os templates de bloco e p\u00e1gina que voc\u00ea pode aplicar \u00e0 sua p\u00e1gina. Voc\u00ea pode pr\u00e9-visualizar qualquer modelo, passando o mouse sobre ele e clicando em seu \u00edcone de lupa.<\/p>\n Quando voc\u00ea encontrar um modelo que voc\u00ea deseja usar, clique em Inserir<\/strong>. Se voc\u00ea n\u00e3o tiver se conectado previamente \u00e0 biblioteca de templates do Elementor, o popup pedir\u00e1 que voc\u00ea complete esse passo.<\/p>\n Ap\u00f3s fazer esta conex\u00e3o, o Elementor ir\u00e1 inserir o modelo que voc\u00ea escolheu. Agora voc\u00ea pode customiz\u00e1-lo. Por exemplo, voc\u00ea pode adicionar mais widgets ou excluir qualquer conte\u00fado de espa\u00e7o reservado.<\/p>\n O Elementor vem com uma ampla sele\u00e7\u00e3o de templates prontos para uso. No entanto, \u00e0s vezes voc\u00ea pode ter um olhar particular em mente. Nesse cen\u00e1rio, voc\u00ea pode preferir desenhar seus templates.<\/p>\n Criar seus projetos pode garantir a consist\u00eancia em todo o seu site. Voc\u00ea pode at\u00e9 mesmo usar templates para acelerar o design e o desenvolvimento se voc\u00ea for uma ag\u00eancia WordPress. Por exemplo, voc\u00ea pode construir uma biblioteca de templates que apresentam todo o conte\u00fado e configura\u00e7\u00f5es que voc\u00ea normalmente aplica aos sites de seus clientes. Voc\u00ea pode ent\u00e3o usar estes templates como ponto de partida para todos os projetos futuros.<\/p>\n Para come\u00e7ar, selecione Templates<\/strong> no painel do WordPress. Depois, clique em Add New<\/strong>.<\/p>\n No popup subsequente, abra o primeiro menu suspenso e escolha o tipo de modelo que voc\u00ea deseja criar. Suas op\u00e7\u00f5es s\u00e3o Page<\/strong>, Section<\/strong>, ou Landing Page<\/strong>.<\/p>\n Em seguida, d\u00ea um nome descritivo a este projeto e clique em Create Template<\/strong>. Isto ir\u00e1 lan\u00e7ar o construtor de p\u00e1ginas padr\u00e3o do Elementor. Agora voc\u00ea pode construir seu template da mesma forma que voc\u00ea criaria uma p\u00e1gina normal. Basta adicionar Se\u00e7\u00f5es, Colunas e widgets at\u00e9 que voc\u00ea esteja satisfeito com seu layout.<\/p>\n Para salvar este design como um modelo, clique na seta que aparece ao lado do bot\u00e3o Update\/Publish<\/strong>. Voc\u00ea pode ent\u00e3o selecionar Save as Template<\/strong>.<\/p>\n Este projeto agora ser\u00e1 salvo na biblioteca do Elementor. Voc\u00ea pode acess\u00e1-la lan\u00e7ando a biblioteca e selecionando a aba My Templates<\/strong>.<\/p>\n![\"Construtor](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-wordpress-plugin.png\")
![\"P\u00e1gina](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-web-templates.png\")
Elementor Free vs Elementor Pro<\/h2>\n
![\"Op\u00e7\u00f5es](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-pro-homepage.png\")
![\"Biblioteca](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-block-templates.png\")
![\"Elementor](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-theme-builder.png\")
![\"Elementor](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/woocommerce-builder-homepage.png\")
![\"Elementor](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-experts-network.png\")
Como instalar o Elementor<\/h2>\n
![\"Elementor](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-wordpress-sidebar.png\")
Como conectar o Elementor Pro ao WordPress<\/h3>\n
![\"Criar](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-pro-setup.png\")
![\"Download](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-download-zip.png\")
Usando o Elementor: 4 tarefas essenciais para dominar<\/h2>\n
1. Abra o Elementor Page Builder<\/h3>\n
![\"Editar](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/edit-with-elementor-1.png\")
![\"Elementor](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-page-builder.png\")
2. Adicione se\u00e7\u00f5es, colunas e widgets<\/h3>\n
![\"Adicione](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-section-structure.png\")
![\"Selecione](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-column-structure.png\")
![\"Adicione](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/edit-elementor-section.png\")
![\"Edi\u00e7\u00f5es](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-edit-section.png\")
3. Edite as configura\u00e7\u00f5es do seu site<\/h3>\n
![\"Ajustar](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-site-settings.png\")
4. Verifique seu hist\u00f3rico de revis\u00f5es<\/h3>\n
![\"Visualizando](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-revision-history.png\")
Como construir uma p\u00e1gina no Elementor (2 m\u00e9todos)<\/h2>\n
1. Como criar uma p\u00e1gina padr\u00e3o para WordPress<\/h3>\n
![\"Criar](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-single-column.png\")
![\"Estilize](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-heading-widget.png\")
![\"Adicione](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-two-column.png\")
![\"Arrastar](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-image-widget-.png\")
![\"Visualize](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-design-preview.png\")
2. Como criar uma p\u00e1gina de produto WooCommerce<\/h3>\n
![\"WooCommerce](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-single-product-.png\")
![\"Projetos](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/single-product-templates.png\")
![\"Passe](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/insert-page-template.png\")
![\"Componentes](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-edit-woocommerce.png\")
![\"Widgets](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/woocommerce-elementor-widgets.png\")
![\"Widgets](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/woocommerce-cart-widget.png\")
Como encontrar e instalar templates pr\u00e9-moldados do Elementor<\/h2>\n
![\"Elementor](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/faq-elementor-blocks.png\")
![\"Adicione](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-template-library.png\")
![\"Passe](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-404-block.png\")
![\"Conecte-se](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/connect-template-library-.png\")
Como construir templates com o Elementor<\/h2>\n
![\"Adicione](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-templates-new.png\")
![\"Escolha](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/landing-page-template.png\")
![\"Salvar](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/save-as-template.png\")
![\"Encontre](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/my-templates-library.png\")
![\"Transformando](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/block-template-save-.png\")
![\"Op\u00e7\u00f5es](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-navigator-menu.png\")
![\"Elementor](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/keyboard-shortcuts-hotkeys.png\")