Criação de sites Masterclass (completo): usando WordPress e Elementor

1. Visão geral rápida: Aprender a criar um site é definitivamente importante. Mas o que é mais importante é aprender da maneira certa. Simplesmente saber sobre WordPress e Elementor não será suficiente. Você precisa saber que três etapas quadro de criação de site. Ei, mas o que é esse quadro de criação de sites de três passos? Eu, meu nome é neurônio viajante, e neste curso, Eu vou ajudá-lo a aprender tudo o que é necessário para criar um site incrível sem qualquer codificação, usando WordPress e elemental. Os sites que você criará não serão apenas incríveis InDesign, mas também serão super responsivos para que funcionem corretamente em todos os diferentes tipos de dispositivos. A melhor parte deste curso é que você vai aprender sobre o quadro de criação de sites de três passos. Bem, este é um sistema que é seguido pelos principais desenvolvedores web do mundo. Antes de lhe dar uma rápida visão geral do curso, deixe-me dizer-lhe que tudo isto vai ser um curso prático para si. Você estará usando o nome de domínio gratuito e a conta de hospedagem para criar sites sozinho. E eu sou CIO que você vai criar alguns sites incríveis. Vamos começar o curso com a aprendizagem dos conceitos básicos como seção site mais disciplina de uma página web. E então vamos aprender alguns conceitos importantes como UI e UX. O erro de digitação da teoria colorida lá se ANC as configurações de layout base. Depois disso, você aprendeu alguns conceitos de fone que estão relacionados com copywriting e design gráfico. Sim, estas são algumas coisas adicionais, mas é uma parte muito importante deste curso. Depois disso, ficamos famintos o processo de criação de sites de três passos com o passo número 1, que é descobrir e entender o mercado. O segundo passo seria projetar o site usando um site projetando ferramentas como Figma e Adobe XD na verdade, qualquer outro design gráfico dual sobre passo final seria desenvolver o site usando WordPress. E eu acho que o meu cão, sem qualquer codificação. Vou guiá-lo através da versão gratuita do Elementor, bem como da versão Pro do elemental. Você estará aprendendo não apenas desenvolvendo as páginas da Web, mas também como configurar um blog, como criar páginas de destino e indicar o site com o Google Tag Manager, Search Console e analytics Jaguars e outras coisas. Perto do final do curso, vou compartilhar alguns dos mais importantes conjuntos de práticas como reduzir o tempo de carregamento do site. E também vou compartilhar como você pode criar sua própria agência de marketing digital, criar sites para clientes e quanto você pode cobrar aos clientes. Então, se você é alguém que quer Monster os sites de alimentação AGA sem qualquer codificação, usando WordPress e acabar para fazer DOD. Junto com alguns conceitos como qubit, eu não adicionei design gráfico, então este é o objetivo para você. Se eu fizer sentido para você, quero que comece agora mesmo. 2. Configuração e preparação para o curso: O objetivo principal deste curso é aprender a criar um site perfeito de pixel que é bonito e funcional de design e usá-lo otimizado para dispositivos como celular e tablet com uma velocidade de carregamento rápida. Vamos conseguir isso seguindo o processo de criação de sites em três etapas. Tenha em mente que seu objetivo é criar sites perfeitos de forma rápida e fácil sem qualquer codificação. O propósito deste curso pode variar de acordo com suas expectativas, mas garanto que se você seguir esses passos, sua vida pode ser transformada. Um aluno pode facilmente conseguir um emprego ou começar a trabalhar como freelancer depois de concluir este curso. Um freelancer pode fornecer serviço de desenvolvimento de sites aos clientes. Um profissional que trabalha pode começar renda passiva, e um empreendedor pode criar um site para seu próprio negócio sem pagar muito dinheiro a qualquer agência digital. Oportunidades são muitas, e eu tenho certeza que você vai agarrá-la. Estou sempre aqui para ajudá-lo a este respeito e sinta-se livre para se conectar comigo para obter ajuda. Falando sobre a preparação para o curso, quero que você estabeleça marcos. O primeiro marco poderia ser o domínio descoberto, onde você será capaz de entender o público-alvo e analisar os sites concorrentes de forma eficaz. próximo marco pode ser a parte de design que pode empreender alguns esforços, mas estou aqui para ajudá-los e guiá-los. próximo marco seria a etapa de desenvolvimento, que é relativamente fácil uma vez que você está confortável com o processo de design de descoberta. Espere. Mas qual é o marco final? O marco final seria a aplicação de tudo o que você aprendeu neste curso. Sim. Você terá que aplicar os conceitos e completar um site de prática. Isso será um site de demonstração. Vou rever pessoalmente esse site e dar-lhe feedback sobre o seu trabalho. Então este vai ser um curso prático e eu vou ajudá-lo na criação de um site de prática gratuitamente. Você estará usando um domínio gratuito e uma conta de hospedagem gratuita para configurar seu site de prática e sinta-se livre para experimentar nesse site porque ele vai ser o campo de aprendizagem para você. Houve tantos congelamentos nas últimas frases que falei. Então você está recebendo tantas coisas de graça. Sinto-me bem. Quanto mais você experimentar em seu site de prática, melhor será sua aprendizagem. Além disso, usaremos algumas ferramentas para projetar isso. Vou informá-lo passo a passo nas próximas lições. Então acredito que estamos prontos para começar a aprender. E eu vou vê-lo no próximo vídeo onde vamos começar as fundações e aprender alguns conceitos básicos e teorias. Você disse alguma coisa? Não elejam teorias porque são chatas. Ou sei que pode ser um pouco difícil para você, mas essas teorias e conceitos são a base do seu sucesso, certo? Para apreciá-los e compreender profundamente os conceitos para uma melhor aprendizagem deste curso. Vejo você no próximo vídeo. 3. Algumas ferramentas de produtividade importantes: Nesta lição, quero falar sobre algumas ferramentas que podem ser usadas para fazer anotações, estratégias e planejar seu aprendizado mostrou a você. Isso irá ajudá-lo muito na organização dos conceitos que você vai aprender neste curso. Por exemplo, vamos ver os conceitos que discutimos na lição anterior na forma de um fluxograma, um mapa mental, em um formulário de lista, ou em algum aplicativo editor de texto como Grammarly. Permitam-me que lhes dê uma visão geral muito rápida destas ferramentas. A primeira ferramenta que quero dizer é desenhar ponto io. Isso é usado para criar fluxogramas e eu usá-lo para organizar meu plano de marketing e estratégias. É gratuito e tem uma versão offline, bem como que você pode baixar e instalar em seu computador. Esta é a tela em branco e você pode inserir formas. Insira texto nessas formas clicando duas vezes no centro, organizando-as e faça conexões. Sinta-se livre para adicionar quantas formas quiser e organizar o gráfico de forma organizada. Você pode jogar com esse estilo e configurações de texto para torná-lo bonito. E você também pode ajustar o alinhamento das formas. Sinta-se à vontade para explorar mais formas e adicionar páginas ao seu documento. Uma vez feito, você não precisa salvá-lo porque o documento já está sendo salvo automaticamente. A próxima ferramenta é minha, Sr. É um freemium dual, que significa que ele tem uma versão gratuita, bem como uma versão paga. Aqui você pode criar estruturas de mapas mentais para brainstorming, anotações, tomadas, planejamento de projetos e muitas outras tarefas criativas. Eu o uso para criar currículo e currículo dos meus cursos. A próxima ferramenta ainda está baixa. Ele é usado para criar quadros, listas e cartões para ajudá-lo a organizar projetos de forma criativa. E é uma ótima ferramenta para colaborar quando você tem uma equipe de pessoas. A última ferramenta que quero contar nesta lição é gramatical. É uma ferramenta de escrita com o Assistente de Escrita que ajuda você a escrever claro e livre de erros gramaticais. Estou falando sobre a gravidade porque é a forma tradicional de fazer anotações escrevendo tudo o que você aprendeu. Obviamente, você pode usar qualquer outra ferramenta de edição de texto como MS Word. Mas se você quer um assistente de escrita para ajudá-lo com erros gramaticais, use Grammarly. Uma vez que você vai aprender muitos novos tópicos e conceitos, Eu quero que você organize sua aprendizagem para que seja fácil para você criar apenas digitalizando um fluxograma ou um documento. Espero que essas ferramentas sejam úteis para você e continuaremos com os fundamentos do site no próximo vídeo. 4. O que é um site: Existem 4,7 bilhões de pessoas no mundo que estão usando a Internet hoje. Eles estão gastando tempo em obter informações, comprando produtos, serviços, assistindo vídeos, interagindo em conversas com pessoas em mídias sociais, mensagens instantâneas e grandes, pequenos. Portanto, é uma oportunidade para você criar um site e alcançar milhões de pessoas através da Internet. site, no sentido mais geral, é uma forma de presença na web. Você pode compartilhar o conteúdo na forma de texto, gráficos e vídeos em seu site e se conectar com pessoas ao redor do mundo. Considere Internet como um mercado e um site é a sua loja. Os clientes podem entrar para obter informações e está aberto 24 por 7. A melhor parte é que um site lhe dá eixo mundial e você não tem limitações para executar suas idéias. Vamos agora entender que tecnicamente conceito de um site. De acordo com a Wikipédia, um site é uma coleção de páginas da web identificadas por um nome de domínio comum e publicadas em um servidor web. Uma página da Web é uma página exclusiva que contém informações e conteúdo na forma de texto, gráficos e vídeos. Então, se uma empresa como neste tempo, Unilever quer fornecer informações sobre seus produtos no site. É possível ter todas as informações em uma única página? - Não. Isso é phi um site contém n número de páginas da web que são categorizados em submenu item de menu para fornecer informações significativas para o usuário de uma forma organizada. Em seguida é o nome do domínio. Se um usuário quiser acessar seu site, ele tem que inserir algum vestido Weber no navegador. É semelhante a alguém que quer chegar à sua casa. Você deve saber como surtos. Portanto, um nome de domínio é um nome exclusivo que forma seu Weber faz. É sempre único e leva a sites específicos. Assim como se alguém morrer no número de celular, ele está conectado a você e a ninguém mais. Apenas certifique-se de que o seu nome de domínio deve ser relevante para a sua oferta. E, ao mesmo tempo, deve ser fácil lembrar e agarrar a atenção. O terceiro e último elemento é um servidor web. Um servidor web é um computador onde os dados, informações e conteúdo de um site são armazenados. Ele responde às solicitações do usuário 24 por 7 na World Wide Web. Sempre que o servidor for desativado, um usuário não poderá acessar o site. Vamos também entender o conceito de hiperlink. Uma vez que há uma série de salários e um site, é importante vincular todas essas peças e formar um menu de navegação. Ou o usuário pode alternar entre várias páginas com o clique de links. Normalmente, a primeira página de um site é chamada de página inicial. E é a página web mais importante em seu site, além da página inicial. O outro, basicamente apenas em um site são a página sobre, serviços, página, produtos, página, página de contato, página de política de privacidade, etc. Cada página da Web tem algumas informações específicas, e essas páginas da Web podem ser facilmente acessadas pelo usuário a partir de um laptop, desktop, tablet ou smartphone usando um navegador da Web. Quando um site é otimizado para todos esses dispositivos diferentes, ele é chamado como um site responsivo. Vamos agora discutir os diferentes tipos de sites. Um site que criamos pode ter objetivos e objetivos diferentes com base em sua ideia. Por exemplo, o principal objetivo de um site de negócios é fornecer informações sobre a empresa de negócios ou qualquer indivíduo que esteja fazendo uma atividade financeira. Até agora, todos os negócios lá fora definitivamente devem ter um site. É uma expectativa generalizada. Todos os potenciais clientes no mercado assumirão que, se fizerem uma pesquisa do Google para qualquer x business procurando mais informações, eles encontrarão seu site. Próximo. O site de comércio eletrônico é onde os usuários podem comprar e fazer compras. Ele deve ter os recursos essenciais como na janela de exibição do produto de navegação, filtragem por categorias, destacando vendas especiais, cartão de compras, lista de desejos e gateway de pagamento para fazer transações on-line. O objetivo principal de um site de águia deve é fazer vendas. Site de blogs. Eles fornecem informações publicando conteúdo exibido em ordem cronológica inversa, que significa que as publicações mais recentes aparecerão primeiro na parte superior. Da mesma forma, você também vai criar um site pessoal, um site de portfólio, site de entretenimento, site notícias, site de diretório de negócios, site de fórum, mídia social de ABS, um site de download digital, site de e-learning e muito mais com base no seu propósito e IDM. Uma vez que estamos discutindo o propósito de um site, eu quero lhe perguntar uma coisa aqui. Por favor, diga-me o que é uma página de destino? Vamos lá. Vá em frente e tente responder. Continue pensando. Continue pensando. Ainda estou à espera da resposta. Ok? Então você não está conectado a mim ao vivo, então você não vai responder. É isso? Não, por favor, não faça este curso assim. Por favor, sinta-se ligado a mim ao vivo e tente responder. Estou dizendo que vai ajudá-lo muito e aprender quando uma página de destino é uma página web dedicada com um propósito muito específico. Ao contrário das páginas típicas da Web, que eu tenho muitas opções de navegação e encorajo a exploração, as páginas de destino são projetadas com uma chamada à ação específica. Em uma página de destino, queremos que nossos usuários tomem a ação desejada que podemos considerar como uma conversão para nós. Por exemplo, a página de destino da Shopify quer que você inicie a avaliação gratuita e é a única ação de etiqueta nesta página da Web. Parece que pelos EUA, eles querem que você comece um teste gratuito e nada mais. Você pode até mesmo construir um ímã de chumbo desta forma e fornecer algum brinde em troca de suas informações de e-mail. Desta forma, você pode orientar os visitantes do seu site para que tomem medidas específicas e cumpram um propósito específico como parte de seu funil de marketing ou vendas. Pessoalmente, criar uma página de destino é minha tarefa favorita. Qual é a sua leitura para a sua resposta antes do próximo vídeo? 5. Estrutura de uma página web: Se falamos sobre a estrutura básica de uma página web, podemos facilmente dividir uma página web em três seções principais. número 1 é o cabeçalho, número 2 é a área de conteúdo principal e o número três é a pasta. Agora, o pastor é a seção mais alta de uma página da Web e geralmente é consistente para todas as páginas da web no site. Isso significa que você tem que projetar uma cabeça de uma só vez e o mesmo somador será visível em todas as páginas do site. Na seção de cabeçalho, você vai encontrar o logotipo e é geralmente colocado à esquerda são posição centrada. Certifique-se de vincular a página inicial, fazer o logotipo. Isso significa que se um usuário clicar no logotipo, ele é redirecionado para a página inicial do site. Em seguida, você encontrará um menu de navegação na seção de cabeçalho. É geralmente o menu principal do site e ajuda o usuário na alternância entre as várias páginas da web. As opções de menu também pode ter sub-menu para categorizar as páginas e fornecer uma navegação mais lógica. design do menu de navegação já está em tendência é o mega menu. Se você tem um grande site com várias categorias e subcategorias do que arma mega menu mostrar toda a navegação em um único menu. Ele também melhora a exibição visual do menu, tornando-o mais atraente. Você também pode encontrar um botão no canto do menu de navegação, e ele funciona como uma chamada à ação para o visitado. A propósito, deixa-me fazer-te uma pergunta. O que isso chama à ação? Vamos, dê uma chance. Ok. Portanto, um apelo à ação, ou CTA é a ação desejada que queremos que nossos visitantes tomem no site. Geralmente é destacado para se destacar dos outros conteúdos e orienta o visitante com o que fazer a seguir no site. Você também pode encontrar links de mídia social na seção de cabeçalho para incentivar os visitantes a se conectarem com o marrom nas mídias sociais. Agora, para adicionar mais espaço para a seção de cabeçalho e acima hidrodissecção e uma seção de cabeçalho abaixo é satisfeito. Eles também são bastante úteis se houver mais informações para mostrar no topo da página. Lake, você pode mostrar as ofertas especiais com um elemento de urgência, um avisos importantes na seção de cabeçalho acima. Você também pode reproduzir as informações de contato e os links de mídia social na seção. O outro que está abaixo de uma dissecção que pode ser usado para mostrar o menu secundário ou qualquer informação adicional. É sua escolha para exibir essas seções em todo o site ou alguns betas específicos. Agora deixe-me falar sobre alguns projetos de cabeçalho amigáveis. O primeiro é cabeçalho pegajoso. Ele coloca o cabeçalho primário na parte superior da tela. Sempre que um visitante escolas para baixo na página web, ele diz que fornece um acesso rápido ao menu de navegação sem ter que rolar novamente para o topo. Próximo projeto cabeçalho é definido cabeçalho transparente. Parece muito legal e dar algum campo moderno para o design do site. Eu, pessoalmente, gosto muito disso. Então, isto era sobre a primeira seção da página web. Agora vamos discutir o próximo. Essa é a área de conteúdo principal. Também é chamado como o corpo da página web. É a seção mais flexível do site e você tem total liberdade para projetá-lo como parte do propósito do site. Em uma página web, você sempre quer mostrar informações específicas relacionadas ao título da página, como e sobre o espaço terá informações sobre o perfil e a página Fale Conosco terá detalhes de contato. Mas você pode projetá-lo livremente usando texto, imagens, gráficos e vídeos para transmitir as informações da maneira mais eficaz. Esta área de conteúdo principal é projetada colocando seções e colunas. Todo o conteúdo, como texto, imagens, vídeos e outros elementos, são colocados dentro das seções e colunas. As seções controlam a área vertical que é de cima para baixo e as colunas controlam a área horizontal que é da esquerda para a direita. A primeira seção de uma página da Web é chamada como a seção de herói, e ela contém a imagem de herói. É o primeiro conteúdo que um visitante vê no site. Todos nós entendemos muito bem que a primeira impressão é a maior impressão. Assim, todos os sites devem garantir que o design da seção herói deve ter um impacto desencadeante e deve gerar uma sensação de confiança e credibilidade na mente do visitante. A seção de heróis deve degenerar e emoção para motivar o visitante a explorar mais conteúdo no site e, eventualmente, tomar uma ação. Após a seção de heróis, você pode inserir várias outras seções como as demandas de conteúdo da página da Web. Como geralmente encontramos um breve resumo dos produtos da página, serviços, recursos, preços, Galeria de Mídia e depoimentos na página inicial. Se você me perguntar sobre o comprimento de uma página web, eu diria que uma página web pode ser o tempo que você quiser, mas sempre tentou fornecer informações no menor comprimento possível porque os visitantes estão sempre ocupados e VKC não pode dar ao luxo de desperdiçar seu tempo em tudo. Seja o mais criativo possível para que continue a ser o mais fácil para o visitante entender o que você quer dizer. Mas no mínimo tempo, a última seção na página da web é chamada como infalível. O objetivo de um rodapé do site é ajudar os visitantes adicionando informações e opções de navegação na parte inferior da página da Web. Como os visitantes têm uma tendência geral para rolar rapidamente a página web e atingiu a mediana inferior. É o lugar ideal para colocar o ano atual e o símbolo de direitos autorais. No entanto, você também pode colocar os menus sociais de navegação secundária Huygens, links para a política de privacidade e outras páginas legais, isenção de responsabilidade, detalhes de contato, formulários de inscrição por e-mail e até mesmo um call-to-action final. Então deixe-me resumir a aprendizagem neste vídeo. Ao criar um site, você tem que se concentrar nas três seções principais de uma página web, o cabeçalho, a área de conteúdo principal e a comida. Eu recomendo que você comece com a concepção do cabeçalho e rodapé primeiro porque eles permanecem os mesmos para todas as páginas do site. E, em seguida, começar a projetar a área de conteúdo principal, uma vez que será diferente para cada página web. Vamos aprender mais sobre os conceitos de design nos próximos vídeos. 6. UI (interface de usuário) e UX (experiência usuário (experiência usuário) (UIS) (UIS): O cabeçalho e rodapé serão consistentes para o site, mas a área de conteúdo principal deve ser projetada para cada página. E projetar é muito importante para o site. Você precisa ter um objetivo claro para o site e projetar cada página da web em conformidade. É muito importante. Caso contrário, você estará perdido no oceano de design e isso se tornará uma tarefa bastante frustrante para você. Portanto, sempre joga uma âncora antes de iniciar a tarefa de design. Tenha sempre um objetivo claro de conversão para o site e projetar as páginas da web em conformidade. Isso significa decidir sobre as ações importantes que um visitante deve tomar no site. Isso pode incluir fazer uma pergunta no chat, enviar um e-mail, inscrever-se em um boletim informativo, baixar um eBook, iniciar um teste gratuito, explorar mais conteúdo no site ou qualquer outra ação importante, como parte do funil de marketing ou vendas. Outra razão para mostrar informações claras e específicas na página web é o concurso Internet. Há tantos sites lutando pela atenção do usuário. E o tempo médio de um visitante do site é muito curto. Em algum lugar por volta de sete a oito segundos. Isso significa que se um visitante visita seu site e ele não encontrá-lo para ser envolvente ou convincente o suficiente para explorar mais conteúdo. Basta fechar a guia e afastar-se. Por isso, é muito importante para você projetar o site que é visualmente atraente, envolvente e utilizável para incentivar os visitantes a gastar tempo e tomar medidas. Se eles tomarem ações no site, ele será considerado como uma conversão. Vamos tentar entender o processo de concepção de uma página web. Começa sempre por compreender o ideal visitado. Vamos lá, pense que o visitante ia visitar o site. Suas expectativas, seus valores, tentaram simular sua interação com o site. Mais ações que eles preferem tomar. Em que tipo de conteúdo você estará interessado. Texto, gráficos, vídeos, quanto tempo ele preferirá gastar no site? Como você pode guiá-lo para completar uma ação desejada da maneira mais fácil? Como você pode motivá-lo a agir? Tentou definir a referência para a qualidade geral da interação entre esse visitante e um site. Toda esta pesquisa lhe dará feedback e dados importantes para ajudá-lo a planejar o design da página web. Avançando mais, o processo de design pode ser dividido em dois segmentos. Uma é a interface do usuário e a outra é a experiência do usuário. Você inicia o processo de design selecionando as cores, telefones, imagens , gráficos e layout para tornar o site bonito e consistente. Isso é chamado como projetar a interface do usuário ou interface do usuário. Representa o site visual ou gráfico do design do site. Em seguida, você tem que otimizar o design da interface do usuário para melhorar a experiência do visitante quando eles interagem com o site. É mais ou menos uma sensação de taxa. O visitante deve se sentir confortável enquanto navega no site, lendo o conteúdo, assistindo as cores, vídeos , imagens, ele deve desenvolver uma sensação de credibilidade. Você tem que incorporá-los a motivação que ele precisa para tomar ações no site. Ele deve acreditar que ele está recebendo valor do site. Isso é chamado como projetar a experiência do usuário ou UX. Se eu explicar a experiência do usuário para você em apenas duas palavras, seria uma experiência fácil e agradável para o visitante na interação com o site. A interface do usuário é, na verdade, uma parte da experiência do usuário. Portanto, para garantir que você esteja obtendo os melhores resultados do design do site, é importante focar tanto na interface do usuário quanto na UX. Concentrando-se na interface do usuário ajudará a tornar o site bonito, terra consistente. Considerando que o foco em UX tornará a experiência fácil e agradável para o visitante. Os três conceitos mais importantes para dominar no design da interface de usuário de um site é selecionar as cores, tipografia e layout. E nós estaremos aprendendo esses conceitos nas próximas lições. Pelo nome, você pode começar a pensar sobre o visitante ideal do site e tentou criar pesquisas de mercado. Vejo você no próximo vídeo. 7. A teoria de cores: Bem-vindo ao vazio das cores. As cores são a primeira coisa que as pessoas percebem quando visitam o site e o esquema de cores pode causar um enorme impacto no estilo e na consistência. Então, o que é um esquema de cores? Um esquema de cores é a coleção de cores que precisamos escolher para o design do site. Também é chamado de paleta de cores. Ele pode incluir tantas cores quanto queremos usar no site. Cada cor pode ser usada para uma variedade de elementos em todo o site. Você pode dividir sua paleta de cores nas cores primárias, na cor secundária e na cor de destaque com base no aplicativo e no uso. A cor primária geralmente é a cor mais dominante no site, e uma cor secundária é usada para dar um efeito de contraste. Essas cores são usadas nos fundos de seção e coluna, logotipo, navegação e menu. A cor de destaque é usada para realçar o elemento padrão, como um botão de call-to-action. Se escolhermos as cores certas nas combinações certas, podemos envolver os visitantes para passarem tempo no site e tomarem medidas. As cores também ajudam na criação de uma conexão emocional. Mas o desafio é que há mais de 16 milhões de cores para escolher. E escolher aleatoriamente uma cor pode não funcionar bem em um design de site. Então, a fim de escolher as cores ideais para o site e fazer as combinações de cores certas, vamos usar alguns sinais e aplicar a teoria de cores. Teoria das cores é a ciência e a arte de usar cores. Explica como nós, humanos, percebemos cores diferentes e a mensagem que cada cor comunica. Vamos começar por entender a roda de cores. É uma ferramenta poderosa que pode ajudá-lo a visualizar relações entre cores. De acordo com a teoria das cores, existem três cores primárias, vermelho, amarelo e azul. Estas três cores formam a base de todas as outras cores. Quando misturamos as cores primárias, obtemos três cores secundárias que são laranja, verde e roxo. E quando combinamos as três cores primárias e as três secundárias, obtemos seis cores terciárias. Agora, sempre que começamos a trabalhar em um projeto de site, precisamos experimentar vários alertas e selecionar as combinações de cores mais apropriadas. Também podemos usar o conceito de esquemas de cores para criar a seleção certa de cores. Vamos agora ver os quatro tipos principais de esquemas de cores. O primeiro, esquema de cores monocromáticas. Consiste em várias tonalidades, tons e saturação da mesma cor. Em seguida é o esquema de cores complementar. Baseia-se em duas cores dos lados opostos da roda de cores. Em seguida, é o esquema de cores dos análogos. Consiste em três cores que estão próximas umas das outras na roda de cores. E o último é o esquema de cores triádico. Consiste em três cores que estão nos pontos de um triângulo desenhado dentro da roda de cores. Normalmente, você pode dar preferência aos esquemas de cores complementares e analagosas como eles são eficazes e fáceis de aplicar que os bons contrastes visíveis. Mas sinta-se livre para usar qualquer um desses esquemas de cores em seu design. Avançando, também podemos dividir as cores na roda de cores em duas categorias. Isto é, quente e fresco. Matizes que contêm quantidades mais altas de amarelo e vermelho são consideradas cores quentes. Eles evocam um sentimento de paixão, felicidade, energia, brilho e ação. Por outro lado, os Alertas do Google contêm quantidades maiores de azul e roxo. Eles são considerados mais calmantes e relaxantes do que cores quentes e representam calma, paz e serenidade. Existem também cores neutras, como branco, preto e cinza, para equilibrar o esquema de cores e adicionar contraste ao design. Em seguida, precisamos entender os sistemas de cores porque existem milhões de cores e tanques para sinais, podemos atribuir um código de cor específico para representar cada cor. Os três sistemas de cores padrão usados no projeto de ferramentas e softwares são RGB, CMYK e hexadecimal. O sistema de cores RGB é perfeito para projetos que são vistos em telas. E o código de cor é formado inserindo um valor para vermelho, verde e azul entre 0 e 255. O sistema de cores CMYK é ideal para impressão de design e também é chamado como o abandonado ou sistema composto por valores para ciano, magenta, amarelo e preto entre 0 e 100. O último, que é o sistema de cores hexadecimais é o que está disposto a se concentrar. É um código de seis dígitos que é formado pela conversão dos valores RGB. Usaremos este sistema para selecionar alertas para o site. Suponha que se você conhece os valores RGB de uma cor e deseja convertê-la em hexadecimal. Em seguida, basta fazer uma pesquisa do Google como converter RGB para hexadecimal e você terá muitas ferramentas gratuitas para fazê-lo. Avançando mais, eu não gostaria de levá-lo na profundidade de tons, tons, matiz, saturação e brilho neste curso. Mas deixe-me explicar o conceito de contraste. O contraste é um elemento crucial de qualquer site, especialmente quando se trata de cor de fundo e texto. Para proporcionar uma boa experiência de leitura no site, é o melhor usar um fundo branco e uma cor de texto escuro. Você também pode experimentar um fundo escuro e um texto colorido claro para algumas seções. É assim que os temas claros e escuros funcionam. Agora, vamos tentar fazer as seleções de cores e aplicar um esquema de cores eficaz. Para o seu conhecimento, algumas cores lutam umas com as outras e algumas cores se tornam amigas íntimas. Cores que funcionam bem juntas, criam uma harmonia, contribuem para uma experiência de usuário agradável. Até agora nosso projeto de site, você precisa selecionar as cores primárias e secundárias para o fundo da seção e coluna, logotipo, sobreposições gráficas. O alerta de zinco para call-to-action e x estudiosos para títulos e parágrafos. A fim de listar as cores para seleção. Também podemos usar o conceito de psicologia de cores. Ele fala sobre a influência das cores nos comportamentos e humores das pessoas. Para criar um design bem-sucedido, você precisa estar ciente dos significados das cores e entender como as escolhas de cores podem influenciar seus usuários gerando uma resposta emocional específica. Sim, a pele colorida evoca emoções. Vejamos alguns exemplos. Vermelho é uma garganta forte e enérgica. Pode ser uma cor de declaração negrito se você quiser chamar a atenção imediata do usuário. Na verdade, muitas empresas de alimentos e bebidas usam o vermelho para evocar sentimentos de fome. Indesejado. Laranja é uma bomba e colorido feliz que continua a ser muitos usuários de simpatia e ASM doozy e motivação. Usando laranjas que a cor primária pode resultar em um site altamente memorável que deixa os visitantes com uma impressão positiva. Amarelo é outra cor que simboliza alegria, felicidade e luz solar. Quando usado estrategicamente em seu site, você pode facilmente injetar confiança e inspiração em seu design, mas fazer muito amarelo pode morrer RDAs e até mesmo criar AINE. Portanto, é preferido mantê-lo como uma cor de acento. Verde é uma cor positiva e goma, amplamente associada à Natureza, Ecologia e energia renovadora. Azul está integrado inteligência presente, confiança, calma, eficiência e dever. É uma cor inteligente e uma das cores mais utilizadas na web. Mas algumas das maiores marcas digitais do mundo usando-o como a cor primária. Mas tigela tem sido associada com realeza, luxo e murcha, mas também é um dourado misterioso e mágico combinando a energia do vermelho e azul, pode ser uma excelente opção se você quiser transmitir uma mensagem de poder e confiabilidade. Think é ótimo para produtos femininos ou sites com conteúdo voltado especificamente para mulheres e jovens. Preto cria uma sensação de vidro, glamour, poder, dignidade, e parece veludo, quase todas as outras cores. É excelente para fundos de sites, pois cria um contraste nítido com mais leve, uma biografia. Branco é uma escolha popular para sites minimalistas modernos, pois aumenta a legibilidade e carrega veludo uma águia, e o uso de espaços em branco cria uma sensação de feiúra e tardia. Assim, como visto em nossos exemplos, as cores podem ter muitos significados que ressoam de forma diferente com cada usuário. Portanto, é crucial ter seu público-alvo em mente ao escolher as paletas de cores para o design do site. Deixe-me também dar-lhe algumas dicas profissionais aqui. Comece com a seleção de cores primárias usando o conceito psicológico de cores, ou seu produto ou serviço são o setor em que você está trabalhando. Você precisa pensar sobre o público-alvo e boa reação emocional ao assistir a cor do site. Você também pode pesquisar algumas combinações de cores populares e lista restrita. As escolhas fazem um salto Daddy de cores selecionadas em ferramentas como Canva, Sigma, Illustrator, XD, ou qualquer ferramenta de edição gráfica que você preferir. Em seguida, remova com uma cor secundária e cor de acento aplicando os conceitos de esquemas de cores como monocromático, análogo complementar são triádicos. Você pode fazer uso de ferramentas como roda de cores Adobe, bebeu alertas, cor hospedada, espaço colorido, angularjs, e encontrar algumas das paletas de cores mais populares e combinações de cores para inspiração. Se você não está acertando sozinho, você pode fazer uma pesquisa no Google para as combinações de cores mais populares e populares. Você terá muitas idéias para se inspirar e selecionar cores. Você também deve explorar as comunidades de design como Dribble, Behance e obter algumas idéias novas. Ok? Então, se você gosta de algum colorido em qualquer site e você quer usar a mesma cor, como encontrar o ColorCode? Você pode usar algum plugin do Google Chrome, como eu estou usando o conta-gotas de escolha de cores e eu posso facilmente encontrar o código de cor e usá-lo no meu projeto. Pode levar algum tempo para que você venha com as combinações de cores certas, mas é muito crucial, pois toda a marca do site depende das cores. Depois de terminar a seleção, atualize as paletas na ferramenta de edição gráfica e inicie o processo de design. Permitam-me resumir a aprendizagem desta lição. galerias desempenham um papel vital no design do site e podem evocar emoções. Você pode confiar na teoria das cores para criar baladas harmoniosas e encontrar as combinações de cores certas. Olá, a psicologia é uma técnica poderosa que pode transmitir uma variedade de mensagens aos usuários. Por último, você deve sempre pesquisar seu público-alvo e testar suas diferenças de gole. Compreender o público-alvo é um passo muito importante no processo de design do site. E é por isso que estou repetindo isso de novo e de novo. Por favor, certifique-se de entender o visitante. Quanto mais você os entender, melhor você criará o site. Vamos terminar esta lição aqui e continuaremos no próximo vídeo. 8. Noções básicas da tipografia: Você sabe que os telefones são muito importantes para o design visual do site? Os formulários podem criar uma impressão para os visitantes mesmo antes de começarem a ler o conteúdo. Então vamos aprender alguns conceitos que estão relacionados à arte e técnica de styling para marketing e organizar os telefones, guirlandas, topografia. Uma boa paleografia em nosso site torna o ato de ler sem esforço para os visitantes. Vil, topografia pobre, dançar até as escadas de um. Por isso, é importante usar os telefones certos em um site que parece bem em todos os três tipos de dispositivos que é computado, tablet e telefone celular. O primeiro e o mais importante passo é selecionar os formulários certos que são fáceis de ler. Mas, novamente, é um desafio aqui porque há milhares de famílias estrangeiras e tipos de letra para escolher. Para facilitar o processo de seleção, vamos dividir os telefones em duas categorias. Estes são um conjunto de telefones e formulários sem serif. Assim conjunto de telefones têm serifas ou degradação extra no final dos talos, também chamado Les pés ou caudas. As serifas funcionam muito bem em manchetes e cabeçalhos porque dão um acento especial para que pareça destacado. Alguns dos mais conhecidos conjunto de famílias de formulário incluem telefones como Times New Roman, Georgia, platina, levá-lo e Cliff exibido. Muitas marcas e empresas profissionais costumam usar setters para o logotipo e site quando eles querem parecer mais respeitáveis, estabelecidos, formais. Mas tenha em mente que o conjunto de telefones é fácil ler somente quando usado para quantidades menores de x, como títulos são globais e não nos parágrafos do site. Por outro lado, as formas sans serif são sem conjunto. Isso significa que não há degradação extra no final de cada letra. Eles são usados para transmitir design minimalista, modernidade e, acima de tudo, simplicidade cortada. Desde as reformas ea melhor escolha para usar no corpo de conteúdo principal e parágrafos, como eles são muito fáceis de ler em telas e até mesmo em telas menores de telefones celulares. Algumas das formas sensíveis mais utilizadas incluem evidências, Roboto, Open Sans Source Sans Pro lacto, marcado Sadat, e Proxima Nova. Você pode evitar o uso de formulários de escrita manual, telefones de exibição e formulários monoespaciais, pois eles não são fáceis de ler em telas, especialmente em telas menores de telefones celulares. Para encontrar os melhores telefones que estão disponíveis para uso em sites. Eu recomendarei que você gaste algum tempo em fontes do Google. Esta é uma ferramenta maravilhosa e você vai encontrar uma lista dos formulários mais comumente usados e combinações de emparelhamento comuns juntamente com a visualização. Você também pode verificar os telefones que são usados em outros sites do setor. Sim. Você pode verificar a família do telefone selecionando o texto, clique com o botão direito do mouse e selecionando a opção Inspecionar. Aqui você terá que selecionar a guia elemento e clicar em computado, role um pouco para obter as informações do telefone excluídas. Você encontrará todos os detalhes sobre o telefone que está sendo usado no site, como font-family, font-size, line-height, espaçamento entre letras, telefone colorido e muito mais. Como alternativa, você pode usar um plug-in do Chrome para obter os mesmos detalhes de uma maneira fácil. Atualmente, estou usando o Firm Finder para identificar telefones em qualquer site. Incrível. Agora, para o nosso projeto de site, você terá que selecionar entre um a três telefones. Você usará telefones para títulos, subtítulos, parágrafos e botões. Se você estiver usando formulários diferentes para título e parágrafo, certifique-se de que dois telefones se emparelham bem um com o outro. Para facilitar o processo de seleção, você também pode dividir os telefones em alimentos primários e secundários, e é recomendável decidir primeiro o formulário primário e depois explodir opções para o segundo padrão. Você pode encontrar essas informações comuns de emparelhamento nos telefones do Google ou fazer uma pesquisa do Google para descobrir as combinações de fontes mais populares. Mas certifique-se de que você não usar mais de três telefones e um site como um perturba a interface do usuário. Herança visual. Um fator importante para selecionar o formulário certo para o site é pensar sobre os visitantes. Que tipo de percepção você quer que as pessoas pensem quando vêem o site? É uma afirmação ousada ou um profissional e acho que do ponto de vista do visitante. Fico feliz em repetir uma e outra vez. Mas quanto mais você entender seus clientes melhor site que você vai criar. Depois de selecionar os telefones, você tem que garantir que você selecione o formulário correto, tamanho, peso, altura da linha e espaçamento das letras de acordo com o requisito de design do site. A primeira adição na tipografia deve ser aplicada. Significa limitar o comprimento de uma linha. Você pode tê-lo em 45 a 85 caracteres, mas linha preferencialmente 60 em um computador. Se você quiser fornecer uma boa experiência de leitura. Para dispositivos móveis, você deve usar 30 a 40 caracteres por linha. Eu até recomendo usar o contador de palavras mais plug-in para Google Chrome para contar os caracteres apenas selecionando o texto. Em seguida é escolher o alinhamento das opções esquerda, centro, direita e justificada. Isso dependerá do UA geral que você está planejando para o site. próximo fator é ajustar o espaçamento entre letras, também chamado Les kerning. É o espaço entre duas letras e aumenta a legibilidade, mas vou aconselhar a usá-lo com cuidado. Em seguida, ajuste a altura da linha. Também é chamado como líder. É a quantidade de espaço entre as duas linhas. Em seguida, selecione o tamanho do telefone. E, novamente, depende da interface geral que você está planejando para o site. Só não torná-lo muito pequeno, caso contrário ter visitado, teremos que ampliar para ler o conteúdo. Na verdade, certifique-se de que é fácil de ler em todos os tamanhos de tela. Você pode jogar com o peso da fonte para torná-lo mais pesado ou mais leve. Você pode selecionar a cor do formulário como esquema de cores do design do pássaro. Verifique se você tem um bom problema de contraste. Significa ter um texto claro em um fundo escuro ou um telefone escuro em um fundo claro. Depois de decidir sobre todos esses fatores tipográficos, certifique-se de usar o mesmo estilo em todo o site para oferecer uma sensação de consistência e branding. Sempre tente o melhor para manter a hierarquia visual na página da Web. Entre na mente do visitante do site e tente entender quais palavras você quer que eles notem primeiro? E qual é o formato visualmente mais agradável para comunicar essas palavras? Lembre-se, facilidade de legibilidade é o objetivo principal que queremos alcançar aplicando os conceitos de uma biografia. Tudo bem, então você aprendeu sobre cores e topografia, e no próximo vídeo, vamos aprender sobre os diferentes layouts. Vejo você lá. 9. Layout de páginas: Deixa-me dizer-te um facto. As pessoas não visitam sites para o design. Eles visitam sites para obter o conteúdo. Mas é importante apresentar o conteúdo de uma maneira útil para envolver o visitante e obrigá-lo a tomar medidas. Assim, o design do site é tudo sobre fazer o conteúdo parecer fácil e atraente para os visitados. Sabemos que o cabeçalho e o rodapé vai ser o mesmo para tudo o que é. E temos que projetar a área de conteúdo principal para cada página web. E para agradar o conteúdo, usamos seções e colunas em outra página. O arranjo do conteúdo nessas seções e colunas pode ser feito de várias maneiras. Então vamos discutir alguns layouts de site eficazes nesta lição. O primeiro, um único layout de coluna. Apresenta o conteúdo principal em uma única coluna vertical rodeada por espaços em branco abundantes. As experiências de escolaridade suave neste layout e você pode usar imagens nítidas e claras em um tamanho grande. Este layout é muito confortável para os visitantes e funciona bem em todos os seus dispositivos. Recomenda-se usar este layout e blog pessoal, minimalistas e designs amigáveis para dispositivos móveis. Em seguida é o layout de duas colunas. É formado dividindo a seção em duas colunas verticais. A largura das colunas pode ser dividida em desejo de emitir. É recomendado para páginas que têm duas partes principais de conteúdo que compartilham um nível de importância igual. O que mais você pode colocar leva de um lado com uma imagem do outro lado para explicar melhor o conteúdo. O próximo é um criativo. É o layout assimétrico. Significa distribuir conteúdo de diferentes tamanhos de forma desigual em toda a página. Recomenda-se usar em sites que têm uma grande variedade de elementos visuais e tipos de conteúdo, talvez seja necessário ter vários itens pequenos de um lado para equilibrar um objeto grande do outro lado. Mas tenha muito cuidado ao usar este layout, pois você terá que encontrar esse equilíbrio certo entre as seções maiores e as menores. Mas uma vez feito, parece muito bom. Além disso, você precisa usar elementos com alto contraste de cores para adicionar peso visual a partes específicas do design. Em seguida, é um layout fixo barra lateral. Neste layout, a barra lateral adesiva que contém o Menu de Navegação permanece na mesma posição em todas as páginas da web, permanece visível toda vez que eles o usam, navegue em nossas escolas na página abaixo. Em seguida, é layout de mídia em tela cheia. Significa essencialmente usar um vídeo de fundo como imagem de herói. Ele fornece uma experiência de usuário muito rica e o impacto é muito alto. Aumenta a curiosidade dos visitantes para rolar para baixo e descobrir mais sobre o negócio. O próximo é o layout da grade. Uma grade de layout de cartões é bom para lados pesados de conteúdo que exibem muitos itens com herança igual. É recomendado para uma página de arquivo de aparência organizada, Galeria de Mídia ou um blog com um layout limpo. Em seguida é o layout da caixa. Este tipo de layout é frequentemente usado na página inicial. Aqui, a seção de heróis é uma caixa grande, de largura total, com imagem ou vídeo como plano de fundo e seguido por caixas menores diretamente abaixo dela. Idealmente, o número dessas caixas pequenas deve variar entre dois e cinco. É um layout de site perene e os elementos orientam o visitante para mais detalhes e explicações clicando nas caixas. Estes eram o tipo comum de Leodes e agora deixe-me dizer-lhe rapidamente algumas práticas recomendadas para atingir alguns objetivos específicos enquanto organiza o conteúdo em qualquer um desses Leodes. Muitas vezes, você precisará fazer uma seção se destacar do resto do conteúdo. Lago. Você precisa realçar o botão de call-to-action na página de aterrissagem. Então você deve usar o espaço em branco. Na verdade, muito espaço em branco para torná-lo se destacar e destacar. Porque ao remover distrações, você pode forçar o visitante a se concentrar apenas no que é imediatamente visível. Isto é uma coisa muito importante. Reúna usando o espaço em branco de forma eficiente. O próximo é brincar com o tamanho. Geralmente, as pessoas lêem coisas maiores primeiro, hierarquia adequada esclarece para os visitantes a ordem de importância dos elementos e tamanho é a maneira mais fácil de criar uma hierarquia entre elementos. Se você deseja criar um layout fácil de digitalizar para uma página pesada de conteúdo que exija a exibição de todos os itens primários com herança igual, aplique o sistema de grade. grades podem variar em tamanho, espaçamento e número de colunas. Por exemplo, vamos dar uma olhada no sistema de grade do YouTube. É muito bem organizado e contém quatro colunas. Outra prática importante é manter os formulários importantes de call-to-action ou submissão na parte superior ou inferior da página web. Como os ocidentais tendem a lembrar, o primeiro e o último itens são melhores. Os fatores finais que quero contar nesta lição é dividir o conteúdo em pequenos pedaços. Nunca mostre um grande conteúdo em apenas um bloco. Tentou dividi-lo em seções menores, pois é fácil de digerir para o visitante. Fácil, fácil e fácil. Tudo deve ser muito fácil e atraente para o visitante no site. Na verdade, se você me pedir para excluir todos os conceitos de design do site em duas palavras, eu diria apenas entender seu público bem e tornar as coisas mais fáceis para eles. É isso. E espero estar tornando as coisas mais fáceis para você aprender. Muito bom indo até aqui. Vejo você no próximo vídeo. 10. Copywriting para parte 1: Nesta aula, vamos aprender algumas estratégias de copywriting super-eficazes. As estratégias que vamos discutir não se limitam a apenas um site. Você pode aplicar esses tipos de doença para escrever um script de vídeo, bloquear mensagens de divulgação, e-mails, descrições de vídeo do YouTube, descrições de podcasts, postagem de mídia social e adicionar cópias. Copywriting é a prática de escrever texto a fim de informar, inspirar ou persuadir o leitor. Escrever e envolver a Web copy é muito importante porque a Internet é um lugar altamente competitivo. O visitante não encontra valor no site. Todos sabemos o que vai acontecer. Ele vai se afastar do site. E nunca queremos que isso aconteça conosco. Então, para isso, você tem que escrever manchetes, subtítulos, parágrafos, linhas de chamada para ação, artigos e histórias no site para que o visitante esteja envolvido e motivado a agir. Antes de iniciar o processo de copywriting, você deve ser limpo com os objetivos do site. Você deve ser claro com o único objetivo principal do site. O que você quer que o visitante faça depois de ler o conteúdo do site? Quanto melhor você entender o público, melhor você será capaz, certo? Além disso, você precisa de uma compreensão clara do produto ou serviço. Saiba o que é, como funciona e como se compara com a concorrência. Além disso, você precisa aprender sobre os pensamentos, medos e desejos do público. Então só você pode escrever uma cópia que fale diretamente com eles. Agora, eu quero compartilhar as sete estratégias mais importantes que são usadas para escrever um conteúdo de site altamente envolvente. A primeira estratégia é usar um slide escorregadio. Sim, é o mesmo slide em que as crianças brincam no parque. As frases curtas e parágrafos muito curtos têm um efeito de slide escorregadio e é muito eficaz em copywriting web. Nós sempre queremos fazer o visitante continuar lendo até o fim. Permitam-me que vos mostre um exemplo para isto. O que é um trabalho principal frases. Fazendo você ler o próximo, depois o próximo depois disso. Esse é o conceito escorregadio de slides em ação, tornando difícil para as pessoas pararem de ler. Em seguida, é uma estratégia muito famosa chamada como a fórmula aida. Significa atenção, interesse, desejo e ação. A-i-d-a, ou Aida. Você pode ver que ele funciona muito bem para a cópia da página de vendas, cópia postagem de mídia social e boletins informativos por e-mail. Vejamos um exemplo para entender isso. A primeira linha escrita aqui é, este é o guia mais completo para páginas de destino on-line. Esta linha cria uma tensão. Em seguida, criar páginas de destino que convertem super bem. Ele está tocando no desejo de criar páginas de destino que convertem. Em seguida, na linha, você vai adorar as estratégias detalhadas no guia de hoje. Há um elemento de interesse também. E, finalmente, um apelo à ação escrevendo, vamos mergulhar direito. A ordem é um pouco de cabeça para baixo para o interesse e desejo neste exemplo. Mas o que importa é que você aplique fórmula aida no conteúdo. Em seguida, é substituir recursos por benefícios. Ok. Você não entendeu o que quero dizer, apresenta benefícios substituição. Tudo bem. Estou lhe dizendo para remover os recursos no site. Sim, removeu-os e escreva os benefícios em vez disso. Esta é uma estratégia muito poderosa porque ressoa bem com o visitante. Tente falar de uma forma que o visitante está sendo beneficiado. Não diga por que você é bom. Diga-lhes os benefícios que obterão usando seu produto ou serviço. Afinal, o jogo dele é só o seu ganho, certo? Tudo bem. Em seguida, é usar CTA fortes e claros. Você pode colocar o CTA em cada ponto da mensagem que somos uma nova informação é apresentada. No entanto, uma oportunidade de converter. Além disso, seus clientes estão ocupados. Na verdade, eles estão muito ocupados e não sabem o que fazer a seguir. Então você tem que dizer a eles o que exatamente fazer a seguir. Certo, o próximo é mostrar prova social. É uma verdadeira magia em copywriting. Qualquer um pode dizer no site, eu posso fazer isso, eu posso fazer aquilo. Mas se você pode mostrar que com dados, depoimentos, exemplos, estudos de caso, revisões, estatísticas, você pode realmente levar as coisas para o próximo nível e gerar vendas. Não importa se você tem uma longa lista de depoimentos são apenas alguns. Você pode mostrar esses comentários sobre clientes que estão brilhantemente satisfeitos ou transformados tomando seus serviços. Qualquer que seja a forma mais forte de prova social disponível para você use isso. O próximo é cristalino. Usp. Usp significa proposta de venda única. Significa responder, por que alguém deveria comprar de você? Talvez você tenha os melhores preços. Talvez você entregue mais rápido do que qualquer outra pessoa, ou talvez você garanta resultados. Isso é o que faz você se levantar da competição. Portanto, certifique-se de destacar seu USP no conteúdo. A última é a sensação de urgência. Ele é usado para fazer os clientes agir agora. Sim, queremos que eles tomem medidas e tomem isso agora mesmo. Algumas das maneiras de criar urgência são como tempo limitado oferecer selantes no domingo, não perca assim. Funciona mesmo. Dê uma chance a isso. Então estas são algumas estratégias realmente poderosas e tentar fazer uso delas em qualquer conteúdo que você possa posar. Agora vamos aprender alguns métodos práticos como como escrever as manchetes, parágrafos e outros conteúdos. Vamos começar com os faróis no site Copy sempre tentou escrever manchetes irresistíveis. O título do site é a primeira impressão que o seu conteúdo vai causar. É esta manchete que faz a pessoa decidir se ele vai ou não ficar em torno do site e explorar mais informações ou então ele simplesmente vai deixar o seu site e verificar Instagram. Na manchete. Você tem que tentar convencê-lo de que o conteúdo é útil. Tentou criar uma urgência, tentou mostrar que o conteúdo é único e ultra específico. Deixe-me mostrar-lhe um exemplo. Você também pode pausar este vídeo para ler os exemplos lentamente. Portanto, esta é uma manchete para um dos artigos e está mostrando claramente que o conteúdo é útil, único e específico. Aqui está outro exemplo. É assim que se escreve um título super específico. Agora deixa-me dizer-te algumas preferências de manchete. Você pode usar números nas manchetes. Você também pode dirigir-se ao leitor ou usar como manchetes e questionar manchetes. Você também pode criar manchetes emocionais adicionando palavras emocionalmente carregadas na manchete, lago louco agora, rápido, erro, novo, avanço, incrível, incrível. Tudo bem. Então o próximo conceito a usar e manchetes é FOMO. Fumo. É a abreviatura de medo de perder. Isso desencadeia uma emoção muito forte nos visitantes. Você pode usar uma frase como economia de tempo limitado. Funciona brilhantemente. Dê uma chance. Em seguida, você também pode usar o conceito de WIFM. Significa o que há nele para mim. Significa que não precisamos escrever manchetes mostrando nossa experiência. Em vez disso, escreva manchetes que respondam à pergunta na mente do visitante. Mais uma vez, gostaria de repetir que estas são as estratégias universais de copywriting. E você é livre para usar essas estratégias para escrever manchetes para diferentes páginas da web, títulos de postagens de blog, boletins informativos por e-mail, postagem de mídia social e adicionar cópias também. A seguir é escrever quatro parágrafos. Também é importante porque as primeiras linhas decidem se o visitante levará ao conteúdo ou não. Portanto, deve sempre começar com um gancho. Vamos dar uma olhada neste exemplo. Aqui está começando com uma perna de gancho. As estatísticas estão dentro, as reservas são inegáveis. O e-mail ainda é a maneira número 1 de impulsionar as vendas on-line. Isto é um gancho. Você também pode usar mini-histórias para começar o parágrafo, certo? Uma história de quatro ou cinco linhas como esta. Ou então você também pode complementar o título como visível neste exemplo. Agora, a seguir é usar a regra de três em copywriting. O que essa regra de três? Tente destacar as três etapas principais do conteúdo, como mostrar três depoimentos na página inicial, três exemplos para algum conceito ou três seções principais em uma postagem de blog. Você poderia facilmente ter ido com cinco passos ou sete passos. Mas quero que se concentre na regra dos três, porque o convento parece conhecedor, bem-estar, simples e cativante. É muito fácil de digerir para os visitantes. Há alguma magia no número 3. Sim, sim, sim. É por isso que eu dividi o processo de cação do site em três etapas. Agora você sabe meu segredo de escrever roteiros. A seguir é seguir uma boa estrutura para a cópia web. Se o conteúdo for um ponto longo, divida-o em subtítulos para facilitar a leitura e a compreensão lógica. O próximo é escrever como você fala. Pode não ser completamente aplicável em uma cópia do site, mas tente usar esse hack nos boletins informativos de e-mail, post de blog e postagem de mídia social. A seguir é usar frases curtas. Sim. Mantenha-os o mais curto possível e aplique o conceito escorregadio de slides. Isso ajudará o visitante a ler mais como frases curtas são fáceis de ler e entender. A próxima tag é escrever para uma pessoa. Não escreva conteúdo em um tom genérico, escreva-o em um tom personalizado como se estivesse a falar com esse leitor específico. Em seguida, é usar voz ativa em copywriting. Você terá que voltar para o livro de gramática Inglês se você esqueceu o conceito de voz ativa que você aprendeu na quarta ou sexta série de ensino. Mas usar voz ativa é muito útil na cooperação. Em seguida, não é usar palavras grandes, porque se as palavras são difíceis de ler, o visitante não vai lê-lo. A seguir é escrever para o esquema. Sim, as pessoas não lêem conteúdo online, eles passam por cima. Portanto, use muitos subtítulos e divida o conteúdo maior em pedaços e seções menores e sempre faça uso das linhas finais de takeaway. Agora, a última coisa que quero dizer neste vídeo é que você tem que escrever não só para os visitantes, mas também para os motores de busca. Portanto, sempre tente integrar as palavras-chave de destino naturalmente no conteúdo para que seu site fique de alto nível, levando a mais tráfego e vendas. Aqui, nós completamos o copywriting ouvir Parte 1, e nós temos a parte dois também. Fique atento, pois temos que aprender um pouco mais sobre o processo de copywriting. Vejo você no próximo vídeo. 11. Copywriting para parte 2: Neste vídeo, vamos aprender o processo passo a passo para escrever uma cópia do site de alta conversão para a página inicial Sobre página, página de serviço e produto e página de contato. É muito emocionante para converter a página em branco em um conteúdo altamente convertido que gera leads assinantes e vendas. O processo começa com a identificação do objetivo mais importante dos sites, porque nós sempre criamos um site para um propósito específico para obter clareza sobre o propósito do site, tentamos visualizar a jornada do seu cliente e chegar a um Chamada à ação. Como se você tem um negócio de serviços, você vai querer que os visitantes para preencher o formulário de lead. Se você tem um negócio de produtos com um ciclo de compra curto, você estará procurando uma compra direta. Se você tem uma empresa de produtos com um ciclo de compra mais longo, você pode se concentrar em inscrições por e-mail para que você possa envolver leads em um processo de criação de e-mails. objetivos podem variar, mas tentar identificar a van único objetivo primário no site de seu objetivo deve ser obter os visitantes da chegada à ação rápido possível e da maneira mais linear possível. Para fazer isso, queremos minimizar o número de páginas envolvidas na jornada do cliente. Então você terá três opções para decidir como usar a página inicial. Número um, se você oferecer um único produto ou serviço, poderá usar a página inicial como a página inicial desse produto ou serviço. Número 2, se o objetivo principal do site for inscrições por e-mail, use a estratégia de página inicial de cabeça para baixo. Número 3. Se o objetivo principal for qualquer outra coisa, use a página inicial como uma página de construção da marca. Vamos aprender o que exatamente é uma estratégia de página inicial de cabeça para baixo e uma página de construção de marca? A página inicial de cabeça para baixo pede aos visitantes e-mail na parte superior da página, em vez de na parte inferior. A estrutura pode ser como a seção de heróis, incluindo um formulário para inscrição por e-mail. Abaixo da seção de herói mostra alguma prova social. Se um rótulo, em seguida, contar uma história de marca que resolve algum problema. E, novamente, você pode pedir o endereço de email em troca do recurso da solução. Desta forma, você pode obter o máximo de inscrições de e-mail na página inicial usando a estratégia de página inicial de cabeça para baixo. Em seguida, é uma página de construção de marca. É uma página inicial clássica. Aqui, você não deve tentar vender os produtos ou serviços. Em vez disso, tentou construir uma percepção de marca e , em seguida, levá-los para as páginas de produtos ou serviços específicos. Para construir uma marca, você tem que escrever a proposta de valor da marca que diz via negócio existir e qual é a identidade principal. Então você tem que escrever a história curta da marca para descrever os desafios ou problemas que sua marca deseja resolver e dizer-lhes como é resolvido. Finalmente, mostrar aos visitantes alguma prova para construir credibilidade para a marca. Depois disso, você pode redirecionar o visitante para a página de produto ou serviço específica para executar ações específicas. Além disso, certifique-se de que você tenha ações suficientes na cópia da Web. É assim que você pode escrever conteúdo para a nossa página inicial. Agora, vamos ver como escrever uma página Sobre e sobre páginas sempre lá no site porque as pessoas esperam que ele esteja disponível. Um grande segmento de visitantes pode até adiar a idéia de comprar o serviço de você se eles não encontrar a página sobre em seu site. Os visitantes geralmente visitam a página Sobre para verificar se a marca ou a pessoa é genuína ou não. Além disso, eles querem se conectar bem conhecendo a visão, missão, o propósito ou o histórico de negócios. E, às vezes, se não entenderem história da sua marca na página inicial e quiserem saber mais. Eles visitarão a página Sobre. Para sites mais especializados, como um site B2B, eles querem verificar se você tem o histórico experiente ou nada ou pesado von quaisquer prêmios ou certificações para fazer você se destacar da concorrência. Ao escrever conteúdo para a página Sobre. Sempre falei para estabelecer credibilidade. Fale sobre o que você conseguiu e com quem você trabalhou. Você também pode começar com a visão e missão antes de iniciar a história da marca, você sempre pode ser honesto e direto como os visitantes preferem clareza. E, finalmente, conclua a página Sobre com um CDA. Agora, vamos ver como escrever para a página de serviços. Em vez de uma página de serviço, podemos considerar que esta é a página de destino ou a página de vendas onde podemos fornecer uma oferta para o visitante. Se você tiver vários produtos ou serviços, poderá criar páginas separadas para todos eles. Falando sobre o conteúdo, você pode começar com a proposta de valor para o produto ou serviço específico. Para isso, definiu claramente a oferta, especifique para quem é e diferencie o valor. Depois disso, você precisa explicar os benefícios da sua solução e, em seguida, explicar como você realmente resolve o problema. Aqui também fornecer o máximo de provas possível. Também tentou empurrar os visitantes para entrar em contato com você em todas as oportunidades. Tentou incluir um CTA em qualquer ponto da sua página onde o leitor possa estar em uma posição mental para clicar. Você pode criar botões CTA para rolar que o leitor para baixo para n formulário de contato na página em vez de redirecionar para uma página separada. E se você estiver escrevendo conteúdo para a página do produto em um site de comércio eletrônico, então você deve incluir as imagens do produto, detalhes do produto, botão Adicionar ao carrinho, descrição do produto, histórico do produto ou da marca. Você também pode gostar da seção e da seção de revisão. Em seguida, vamos aprender a escrever a cópia web para uma página de contato. Esta é provavelmente a página mais simples de um site já que o visitante já decidiu entrar em contato com você. Mas se você quiser mais leads, basta manter todo o conteúdo acima da dobra. Levando a rolagem mínima. Inclua um pequeno convite endereçado às pessoas para entrar em contato com você. Forneça quantas opções de rotulado para um visitante entrar em contato com você, como um formulário de consulta, endereço de e-mail, chamada telefônica ou Skype. Vamos também aprender a escrever para uma página de destino. O único objetivo de uma página de destino é fazer com que os dados do visitante sejam a ação desejada, como se inscrever para uma newsletter, iniciar uma avaliação gratuita ou baixar um e-book. Isso pode ser qualquer ação específica. Então, na página de destino, comece com a manchete que mostra claramente os benefícios para D vai obter, comprar o produto ou serviço. Também tem a prova social na própria seção de herói, acima da dobra. Use qualquer prova mais credível que você tem, como os lugares onde você está em destaque ou número de clientes, ou os nomes de grandes linhas ou qualquer coisa que seja. Mas tentou incluir o máximo de provas possível. Em seguida, a área de conteúdo principal deve seguir a estrutura como problema, agitar e resolver fórmula. Comece com a dor do cliente, aponte problemas. Em seguida, destaque o quão irritante é o problema e, em seguida, provoque-os com a solução. Após esta seção, você pode criar a seção de transição. É essa transição do problema para a solução. Mas quando uma oferta e fazer colocar o CTA aqui para o visitante para tomar medidas, porque se o visitante está convencido, você precisa dizer-lhe como começar ou o que fazer a seguir. É isso. Para escrever conteúdo para uma postagem de blog, você pode começar com escrita e título ultra específico. Dá clareza ao visitante o que exatamente vai saber no post. Quanto mais específico você escrever o título, mais cliques você receberá. Em seguida, comece o parágrafo com uma introdução mais curta de não mais do que algumas oito pistas. Na brochura provar que você pode entregar na manchete de nós. E também dê uma prévia do que tudo o que eles vão saber entrando na área de conteúdo principal. O post deve incluir dicas práticas, técnicas e estratégias que as pessoas podem usar imediatamente. Isso pode incluir conteúdo no formulário de lista expandida, lista de estudo de caso de ferramentas, o guia final ou a lista completa Geyte. Use muitos exemplos para tornar o conteúdo fácil de entender. E, finalmente, dar seus visitantes é CTA para tomar medidas. Você pode colocar alguma prova social para encorajamento adicional. É isso. Então as lições de copywriting foram um pouco longas, mas elas são dignas porque uma boa redação vai trazer leads, conversões e vendas para o site. Vamos terminar esta lição aqui e continuar com o design gráfico no próximo vídeo. 12. Design gráfico para parte 1: Todo mundo está sempre animado para gráficos e há uma razão muito forte para isso. E a imagem vale mil palavras. E a imagem pode desencadear percepções, emoções e ações mais rapidamente do que o texto. Por isso, é importante para você usar gráficos e imagens no site para construir uma forte comunicação visual com os visitantes e tanques para algumas ferramentas gratuitas incríveis como Canva, criar gráficos agora é muito mais fácil do que antes. Nesta aula, nós vamos aprender sobre o processo geral e conceitos fundamentais de design gráfico que você pode aplicar para editar imagens e criar gráficos, não apenas para um site, mas até mesmo para postagem de mídia social YouTube, miniatura, ou qualquer outro elemento gráfico, pois estas são as estratégias universais. Então, deixe-me começar por dizer-lhe o processo geral e as etapas para criar um design gráfico. O primeiro passo é observar que a dimensão necessária ou resolução do design gráfico. É o tamanho do gráfico em termos de largura e altura que é medido em pixels. Lake, se você quiser inserir uma imagem no fundo seção herói, então você tem que criar o gráfico e 11 para 0 por 600 pixels para cobrir a tela acima da dobra. A dimensão para um post do Instagram é 1080 por 10 pixels pequenos Hz. E a dimensão para uma história do Instagram é 0100 ajudas que tudo por 19, 200 pixels. Então, para usar gráficos no design do site, é importante conhecer as dimensões necessárias. Primeiro. Para conhecer as dimensões, você pode usar um plugin do Google Chrome chamado como página para LA Redux para medir rapidamente as dimensões na tela de qualquer seção ou coluna do site. próximo passo é selecionar o plano de fundo certo. Sua conversa de design seria um vite plano, caixa vazia. E você sempre pode começar colocando um fundo. Pode ser uma cor sólida ou uma textura de auditoria de gradiente ou uma imagem. Você também pode usar fundo excessivamente vago. Você insere um plano de fundo sobre fundo já existente e ajusta a opacidade para obter uma aparência combinada incrível. Após o fundo, você deve inserir elementos para o design na forma de texto, imagens e formas. Você tem que completar o esqueleto ou uma estrutura simples primeiro contendo o conteúdo, e então você começa a trabalhar nos telefones, cores, espaçamento e alinhamento. Uma vez que o gráfico está pronto, você pode exportar o arquivo e formato JPEG escuro ou PNG para usar no site. O formato JPEG é o mais ideal para usar no site, pois é menor tamanho de arquivo e ajuda a tornar o carregamento do site rápido. Mas JPEGs não suportam o fundo transparente. Então, se você tem um gráfico que precisa de um fundo transparente, você terá que usar o formato PNG para exportar o arquivo. Embora você tenha as opções na ferramenta de design gráfico, ela serve para exportar o arquivo em tamanhos de arquivo menores. Mas se você não encontrar essa opção em qualquer ferramenta e quiser reduzir o tamanho do arquivo, siga estas etapas. Primeiro, certifique-se de que a resolução da imagem não está sobredimensionada, pois o redimensionamento da imagem para a solução necessária reduzirá o tamanho do arquivo automaticamente. próximo passo é visitar o pequeno PNG.com, carregar os arquivos e baixar versões descompactadas. Isso ajudará na redução do tamanho do arquivo, mas sempre certifique-se de carregar uma imagem e o site no menor tamanho possível de arquivo em apenas alguns bebês. Agora, vamos também discutir alguns conceitos fundamentais para um bom design gráfico. O primeiro conceito é a ênfase. Significa decidir qual é a primeira peça de informação que o visitante precisa saber observando o gráfico. Em seguida, é aplicar equilíbrio e alinhamento. Você pode projetar um gráfico simétrico ou assimétrico. Apenas certifique-se de que o gráfico não pareça condensado ou desigual. Em seguida, é garantir o contraste de cor certo para fazer os elementos pop. A seguir é usar o conceito de herarquia. É o arranjo de elementos para chamar a atenção para os elementos-chave em primeiro lugar. A seguir é usar linhas e formas no gráfico. Além disso, é importante usar ícones para chamar a atenção sem muita distração. Em seguida, é usar o conceito de repetição. Você não deve usar telefones diferentes para cada linha no design, pois quebra a consistência. A seguir é manter a proporção. A proporção só pode ser alcançada se todos os elementos do seu design estiverem bem dimensionados e cuidadosamente satisfeitos. Depois de dominar o alinhamento, o equilíbrio e o contraste, a proporção deverá ser visível automaticamente. O próximo é o movimento. Movimento está controlando os elementos em uma composição para que o olho é levado a passar de 1 para o próximo e a informação é devidamente comunicada ao público. A seguir é usar as cores certas para se conectar bem com o público. O próximo é o espaço em branco. O espaço em branco não está sentado lá sem fazer nada. É classificar a herarquia e a organização. Gerenciar o espaço em branco significa utilizar o espaço aberto para chamar a atenção para os elementos que realmente importam em seu design. A seguir é a tipografia. Obviamente, as palavras que usamos em nossos projetos são importantes, mas também as formas que usamos para comunicar essas palavras. E, finalmente, eu vou recomendar que você use um imagens reais de pessoas, uma vez que ajuda a melhorar a taxa de conversão. Dê uma chance a isso. Então, estes são os conceitos fundamentais que você pode usar para criar um design gráfico e aprender mais sobre ele no próximo vídeo que é parte de design gráfico. Para te ver lá. 13. Design gráfico para parte 2: Uma vez que você é feito com os fundamentos, é hora de começar com a aplicação de conceitos. Vamos começar com as imagens. Em um projeto de site, você terá que usar muitas imagens. Mas a questão é: como você pode obter essas imagens? A partir de qual site você vai baixar as imagens? Você está pensando em fazer uma pesquisa de imagens do Google e usar essas imagens no site? Não. Não devemos fazê-lo. Como as imagens podem não ter permissão para ser usado para um projeto comercial, e isso pode levantar algumas questões legais para você. Deixe-me dizer-lhe alguns muito bom site lá você vai obter imagens livres e de alta qualidade para usar no site gratuitamente. Sim, você pode baixar essas imagens gratuitamente de portais como Pixabay, excels e Unsplash. Embora existam tantos outros sites, bem como para baixar imagens livres de estoque, mas estes três são extremamente bons. Além disso, tenho mais uma opção. Você pode baixar as imagens de foto livre, mas é um site freemium. Um lado freemium é aquele em que alguns dos recursos estão disponíveis gratuitamente, enquanto outros são pagos. As imagens com o chão Akan são as pagas. E para ter acesso a essas imagens, você terá que comprar a assinatura de escolha gratuita. Agora, você deve estar se perguntando por que pagar por uma assinatura de escolha gratuita quando VR recebendo as imagens gratuitamente de outros sites? Bem, depende da coleção de imagens e acontece com bastante frequência que você precisa de uma imagem específica, mas que não pertence a nenhum site gratuito. Quando estamos trabalhando em projetos de site. E há uma necessidade de algumas imagens específicas. O mesmo prefere comprar as imagens de plataformas como Shutterstock e Adobe stock. Aqui, temos que pagar uma quantia muito boa de dinheiro para a assinatura para obter essas imagens específicas. Mas funcionou porque tínhamos, pelo menos, conseguir o que queríamos. Apenas certifique-se de baixar as imagens nessa resolução necessária. E se a resolução da imagem for grande, você pode redimensionar a imagem para a resolução necessária usando a técnica discutida no vídeo anterior. E comprimir o tamanho do arquivo usando PNG minúsculo ou qualquer compressão de imagem semelhante, como telefone. Muitos jantares e tutoriais sugerem o uso dos plugins WordPress para comprimir imagens como E triplo W imagem Optimizer. Mas prefiro reduzir o tamanho do arquivo antes de enviar a imagem para o site. Ajuda a reduzir a necessidade de usar um plug-in extra e manter o nosso WordPress leve e limpo. Após as imagens, você precisará de algumas ilustrações vetoriais para usar nos gráficos do site. Agora, o que é um vetor? Como é diferente de uma imagem? Um vetor é um trabalho artístico construído a partir de Vector Graphics, que adiciona imagens criadas com fórmulas matemáticas. Cone para ler. Não se preocupe, não vamos discutir fórmulas matemáticas aqui. Isso simplesmente significa que você pode ampliar uma arte vetorial para qualquer tamanho sem afetar sua aparência ao torná-la desfocada em comparação com as imagens. Assim, as imagens, também chamadas de arte raster lass, vão olhar borradas quando as ampliarmos ou zoom. Mas um trabalho artístico vetorial não irá desfocar em ampliar ou ampliar mesmo para um outdoor de tamanho de retenção. Espero que você esteja claro com a diferença entre uma imagem raster e uma imagem vetorial. Agora, onde obter vetores e como faço para obter um vetor? Qual ferramenta? Qual software? Deixe-me primeiro dizer-lhe que você vai obter os gráficos vetoriais livres de escolha livre. Na verdade, alguns serão gratuitos e outros serão pagos, e você pode acessá-los se você tiver uma assinatura de seleção gratuita. Você também pode encontrar gráficos vetoriais em outras plataformas e você pode simplesmente fazer uma pesquisa do Google para ele. Mas eu sugiro que você comece apenas com escolha livre. O arquivo gráfico vetorial geralmente está disponível no formato de ponto AI ou EPS ou SVG ponto. Estes são todos formatos de arquivo vetorial. Você pode editar um vetor usando o Adobe Illustrator. E é a ferramenta recomendada para criar gráficos vetoriais. Mas a assinatura da Adobe é um pouco dispendiosa. Então você pode fazer uso de uma ferramenta de código aberto como o Inkscape, ou pelo menos usar uma ferramenta muito econômica que tenha gravidade. Designer. Gavin designer é uma ferramenta decentemente poderosa e vem com um teste gratuito generoso de duas semanas também. Você pode acessá-lo na web ou você pode baixá-lo e instalá-lo no computador. Deixe-me dar-lhe rapidamente uma visão geral de trabalho de ferramentas como Canvas, designer gráfico e Adobe Illustrator. Vamos ao Canvas primeiro. Esta é também uma ferramenta freemium que tem uma versão gratuita e você pode se inscrever para a versão pro para recursos avançados. Aqui você pode se inscrever para uma conta gratuita, e é assim que o painel do Canvas se parece. A seção Início consiste no menu de design rápido para selecionar e começar a criar o design. Abaixo do ato, eles estarão a lista de designs que você criou usando Canva. Esses designs são salvos na nuvem Canvas e você pode acessá-los rapidamente a qualquer momento. Abaixo estão modelos ou gráficos pré-projetados que você pode importar com apenas um clique. Se você quiser criar um design de dimensão personalizado, clique em Criar uma opção de design e selecione Tamanho personalizado. Aqui você pode inserir a largura e a altura em pixels. Você também pode observar que você pode encontrar as dimensões dos tipos de gráficos populares passando o mouse sobre o título. A biblioteca de modelos do Canva é muito boa e você pode usá-lo para economizar tempo ao criar um gráfico. Você também vai encontrar uma enorme coleção de fotos e ícones para usar em seu design em Canvas. Se você tem a assinatura do Canva pro, então você pode até baixá-los e usar em qualquer outra ferramenta de edição gráfica. Deixe-me criar um fundo de seção de herói para o site selecionando Criar um design, clicando em Tamanho Personalizado, inserindo os valores 1, 1, 4, 0 por 600. Está em pixels, e aqui temos a tela em branco. Agora, se seguirmos os passos como discutimos no vídeo anterior, terminamos com as dimensões. Agora, é hora de selecionar o plano de fundo. Você pode escolher uma cor sólida, uma auditoria de gradiente externa, uma imagem ímpar para o plano de fundo. Basta clicar uma vez na tela em branco e pediu que a seleção azul é realçada. Você pode escolher a cor desta opção. Você pode escolher uma cor das cores padrão ou clicar na opção Nova cor para explorar o modo. Se você tiver o código hexadecimal para algum alerta específico, você pode inseri-lo aqui. Se você quiser inserir um gradiente, selecione a opção de elementos no menu esquerdo e, em seguida, role um pouco para baixo para encontrar gradientes ou então você pode simplesmente fazer uma pesquisa para os gradientes. Aqui estão as diferentes formas com gradientes e você pode inseri-las na tela com apenas um clique. Você terá opções para inserir um gradiente de duas cores, gradiente de cor auditiva em tantas formas diferentes. Se queremos que o plano de fundo seja um gradiente de duas cores, selecione este retangular e inserido clicando. Agora as dimensões ajustadas simplesmente escalando os cantos. Não se preocupe se ele estiver transbordando, pois o deslocamento será mascarado automaticamente para as dimensões da tela. Agora, se você quiser inserir texturas, selecione plano de fundo no menu à esquerda. E se você quiser usar imagens em segundo plano, clique nas fotos e procure a imagem desejada. Apenas certifique-se de que você não inserir uma foto com o crônico e como ele está disponível apenas para os pedidos de assinantes Pro, seu gráfico irá conter marcas d'água quando você vai exportar. Na verdade, fotos gratuitas são um pouco difíceis de encontrar no Canvas. Tudo bem, eu tenho um e deixe-me inserir. Outra coisa a notar aqui é que você está inserindo diferentes elementos e fotos e tudo isso está sendo organizado em uma hierarquia. Este é o conceito de Lear em design gráfico. Todos os elementos compõem uma camada única e você pode organizá-los em diferentes ordens facilmente. Isto é realmente muito útil. Brincando com os elementos frente e trás novamente, frente, novamente, trás assim. Agora, o próximo passo é usar uma sobreposição de fundo. Por isso. Vamos inserir uma forma e dar uma cor sólida. Faça isso. Agora verifica se a forma está selecionada e, em seguida, clique nesta opção de transparência. Aqui você pode ajustar a opacidade escolhendo manualmente a roda e apresentando o efeito de sobreposição ideal. Isto é fixe. Certo? Agora, você pode inserir texto, imagens e formas de acordo com sua exigência. Vamos adicionar algum texto para o gráfico. Você encontrará a opção de texto no menu à esquerda e clique nela. Você terá uma biblioteca de combinações e estilos de forma comumente usados. Você pode selecionar um aqui ou então simplesmente selecionar os títulos, subtítulo ou corpo do texto. Aqui você pode digitar o texto e a posição do ajuste simplesmente arrastando-o com o mouse. Você pode fazer alterações no estilo do texto. Experimente a forma de tamanho de fonte da família Ford colorido negrito, itálico, alinhamento, lista de marcadores, espaçamento de letras, altura de linha. Você também pode dar efeitos como sombra e curva. Para o texto. Você encontrará algumas opções adicionais clicando nesses três pontos. Você pode tornar o texto sublinhado ou maiúsculo, ajustar a transparência, inserir um hiperlink para o texto, bloquear a camada e criar uma duplicata dessa camada de texto. Você também pode usar o Controle Z para desfazer a ação e usar o controle C e o controle V para copiar e colar. Quando você clica na camada de texto, você também pode girar a camada assim. Agora, deixe-me criar uma duplicata desta camada e trocar os telefones. Se você quiser copiar o estilo desta camada de texto e aplicar na outra camada de texto. Basta selecionar a opção de estilo de cópia e aplicá-la. Usando a opção de posição, você pode ajustar a ordem das camadas, como frente e verso. Você também pode ajustar o alinhamento das camadas como superior, médio, inferior, esquerda, centro e direita. Você também pode fazer uma seleção das duas camadas mantendo pressionada a tecla Shift e clicando sobre elas. Aqui, você pode agrupar essas duas camadas e ajustar a posição para torná-la uniforme. Se você der uma olhada nas opções do menu à esquerda, você encontrará a opção para selecionar elementos. Os elementos incluem formas como linhas, quadros, grades, gradientes e ícones. Faça uso inteligente de linhas e formas no design. Você pode fazer uso de quadros e grades para camada de Moscou dentro de uma forma como esta. Se você quiser fazer upload de imagens personalizadas para o seu design, você pode selecionar a opção Carregar para carregar mídia para sua biblioteca Canva. Ele é salvo na Nuvem e você pode acessá-lo facilmente a qualquer hora, em qualquer lugar. E o Canadá também tem um aplicativo móvel, para que você possa acessar seus projetos no celular. Basta clicar na imagem e ela será inserida. Você pode inserir tantas pranchetas ou páginas no design clicando no ícone de adição ou em Adicionar uma página. Você também pode visualizar o design e a tela cheia. Você pode alterar o nome do arquivo aqui. E uma vez que você é feito com o design, você pode clicar em Download para exportá-lo em vários formatos. Você pode verificar as diferentes opções de tipos de arquivo rotuladas aqui. E se você estiver exportando o projetado para uso no site, você pode preferir a opção JPEG, pois ele dá o menor tamanho de arquivo. Mas se você está recebendo algum problema de qualidade importante, então você pode baixar o PNG um e, em seguida, usar o PNG minúsculo para reduzir o tamanho do arquivo antes de fazer upload para o site. Na verdade, eu recomendo usar PNG minúsculo para compactar todas as imagens que você carrega no site, não importa como JPEG ou PNG, porque mesmo em 10% salvar no tamanho do arquivo é útil para nós reduzir o carregamento da página tempo. É assim que você pode usar o Canvas para criar gráficos do zero. Agora você pode experimentar a importação dos modelos e você verá quanto tempo pode ser economizado usando um bom modelo para o design. E quando eu fechar Canvas, o design tal salvo aqui na biblioteca na tela alto. Vamos, por favor, pratique um pouco em Canvas. Vai te ajudar muito. Agora, não podemos sair de vetores em Canva. Para editar o trabalho artístico vetorial, você pode usar o Inkscape ou o Adobe Illustrator ou então pegar um designer. Deixe-me dizer-lhe o trabalho do designer de gravidade. A edição vetorial é mais ou menos uma tarefa profissional, mas vamos tentar pelo menos aprender a edição básica. Então, vamos nos inscrever para uma conta gratuita. Tudo bem, a conta foi criada. Você precisa verificar o e-mail e começar a trabalhar no Garver. Projete isso. Tudo bem, agora aqui você precisa começar digitando as dimensões. E você também pode iniciar o teste gratuito clicando neste botão. Ok? Então esta é a tela em branco, assim como Canva. À esquerda, você encontrará a lista de páginas e camadas. No topo, você tem o menu de opções e à direita você tem as opções de estilo. Você pode começar selecionando a cor de fundo da página. Ao clicar nesta opção, você pode selecionar uma cor sólida ou o gradiente. Você terá algumas opções avançadas também. Sinta-se livre para explorá-los e testar todas as opções se você quiser mergulhar profundamente no design gráfico para inserir o texto, formas e elementos, você tem as opções aqui no topo. Você pode inserir uma camada de texto clicando nisso e desenhando uma caixa de texto na tela, pintando o texto desejado e ajustando o estilo usando as opções à direita. Você pode experimentar os campos, bordas e efeitos. Quando você move um elemento escolhendo com o mouse, você vai encontrar linhas de encaixe para guiá-lo com o alinhamento. Você também pode usar a ferramenta caneta pressionando a borda ou selecionando a partir daqui e mover-se ao redor do documento. Você pode ampliar e diminuir o zoom pressionando a tecla Control e rolando usando a roda do mouse. Você pode ligar e desligar as réguas e grades de encaixe. Nesta opção, você pode inserir formas e usar atalhos de teclado para acelerar o processo. E você pode colocar uma imagem usando esta opção. Para dimensionar a imagem, você deve pressionar a tecla Shift conselho que o problema mudará no redimensionamento e as imagens parecerão um pouco estranhas. Você pode arrastar os elementos com o mouse pressionando o clique. E a melhor parte de usar um software de obtenção de vetor é que você pode personalizar as formas, imagens de tamanho, deixando tudo muito facilmente de acordo com o requisito de design. Para selecionar uma forma, você tem duas opções. Um é apontado e o outro é sub ponto de seleção, que é o modo de seleção regular. Mas com o sub select, você pode jogar com os cantos e cortar um elemento. A ferramenta de caneta é uma ferramenta poderosa e leva algum tempo para dominá-la. Mas você pode projetar ilustrações e criar desenhos à mão livre que são únicos e criativos. Existem várias opções para gerenciar os cantos e criar um design personalizado. Pode ser uma forma aberta ou fechada. Não vamos entrar na profundidade da ferramenta de caneta, a ferramenta básica ON e a ferramenta de mão livre, mas você se sente livre para ser explorado mais sobre ela. Outro conceito muito importante é “mascarar”. Quando você tem uma imagem e uma forma e deseja inserir a imagem dentro da forma, assim como usamos grades em Canva. Você pode fazer isso arrastando a camada de imagem para a camada de forma no painel de camadas esquerdo. Se você quiser trazê-lo para fora, basta arrastá-lo para fora da camada. Você também pode fazer uma seleção usando o mouse e usar a ordem da camada para trazer os elementos para frente e para trás. Se você quiser trazer um elemento na parte superior da camada, clique com o botão direito do mouse, selecione, organize e selecione trazer para a frente. Estas são as configurações gerais e designers gráficos. Você também pode explorar as configurações da Adobe ilustradas em você mesmo. E funciona quase da mesma maneira, mas teremos muito mais conjunto de opções e recursos para fazer gráficos avançados. Agora, vamos ver como você pode criar um logotipo em Canva ou GAVI designer. Vá para Canvas e faça uma busca pelo logotipo. Você terá mais de 100 modelos para escolher. Se você encontrar um adequado como por sua exigência, você pode simplesmente clicar sobre ele e ele vai carregar na tela. Agora simplesmente adicionou o nome da marca e altere as cores, se quiser. Mas eu sempre recomendo começar com um logotipo preto e branco simples e preencher as cores depois de ter selecionado o esquema de cores para o site. Exporte o design do logotipo no formato PNG. Mas há um desafio aqui. Como você está usando a versão gratuita do Canva, você não seria capaz de obter a transparente aqui. Então, não há problema. Você ainda pode baixá-lo com um fundo branco. E agora vamos ver como você pode remover o plano de fundo e torná-lo transparente para gráficos simples. A primeira opção é ir para remover Dark BG. Aqui você pode carregar o arquivo e a ferramenta irá remover automaticamente o plano de fundo para você. Se você estiver satisfeito, você pode baixá-lo. No entanto, você poderá baixar apenas um arquivo em resolução total. E para os próximos arquivos, você só pode baixar a versão de visualização. A qualidade da imagem não é nítida o suficiente e a versão anterior. Então, por isso, deixa-me mostrar-te outra maneira. Você pode ir para a foto p.com. Aqui, abra o arquivo do computador e, em seguida, clique na opção Selecionar e clique no kit mágico. Aqui, você terá que fazer alguns ajustes, mas você pode obter um maravilhoso fundo transparente para o logotipo na imagem PNG de alta resolução afiada. Uma vez feito, clique em OK e, em seguida, clique na opção Arquivo, clique em Exportar como, e selecione PNG. Bom logotipo está pronto para ser usado no site. Fazer um logotipo usando Canvas é bom, mas tem limitações. Se você tiver que alterar as cores são feitas alterações na forma. Você não tem tanta flexibilidade. Então, para criar logotipos profissionais, você deve usar. Gráficos vetoriais e uma ferramenta de edição vetorial, de preferência Adobe Illustrator Mas estamos usando designer gráfico para o escopo deste curso. E vamos abrir Graphic Designer novamente e criar uma tela em branco. O primeiro passo na criação do logotipo deve ser experimentar estilos de forma molhada. Se você está recebendo um satisfatório usando esta técnica, então ele fica muito mais fácil porque você não terá que criar muitas formas. Então brinque com os telefones, estilizando como itálico, todas as maiúsculas, e tente criar uma coleção. Depois de analisar as diferentes opções, você vai formar uma idéia melhor do logotipo do id para o site. Shortlist alguns deles e, em seguida, filtrar mais para chegar com o sido final. Agora, você pode adicionar formas personalizadas ao logotipo. Para inventar ideias. Você pode fazer uma pesquisa no Google e tentar analisar o logotipo de marcas e empresas que trabalham no mesmo setor. Se você encontrar algum elemento comum como folhas são usados para representar empresas verdes, bolsas de estudo e logotipo do instituto educacional e assim por diante. Depois de ter algumas ideias e opções em mente, vá para o porco livre e faça uma pesquisa com algumas palavras-chave. Por exemplo, se você deseja criar um logotipo para imóveis, você pode fazer uma busca por edifícios ou simplesmente fazer uma busca por imóveis locais. Three pig tem uma enorme coleção de gráficos vetoriais e você vai encontrar milhares de opções baixas para escolher. Se você encontrar algum adequado, basta baixá-lo e abri-lo usando o designer gráfico. Agora, a melhor parte de um gráfico vetorial é que ele é completamente personalizável. Você pode selecionar as camadas de Forma e colocar no seu quadro de arte do logotipo. Aqui você pode brincar com o tamanho, posição e alinhamento, e criar o logotipo da idéia para o site. Sempre criar algumas versões para o logotipo como os completos, curtos e mínimos para usar aspart, essa exigência do projeto. Uma vez feito, clique na opção Arquivo, clique em Exportar, em seguida, clique em Exportar avançado, selecione a opção de tela, escolha o formato como PNG, e altere o plano de fundo para Transparente. Clique em exportar. Seu logotipo está pronto para usar. Outra coisa. Se você tiver que exportar apenas a seleção de camadas, certifique-se de agrupar as camadas antes de exportar. Você também pode exportar o logotipo no formato PDF e SVG para que você possa usar esse arquivo em outras ferramentas de edição vetorial, como Adobe Illustrator ou coral draw. É assim que você pode criar um logotipo. Em seguida, é criar uma imagem de ilustração para o site. Aqui também vamos fazer uso de designer de gravidade e escolha livre, procurar o gráfico necessário com palavras-chave no porco livre e baixar o arquivo aberto Graphic Designer e criar uma nova prancheta com as dimensões específicas de acordo com o requisito. Você pode medir as dimensões em um site usando régua de página Redux. Como. Se você quiser colocar uma ilustração divertida fora das colunas em uma estrutura de dois volumes, você pode medir a largura e a altura e criar um design com as mesmas dimensões. Tudo bem, então nós temos a dimensão e nós temos a tela em branco, abrir o arquivo porco livre baixado e desagrupar as camadas. Agora faça uma seleção da camada necessária e traga-a para a placa de arte de ilustração. Aqui você pode ajustar o tamanho, posição, alinhamento e cores e, finalmente, exportar o gráfico para usar no site. Selecione o formato PNG e JPEG de acordo com o plano de fundo para o clima que Sage. Em seguida, é projetar os ícones. Os ícones são uma maneira simples e eficaz de atrair os usuários para o conteúdo do seu site. Os ícones também são usados para chamar a atenção do usuário e direcioná-los para algum conteúdo específico. Então, para criar ícones personalizados, teremos que usar Gavin designer sim. Para acessar uma enorme biblioteca de ícones pré-projetados, você pode visitar o flat icon.com. Aqui é simplesmente fazer uma pesquisa para o Eigen necessário e baixá-lo e formato SVG. Agora, há uma razão para baixá-lo em SVG e não PNG. Primeiro, você pode dimensionar a ICANN sem fazer com que ela apareça sangue. Em segundo lugar, você pode mudar a cor do olho novamente, diretamente do próprio editor do site. Funciona bem para os itens de linha. Então, sempre upload DI vem no formato SVG e não PNG. Se você quiser criar um cliente novamente usando o baixado do voo Eigen, basta abrir o Eigen e designer gráfico e fazer as alterações desejadas. Aqui você pode fazer uso da caneta e básico para criar formas personalizadas também. Você também pode alterar o preenchimento de cor para uma cor sólida ou uma cor de gradiente. Depois de terminar a edição, basta exportar o arquivo no SVG e carregar no site. A última coisa que temos que aprender é editar as imagens. A ferramenta mais recomendada para editar imagens é o Adobe Photoshop. Mas você pode fazer uso das ferramentas gratuitas como GIMP, ang foto B também. O mais importante só significa que você tem que fazer em uma imagem é modificar as dimensões de acordo com a necessidade do site. Isso pode ser feito criando um novo documento no tamanho desejado, colocando a imagem e simplesmente exportando-a no formato JPEG. Você também pode fazer isso em grabber, projetá-lo por um mascarando a imagem nesse retângulo. Se você quiser melhorar as cores, então você terá que usar o Photoshop ou as ferramentas gratuitas como o GIMP e o photocopy. Além disso, você pode fazer uma seleção para cortar uma parte específica ou remover o plano de fundo. Sinta-se livre para explorá-los como por sua conveniência. Também apresentarei um curso dedicado sobre criação de conteúdo que incluirá tutoriais aprofundados para escrever conteúdo, design gráfico usando ferramentas dedicadas e até edição de vídeo. Mas eu acredito que você tem uma quantidade decente de conhecimento sobre design gráfico que é necessário na criação de um site. É isso para aprender nesta lição, e vamos continuar no próximo vídeo. 14. Entender o negócio: Tudo bem, Então estamos concluídos com as fundações e vamos agora dar o primeiro passo para criar o site. Qual é o primeiro passo? O primeiro passo que temos que dar é descobrir. Aqui, temos que entender o negócio, entender o produto ou serviço, entender o mercado, os concorrentes e, o mais importante, entender os clientes. Se desenvolvermos a compreensão correta do negócio e dos clientes, então só nós seremos capazes de criar um site que converte. Eu tenho dito a você para pensar sobre o propósito de criar o site. E agora eu quero que você mergulhe fundo e venha com um esboço para o site. Você pode dividir o plano em quatro seções. O primeiro é o negócio. Pode ser um indivíduo ou uma empresa. Em segundo lugar, o mercado. Terceiro é os clientes da sala de audiência, e quarto é o site. Você tem que encontrar respostas para algumas das perguntas. Vamos começar com o primeiro. Esse é o negócio. O que faz o produto ou serviço que as empresas fornecem? Pode ser uma versão física ou digital, um serviço profissional, ou apenas uma plataforma informativa com conteúdo útil está disponível para leitura. Tente entender profundamente o produto e serviço. Essa é a primeira pergunta que você tem que responder. Além disso, você precisa percorrer os detalhes como a história do negócio. Sua especialidade é sua USP. Essa é uma proposta única de venda. Esta é uma glândula muito importante, descobriu como a solução que você está fornecendo vai beneficiar os clientes. Finalmente, ótimo para chegar com os valores da empresa, o núcleo de mensagens e a voz da empresa para criar um tom para o conteúdo. Como você quer falar com os clientes? Encontre uma resposta para todas essas perguntas. Em seguida, é entender o mercado. Tentou chegar ao mercado-alvo, geografia e sites concorrentes, funil VOT que os concorrentes estão usando. É uma abordagem de vendas diretas ou um processo de criação de e-mails? Qual é a tendência atual do setor? Qual é o design drenado para isso, o tom de conteúdo, qual é o funil de vendas? Próximo? E o mais importante é entender o público-alvo e os clientes-alvo, certo? Para chegar ao habitat do público, seus desafios e pontos de dor. Planeje a jornada completa do cliente no site, quantas páginas ele terá que navegar antes de chegar à ação. O último passo é planejar o site com base nas respostas das perguntas anteriores. As características de um ideal visitado que iria visitar o site, descobrir para que eles esperam encontrar ou que ação eles querem tomar no site? Qual é o objetivo principal do site? É informação, vendas ou apenas leads? Se você está classificando o site para si mesmo, então você pode gastar tempo pensando nas respostas para todas essas perguntas. E se você está namorando o site para o cliente, envie-lhe esse modelo e peça o resumo completo. É um passo muito importante no processo de criação de sites e é seguido para construir marcas. Sim. Quero que você assuma essa tarefa como se tivesse construído uma marca e não apenas um site. Afinal, criamos sites para expandir o negócio. Mas se não seguirmos as melhores práticas, talvez não obtenhamos os resultados desejados. Se você está apenas começando o negócio. Pesquisas competitivas ou sites que oferecem serviços semelhantes irão ajudá-lo muito a obter este breve resumo. Quanto mais você aprender sobre o negócio, melhor você será capaz de projetar o site e gerar retorno sobre o investimento. Então, uma vez que você terminar com essas perguntas, você está pronto para prosseguir. Continuaremos no próximo vídeo. 15. Lista de Webpages e criação de uma biblioteca de modelos: Depois de entender o negócio, você precisa criar uma lista de páginas necessárias no site. Isso dependerá da finalidade do site, da jornada do cliente, do número total de produtos, serviços e do funil que você deseja seguir para o negócio. E as respostas das perguntas que discutimos no vídeo anterior irão ajudá-lo muito no planejamento do site. Você pode começar criando um sitemap estruturado assim e preencher a lista de páginas. Crie uma categoria de submenu ou páginas de redirecionamento sob as principais. A página mais importante do nosso site é a página inicial. Geralmente é a página padrão. Visitante vê o primeiro quando ele visita o site. Em geral, o conteúdo da página inicial pode ser estruturado da maneira que discutimos na lição de copywriting. Mas se vamos fazer um site de página única, então a página inicial é a única página que você precisará. Embora eu nunca recomendo criar um site de página única, pois não é de todo bom do ponto de vista dos motores de busca. Porque se você tem páginas não classificar no Google, você vai perder todo o tráfego importante. Em geral, as páginas básicas a ter em um site são a página Sobre, a página do produto, ou eles ainda vão página Serviços, página de contato, as páginas legais como política de privacidade, termos e condições e um erro para 0 para a página que é exibida quando um usuário solicita alguns pagamentos que não estão disponíveis ou não existem no site, sinta-se livre para chegar com a lista necessária de páginas para o site. E você também pode pesquisar a indústria e verificar páginas modernas estão disponíveis no site do concorrente. A seguir é pegar uma referência e construir uma biblioteca de modelos. Você pode assumir uma ofensa para o site visitando os outros sites, você pode verificar quais páginas eles estão usando, quais esquemas de cores eles estão usando. Como eles teriam organizado as seções e um monte de inspiração. Não é assim. Você pode se inspirar apenas nos concorrentes da mesma indústria. Você pode tirar ideias de inspiração, design e conteúdo de qualquer site na web. Você pode se inspirar para uma única linha, única seção, uma única página da Web ou para o site completo. Inspirar não é nada ruim porque quanto mais você observar diferentes designs, melhor será sua saída de design. Eu estou pedindo para tomar inspirações, não copiar o design completo ou conteúdo em seu site. Se você deseja usar o design completamente pronto do que há tantas páginas web pré-projetadas e projetos de sites disponíveis para download e uso em um site. Estes são modelos ímpios. Modelos que rotulei para todo o site, uma única página da Web e até mesmo para seções individuais. Como estamos usando o Elementor, temos acesso a uma enorme coleção de modelos no próprio Elementor, embora alguns deles sejam gratuitos, enquanto outros são pagos. A propósito, Elementor é o Page Builder que vamos usar em nosso processo de criação de sites. E é um plugin WordPress muito popular para projetar sites impressionantes sem qualquer codificação, você pode importar os modelos para usar na página web. Majestic clique no botão. E uma vez que estaremos usando Astra Tema vívido, obter mais alguns modelos de site no plugin modelos iniciais Astra. Esta é também uma maravilhosa coleção de sites pré-projetados e os Betas. Se você deseja explorar mais recursos, eu recomendarei que você visite Envato Elements e, com uma pequena taxa de assinatura, você terá acesso a uma enorme biblioteca de modelos Elementor para baixar e usar no site. Estes modelos são úteis na criação de um site em um período muito curto de tempo, porque você tem que apenas editar o conteúdo e substituir as imagens. É isso. O layout é bom, somos diferentes e otimizados. Usamos esta técnica para criar um site e simplesmente não eram para o cliente. Há tantos outros sites que fornecem modelos Elementor gratuitos como tyler.com e sinta-se livre para explorar o modo, fazendo alguma pesquisa do Google. Outra coisa construir uma biblioteca de modelos não é apenas baixar e importar o modelo. Trata-se de criar uma coleção de seções e páginas. Digamos que se você gosta da seção de herói de qualquer site, você pode tirar uma captura de tela dele e salvar na biblioteca. Não se esqueça de organizá-lo ou então você vai acabar criando uma bagunça. Se você quiser a página Sobre Nós de um site ou alguma seção de chamada à ação, ou o layout de um formulário de contato ou apenas qualquer coisa que esteja lindamente projetada. Faça uma captura de tela e salve-a para usar como referência para algum projeto futuro. Você pode até tirar a captura de tela da versão móvel e tablet de um site acessando as Ferramentas do desenvolvedor e selecionando o dispositivo como este. Agora, como tirar uma captura de tela? Estou usando uma extensão muito simples do Google Chrome chamada como tiro de fogo, e é muito fácil capturar uma captura de tela. E você pode gastar tempo explorando os mais recentes designs de sites em Behance, Dribble ou artes para obter novas ideias para o projeto. Você vai encontrar muitas coleções em uma variedade de sites para obter inspiração de design. Você pode criar um quadro de inspiração no Figma ou qualquer ferramenta de design de site para criar uma biblioteca de designs. Cabe totalmente a você como você cria e gerencia sua responsabilidade. Mas tome meus verts, vai te ajudar muito. Então terminamos com o passo número 1. Essa é a descoberta. Não estamos cientes do mercado, dos concorrentes e das preferências dos nossos clientes. Tomamos referências e construímos uma biblioteca e agora é hora de finalizar o conteúdo, a tipografia, o esquema de cores, o layout e o design do site na próxima etapa que está projetando. Vejo você no próximo vídeo. 16. Marca: Branding é muito importante para o site, pois ajuda na construção de uma percepção na mente do visitante. Ele cria credibilidade para você no mercado e também apoia as atividades publicitárias. Branding define quem você é e como seu negócio se parece. Agora, existem vários fatores que desempenham um papel na transmissão da personalidade da marca. Mas se eu contar os quatro fatores mais importantes para o site, eles são o logotipo desse site, esquema de cores, tipo, biografia e amanhecer do conteúdo. Se você manter a consistência nestes quatro fatores ao longo de todo o site, que o visitante vai definitivamente obter a sensação de parentalidade e desenvolver uma percepção positiva através da navegação no site. Agora pode haver dois cenários. Primeiro, você pode estar apenas começando e não há histórico de marca em tudo, significa sem logotipo, sem cores de marca, nada. Segundo poderia ser que você está fazendo um site para um negócio já existente que tem algum logotipo e até mesmo algum site antigo. Para tal caso, você pode planejar um processo de rebranding, se necessário, ou então você pode usar o mesmo logotipo e criar o esquema de cores relevante e continuar com o processo de design do site. Por enquanto. Estou considerando que você está começando do zero e vamos começar por criar um logotipo. Já discutimos o processo para projetar um logotipo na lição de design gráfico. Sempre começar com algumas idéias brutas e criar várias opções de acordo com o tempo e orçamento do projeto. Não se preocupe com as cores até que o esquema de cores seja finalizado. Basta dar uma cor preto e branco a ele. Apenas certifique-se de experimentar com os telefones e formas e criar o logotipo mais ideal para o site. Então você tem que finalizar o esquema de cores. Isso pode ser feito apresentando as cores preferidas da marca ou tomando referências das cores de outras marcas. Você também pode fazer uma pesquisa no Google para conhecer as combinações de cores mais populares para qualquer setor. Recomenda-se começar selecionando as cores primárias, que serão as cores dominantes que são usadas em alto volume no site. Então você precisa selecionar a cor secundária que é usada para complementar a cor primária sempre que necessário. Então você precisa de uma cor de destaque que é usada para destacar algumas seções extremamente importantes, como um botão de chamada à ação. A cor do acento deve se destacar para dar ênfase extra ao elemento. Então você tem que selecionar as cores para a tipografia. Certifique-se sempre de manter uma boa taxa de contraste entre a cor do cabeçalho e a cor do plano de fundo. Na verdade, qualquer texto e a cor de fundo no site. alertas tipográficos incluirão cores para cabeçalho, parágrafos de subtítulo e texto do botão de chamada à ação. Finalize todas essas cores antes de iniciar o processo de design. Uma vez que você é feito com a seleção de cores, é hora de colocar cores no logotipo. Em seguida, você deve selecionar os telefones para títulos, subtítulos, parágrafos e texto do botão de chamada à ação. Crie uma lista completa de opções de estilo como família de telefone para cada tipo de cabeçalho, tamanho da fonte e peso da fonte. Novamente, você pode experimentar aqui com diferentes opções de fontes do Google ou fazer referência de algum site, ou até mesmo fazer uma pesquisa do Google para os telefones mais populares para usar no site em alguma indústria, mas fazer o lista completa de telefones e estilo de antemão. Em seguida, é fazer alguma estratégia de conteúdo, tendo em mente os valores da empresa. E, consequentemente, precisamos ajustar o tom do conteúdo e imagens que devem ser usadas no site. Por exemplo, os valores de uma marca podem incluir otimismo, Diversão e eco-friendly. Então você tem que compor o conteúdo de uma forma que represente que cada problema tem uma solução que é otimismo. E também usar alguns fatos divertidos e mostrar algum cuidado com a natureza. Algumas marcas mostram sua confiabilidade, algumas destacam sua inovação, e algumas querem entregar uma sensação de toque pessoal. É um tópico de marketing amplo, mas espero que você tenha tido alguma idéia sobre o branding em termos de valores. Então, para concluir, o tópico de branding aqui, sempre manter a consistência em cores, tipografia e tom do conteúdo em todo o site e até mesmo em todos os outros canais como mídia social, canal do YouTube e em todos os outros lugares na web. No próximo vídeo, vamos aprender como usar uma ferramenta de design para criar o design do site antes de passar para o material de desenvolvimento. Vejo você lá. 17. Como criar o site: Temos aprendido sobre como usar Figma nesta lição. Se você quiser apenas criar o design e não formar o protótipo funcional, então você pode projetar para páginas no designer gravíssimo ou Adobe Illustrator ou Photoshop ou qualquer ferramenta que esteja disponível para você e conveniente para você. Mas eu recomendo que você use apenas Figma ou XD ou Sketch. Vamos para Figma e inscreva-se para uma conta gratuita. Você pode acessar o Figma no navegador ou você pode instalar o aplicativo no computador também. É completamente baseado em nuvem, muito fácil de configurar. E aqui está o painel. Agora, vamos criar um novo arquivo, e esta é a tela em branco. É como qualquer outro tipo de edição gráfica. Você pode dar um nome a este arquivo clicando aqui. Agora, o primeiro passo é obter nossos votos ou quadros nesta página. Clique na ferramenta de quadro e, à direita, você pode selecionar um dispositivo para obter as dimensões do quadro. Queremos criar um site responsivo. Então vamos criar quadros-chave. Um para um computador, para um tablet e para um telefone celular. Estou clicando no MacBook aqui e uma moldura é inserida. Posso alterar as dimensões do quadro a partir do menu de estilo direito. Estou mantendo a largura de 100, 400 pixels como uma largura de contêiner padrão distinta para nossos inversores de construtor de páginas, você pode pressionar a tecla Control e usar a roda do mouse para ampliar e diminuir o zoom. Você pode clicar e arrastar a tela com o mouse. Deixe-me inserir uma moldura para o tablet e celular também. Altere o nome do quadro para página inicial clicando duas vezes no título. Você também pode fazer isso para os quadros restantes. Se você tem alguma imagem de referência para um site, você pode clicar neste ícone. Selecione a opção, mantenha a imagem e selecione o arquivo do computador. Você pode colocar isso perto do quadro. E então, se você quiser se inspirar, está sempre aqui para ajudá-lo. Então, sempre começamos criando o cabeçalho e rodapé como eles serão consistentes para todo o site. Deixe-me ampliar um pouco. Sim, isso é bom. Selecione um retângulo clicando nesta opção. Desenhe um retângulo usando o mouse e deixá-lo chegar às dimensões 1140 pixels largura e 72 pixels altura. Você também pode ajustar as dimensões a partir daqui e ajustar a posição e o alinhamento. Mas espere, eu aumentei, dê-lhe as cores e o conteúdo aqui. No processo de design do site, é sempre recomendado criar um wireframe em um diagrama de blog primeiro, que representa o layout e o posicionamento do conteúdo no site. Sim. Basta criar um esqueleto em cinza e branco cor no cliente para chegar ao posicionamento do conteúdo. Você pode fazer isso para todas as páginas que são necessárias no site e, em seguida, começar a trabalhar nos elementos visuais. Colocar as caixas e o texto é uma tarefa simples em Figma, assim como designer gráfico, você pode agradar os elementos mudar a cor, dimensões ajustadas, alterar os formulários, alinhamentos, posicionamento manual muito facilmente. Uma vez que este wireframe é feito. Testado se contém as seções desejadas para mostrar todas as informações que queremos no site ou não. Assim que estiver satisfeito, prossiga com o design visual. Vamos agora dar a isso uma cor como por meu portão de marca. Agora vamos colocar o logotipo clicando na lista suspensa deste ícone e selecione Colocar imagem, selecione um arquivo de logotipo e clique para colocá-lo no quadro. Você pode ajustar o tamanho mantendo pressionada a tecla Shift para manter a proporção, arrastá-la e posicioná-la na posição apropriada. Em seguida, vamos criar o menu de navegação. Uma vez que estamos finalizados com a lista de páginas, vamos mencioná-las no menu de navegação aqui. Clique nesse texto, Reagan, e coloque o texto. Você pode mover a posição com o mouse e eles mantiveram fora das faixas de encaixe. Ajuste a família da fonte, o tamanho da fonte e a cor do texto no menu de dimensionamento à direita. Agora, para criar uma cópia, você pode pressionar Control C e Control V, ou simplesmente manter pressionada a tecla Alt. Arraste, arraste, arraste e solte a camada. Ele criará uma cópia. Você pode manter a tecla Shift pressionada enquanto arrasta para manter o alinhamento intacto. Você vai agradar as diferentes camadas, o espaçamento entre elas é destacado e você pode organizar o alinhamento também. Portanto, nosso design de cabeçalho está pronto e o próximo passo é projetar o filtro. Vamos tomar outro retângulo e dar-lhe as dimensões 11, 400 pixels inverter e lutou 100 pixels de altura. Você pode, obviamente, mudar a altura assim. Aqui você pode colocar o menu secundário, itens de navegação e links para páginas legais como este leva a botões de conexão social e também por favor um formulário de inscrição boletim informativo. A ideia é muito simples. Você pode usar Figma para chegar com o design de cada parte do site. Agora, uma vez que o cabeçalho e rodapé estão prontos, vamos agrupar os elementos fazendo uma seleção, pressionando Controle G, e ele é agrupado. Clique duas vezes aqui e renomeie a camada. Visto com o rodapé, clique duas vezes no nome, é isso. A lista de camadas à esquerda é útil para organizar a herança e, muitas vezes, localizar um grupo de elementos. Se os elementos estiverem agrupados, você pode clicar nesta divisa para abrir a lista de camadas. Clique na camada individual e ela é selecionada. Em seguida, é criar uma seção de herói do site. Mais uma vez, retângulo mais grosso, dar-lhe as dimensões quando, quando Ford pequenos pixels inverter e eu estou tomando 600 pixels altura. Agora, por favor, um fundo como gradiente de cor sólida ou uma imagem. Estou tirando uma imagem. Neste caso, para substituir a imagem, seguiremos o mesmo processo, selecione uma imagem do dispositivo e clique na área em branco para inseri-la. Agora, queremos colocar esta imagem dentro desse retângulo. Então vamos trazer a camada de imagem logo acima do retângulo e, em seguida, selecione tanto clique com o botão direito e selecione usar como mesquita. Agora, clique duas vezes na janela nesse retângulo. Você pode ajustar a posição da imagem. Não se esqueça de manter a tecla Shift pressionada enquanto o dimensionamento para manter a proporção. E Figma também oferece algumas opções de edição de imagem aqui. E se você quiser exportar esta imagem para carregar no WordPress, basta selecionar o grupo de máscaras, clique no ícone de mais aqui na opção de exportação, selecione o formato e o que precisamos, precisamos de um JPEG, salve-o. A imagem é redimensionada como dimensão necessária para usar no site. Teremos que usar essa técnica muitas vezes enquanto exploramos os logotipos e ícones para manter a dimensão consistente. Em seguida, você pode adicionar alguns textos como cabeçalhos, subtítulos e CD. Deixe-me adicioná-los rapidamente. Ajuste o estilo do telefone como para o guia de identidade visual. Então, aqui a seção de heróis de amostra está pronta. Da mesma forma, você pode criar as próximas seções e mais seções e mais e mais. Continue projetando e continue adicionando as seções que você não está no site. Desta forma, uma praia deve ser projetada em Figma primeiro e todos os experimentos de conteúdo e layout devem ser feitos aqui. Antes de passar para a parte de desenvolvimento, você pode criar o design desta página para celular e tablet, bem como, em seguida, prosseguir com o design de outras páginas criando mais quadros. Você também pode colaborar com a equipe para trabalhar em conjunto em um projeto de site, embora haja algumas limitações no plano gratuito. Agora, para ver a visualização, basta clicar no botão play aqui e você pode obter uma visualização de todas as páginas da web que você projetou. Figma não é apenas uma ferramenta de design, é de fato uma ferramenta completa de prototipagem onde você pode criar um protótipo funcional completo do design que liga para melhor um site ou um aplicativo. Antes do desenvolvimento, vá para a opção de protótipo aqui e atribua interações de link como esta. Eles também não são recursos avançados, como liderar um componente e ajustar os visuais atribuindo restrições. E coisas muito mais avançadas que são úteis no design da interface do usuário do site e do aplicativo. Se você tem espaço para aprender mais, sinta-se livre para explorar mais sobre Figma e prototipagem. Existem algumas vantagens principais de ganhar um design primeiro antes do desenvolvimento. Em primeiro lugar, você vai compartilhar seus projetos com o cliente para receber feedback ou fazer alterações. Em seguida, ele salva o aluguel de hospedagem para o tempo consumido na criação deste design para o site. Em seguida, você sempre terá o histórico de versões. Como se você redesenhar o site no futuro, você ainda terá o design antigo salvo aqui em Figma. E se o cliente pedir variações, você pode nossos genes a página novamente e novamente no site diretamente em vez disso você pode manter uma cópia de todas as variações aqui, mostrá-lo para o cliente e desenvolver o que está finalizado. Em seguida, você pode zoom in e zoom out capacitor diferentes páginas para consistência de design completamente, que não é possível durante o seu desenvolvimento na etapa do site. Em seguida, você pode obter uma visão de todas as três versões que é computado móvel e tablet na mesma tela, o que novamente não é possível durante o desenvolvimento. Finalmente, eu quero dizer que projetar um site ou uma página na Figma vai economizar seu tempo porque você tem que experimentar muito com seus projetos e você nunca tem certeza sobre o conteúdo final e design. Eic começa. Então, se você pular medicamente fazer Elementor e começar a desenvolver o site, será uma tarefa tediosa para experimentar com a aparência e sentir e, eventualmente, tomar um monte de tempo. Estou me repetindo aqui. É muito importante projetar primeiro porque você pode experimentar com projetos e observado que responde a cada projeto, mas simplesmente não é possível com desenvolvimento direto. Outra coisa que eu quero esclarecer é que você deve estar se perguntando que depois de ler o design e Figma, você tem que baixar o InDesign e carregá-lo no Elementor para criar o site. Mas não, isso não é possível. Figma é apenas uma ferramenta de desenho e você só poderá exportar a imagem. E para desenvolver o site, você tem que seguir os mesmos passos novamente no Elementor e criar as páginas web para completar o site. No entanto, uma vez que você desenvolve uma página da Web no Elementor, esse design pode ser salvo e usado. Você pode exportar as seções ou a página completa para usar em alguns outros sites criados com o Elementor. Aprenderemos mais sobre isso mais tarde no curso. Então, estamos agora prontos com o design do site. Sempre comece com o wireframe, que é o design do bloco e, em seguida, complete todos os elementos visuais antes de passar para o estado final de desenvolvimento usando Elementor. Espero que você tenha gostado deste processo e eu vou vê-lo no próximo vídeo. 18. Fundamentos do nome de domínio: Tudo bem, então finalmente, estamos aqui. Aprendemos todos os conceitos básicos e fundamentais. E nós também aprendemos os dois primeiros passos que é descoberto e design. Agora é hora de começar. O último passo, isto é, o desenvolvimento. E a primeira coisa que vamos ver são os fundamentos do nome de domínio. Então você está familiarizado com os eleitores um nome de domínio, deixe-me repeti-lo. Um nome de domínio é o endereço web exclusivo de um site na Internet, como google.com é o endereço do google, e Facebook.com é o endereço do Facebook. Esses endereços da Web são exclusivos. Isso significa que se um é um endereço web é tomado, você não vai obtê-lo. Tenha em mente que uma vez que um nome de domínio é registrado, você não será capaz de obtê-lo a menos que ele esteja sendo oferecido por um revendedor. Sim, a revenda de nomes de domínio também ganhou popularidade, em que as pessoas por nomes de domínio populares com antecedência e, em seguida, vendê-las a um preço mais alto com base na novidade premium do nome de domínio. Então, se você não quiser acabar pagando uma enorme quantia de dinheiro por um nome de domínio. Eu recomendarei que você registre um nome de domínio o mais cedo possível. Esse é o primeiro conceito fundamental de um nome de domínio. Ou seja, aja muito rápido. Em seguida, temos que discutir algumas profundidades para selecionar o nome de domínio correto para o site. Vamos começar com ele. Nomes têm poder. Isto é tão verdadeiro para um site como para qualquer outra coisa. É importante escolher um nome de domínio que funcione para a empresa. Muitas vezes, cria uma impressão para o site. Você também pode incluir alguma palavra-chave ou apenas uma palavra de nicho usada em sua indústria para mostrar relevância para os visitantes. E o mais importante, um nome de domínio representa sua marca. Portanto, se você já tem uma marca ou criar uma, escolher o nome de domínio correto é muito essencial. Você sempre pode iniciar o processo de seleção por brainstorming. Porque quem mais além de você sabe, urina, Frank, melhor? Pense do ponto de vista do cliente. Em seguida, você pode obter algumas ideias e inspiração de geradores de nome de domínio e negócios, como bucket de marca ou domínio. Faremos uma lista crua e responderemos às seguintes perguntas. Você se sente bem com o nome? Você gosta? Está confiante quando diz isso? Sente-se bem quando escreve ou lê? É duplo de marca? É único, fácil de lembrar e significativo? É fácil ler e soletrar? Passa no Google Fest? Vá no Google. O nome. Idealmente, não deve haver nenhuma outra organização para aparecer. Se houver, pelo menos você quer ter certeza de que eles não estão no mesmo setor ou mesmo em um setor intimamente relacionado. Nunca queremos entrar nas questões legais. Em seguida, você vai experimentar com os novos TLEs. TLD significa domínio de nível superior. É basicamente a extensão nos nomes de domínio como.com dot n dot, dot IO, dot store dot online. Se necessário, você pode ir para TLD específico do país é como dot us, dot ibm dot FR para segmentar uma determinada área geográfica. Anteriormente, as pessoas costumavam preferir .com, pois é o mais fácil de lembrar e se relacionar com um site. Mas agora é comum encontrar outros TLs no nome de domínio. Cabe a você e definitivamente você pode dar o primeiro tentou to.com apenas. Mas se não estiver disponível, você pode pensar sobre as outras opções. E às vezes usar um DLD torna o nome de domínio mais relevante para o negócio como eu usei dot Academy para o meu site. Representa claramente que eu estou fornecendo algum tipo de treinamento no meu site enquanto faço a seleção de nome de domínio. Certifique-se de que é relevante para o negócio e a marca. Certifique-se de que é curto e claro, criativo e fácil de lembrar, fácil de ler e pronunciar. Certifique-se também de que é fácil de digitar. Seus visitantes devem ser capazes de digitar seu nome de domínio sem problemas. Se você tem que explicar a ortografia mais de uma vez para um visitante, deve ser entendido que é complicado e você não deve tomar qualquer nome de domínio complicado. Isso pode levar a potenciais visitantes a confundir seu domínio e acabar em um site diferente. Além disso, evite hífens e números. Depois de finalizar com o nome de domínio, não demore mesmo como um único segundo e registrá-lo. Vamos lá, diabos, muito rápido. Mais um conceito a entender é o de um subdomínio. Então, o que é um subdomínio? Um subdomínio é uma parte do nome de domínio que vem antes do nome de domínio principal e da extensão de domínio. Para entender isso, vamos entender a estrutura de uma URL. Um URL contém duas partes que são protocolo e o nome de domínio. Um protocolo é um conjunto de diretrizes que um navegador segue para enviar uma solicitação para o servidor, como HTTPS ou HTTPS dois-pontos barra www, assim. Considerando que um nome de domínio consiste em duas partes. O TLD, que é domínio de nível superior como.com ficou acidez irritada. Isso é domínio de segundo nível como Facebook, Google ou Rahula Rohde é sub-domínio contém um segundo nome antes do SLD. Por exemplo, se o Facebook lança um curso, ele pode ter um subdomínio, lake núcleos dot facebook.com, e este será um subdomínio. Um subdomínio é comumente usado para separar logicamente o site em seções, e cada seção é uma identidade de site separada. Você pode usar um subdomínio para lançar um site de carreira. Se o site do fórum para suporte ao cliente, você pode usar subdomínios para criar blocos de diferentes equipes para todos esses sites de subdomínio são exclusivos e indexados separadamente no Google. E você tem que instalar o WordPress separadamente porque esses subdomínios são identidade única. E desta forma, você pode usar um único domínio primário para criar n número de subdomínios para criar sites diferentes. Então é isso para aprender nesta lição, e vamos aprender como registrar um nome de domínio no próximo vídeo. Vejo-te lá. 19. Passos para comprar um nome de domínio: Vamos agora ver o processo passo a passo para comprar um nome de domínio. Há tantas empresas de registro de domínio disponíveis e você pode prosseguir com o registro do domínio com qualquer registrador de sua escolha. No entanto, alguns fatores-chave a serem considerados ao selecionar um registrador de domínio podem ser, número um, a repetição do domínio que é apenas difícil. Número 2, a facilidade do processo de compra. Número 3, o número da interface do painel para a disponibilidade do TLD. E o número 5 é o preço. Eu tenho mantido surpreendente como o último fator porque normalmente a diferença de preço nunca é demais entre os diferentes registradores de domínio. E embora não haja muito a comparar entre os diferentes registradores de domínio, eu pessoalmente recomendo que você compre um domínio de domínios do Google. Boa ideia, chamada barata. Pessoalmente, prefiro domínios do Google para comprar domínios para mim e para os meus Klein. Os motivos para preferir domínios do Google são a facilidade de uso, menu de navegação limpo, a reputação do Registrador e o modelo de preço fixo. Outra vantagem é que os domínios do Google fornecem proteção de privacidade gratuita, enquanto o GoDaddy o fornece como um complemento e cobra uma pequena taxa por ele. Além disso, posso integrar o nome de domínio facilmente com outros serviços do Google, como o G Suite. Na verdade, a única diferença significativa entre os domínios do Google, GoDaddy e Name Cheap é o modelo de preço fixo. Godaddy e nomeado ofertas de desconto barato na primeira compra de domínio. Mas as taxas de renovação são um pouco maiores. Por outro lado, os domínios do Google cobram um preço fixo para a primeira compra e também para as energias renováveis são atingidos. Portanto, cabe a você decidir se você quer um primeiro desconto de compra no GoDaddy ou nome barato, e depois pagar uma taxa ligeiramente maior nos anos de renovação. Ou você quer pagar um preço fixo Gately se você está registrando o domínio por um ano, e se você conectar dois, e se você conectar dois, registrou o nome de domínio por digamos, cinco anos ou 10 anos, por favor, compare a diferença de preço antes de tomar a decisão final. Há mais uma diferença. Se você quiser comprar um nome de domínio premium que geralmente está disponível a um preço premium, então você deve preferir GoDaddy porque boas idéias para maior coleção de nomes de domínio premium. Alguns nomes de domínio que são Magnus esgotados, também estão embalados e disponíveis para compra de revendedores. Então, se você tem algum nome de domínio preferido que está sendo marcado como vendido, eu recomendo que você insira o domínio e URL e visite o site, quer verificar a disponibilidade desse nome de domínio. Além disso, se você quiser comprar um domínio a preços mais econômicos, então você também pode explorar hospedagem lá. Alguns domínios com extensões como dot tech ou dot XYZ ou dot site fora de nível sob rúpias 100 ou apenas um a US $2 por um ano em hospedagem. Então, se você deseja obter um nome de domínio para o seu site de prática, você pode definitivamente comprar um de hospedagem. Se você está comprando este domínio por apenas um ano, tudo bem. Mas se você deseja renovar o nome de domínio, verifique o preço de renovação antes de comprar, pois há uma boa jogada nele. Agora, vamos ver os passos para comprar um novo nome de domínio. Dirija-se aos domínios do Google, ou uma boa ideia chamada barata, fazendo uma pesquisa no Google. Deixe-me levá-lo para ir, pronto. Aqui no GoDaddy, basta digitar o nome desejado que você deseja comprar como seu nome de domínio. Para verificar a disponibilidade. Depois de clicar na pesquisa, você receberá uma lista de nomes de domínio disponíveis em uma variedade de extensões como.com ponto n, ponto, ponto, ponto, ponto, IU e modo. Essas extensões são chamadas como TLBs. Se o preferred.com não estiver disponível, você pode escolher entre uma variedade de extensões. Sinta-se livre para explorar e selecionar uma extensão criativa como ela funciona agora. Lembre-se que três regras de ouro para selecionar o nome de domínio certo para o seu site. Número um, tente escolher o nome mais relevante que representa o seu negócio, marca, produto e número de serviço para tentar mantê-lo o mais curto possível. Número 3, tente selecionar um nome de domínio que seja muito fácil de lembrar. Depois de encontrar um nome de domínio de sua escolha, basta adicionar o nome de domínio ao carrinho e prosseguir para a finalização da compra. O processo restante é tão simples quanto fazer um pedido na Amazon. Você pode ser solicitado a fazer login ou criar uma nova conta no GoDaddy. Basta digitar as credenciais de login e você será oferecido alguns serviços extras junto com o seu nome de domínio, que tinha basicamente os serviços de venda adicional. Você pode felizmente ignorá-los e proceder para fazer o pagamento. Assim que o pagamento for feito, você poderá acessar seu nome de domínio nas listas de produtos. Parabéns, você registrou com sucesso um novo nome de domínio para o seu site. Você pode seguir os mesmos passos com o nome de domínios do Google barato e hospedá-lo, os processos quase o mesmo. Então, se o próximo vídeo, vou dizer-lhe como obter um nome de domínio gratuito para o site de prática. Vejo você lá. 20. Como obter um nome de domínio gratuito para site de prática: Você pode registrar um nome de domínio facilmente usando qualquer registrador de domínio. E você pode até explorar um pouco para encontrar alguns domínios muito baratos, como dot XYZ, disponíveis na hospedagem. É muito econômico em torno de rúpias 100 ou foi para US $2 por um ano. Mas e se você quiser um nome de domínio completamente gratuito? Sim, é possível comprar um nome de domínio gratuito, mas 50 LDs, como TK dot, dot, dot c, f, r dot d q. E geralmente é gratuito por um período de 12 meses. Você pode registrar este nome de domínio livre de custo do registrador chamado como nlm livre. Frenum. É que uma descarga para nomes de domínio da pequena ilha de Tóquio permitir que um país remoto e muito escassamente povoado de cerca de 1500 pessoas no Pacífico Sul. Ele dá Domain Name Survey gratuitamente e por causa disso, ganhou popularidade. Na verdade, os domínios dot t k são a quinta extensão de domínio mais registrada no mundo. E você pode obter um para o seu site de prática. Embora não seja obrigatório se registrar para este nome de domínio gratuito porque você pode obter um subdomínio gratuito para criar o site de prática. Um subdomínio é uma parte do nome de domínio que vem antes do nome de domínio principal e da extensão de domínio. Você pode facilmente obter um subdomínio gratuito com o plano de hospedagem gratuito que discutiremos na próxima lição. Essa é uma opção muito mais confiável para o seu site de prática pois tem chances muito baixas de redirecionar um usuário para um site de spam. No entanto, cabe a você registrar o nome de domínio gratuito com dot TK ou usa subdomínio ou comprar algum nome de domínio barato de publicá-lo. O que mais importa é que você pegue um e comece com o site de prática. Então, na próxima lição, vamos aprender sobre o servidor web e os planos de hospedagem. Vejo-te lá. 21. Fundamentos do servidor web: Vamos começar esta lição com os fundamentos. Então, o que faz um servidor web e um plano de hospedagem é servidor é um computador que conecta outros usuários da web ao seu site de qualquer lugar do mundo. Como o nome indica, provedores de serviços de hospedagem web têm os servidores, conectividade e serviços associados para hospedar um site. Muitos provedor de hospedagem aloca espaço em um servidor web para um lado positivo para armazenar seus arquivos. O AD que hospeda seu site. Hospedagem web faz para lutar contra um site como imagens douradas disponíveis para visualização on-line. Cada site que você já visitou está hospedado em algum servidor. A quantidade de espaço alocada em um servidor para um site depende do tipo de hospedagem. Os principais tipos de hospedagem, hospedagem compartilhada, hospedagem dedicada, VPS, revendedor, travar, hospedagem em nuvem. Eles são diferenciados pelo tipo de tecnologia usada para o servidor, o nível de provedor de gerenciamento e os serviços adicionais oferecidos. Fora de lá diferentes tipos de servidores disponíveis. Estamos interessados apenas no plano de hospedagem compartilhada e no plano de hospedagem em nuvem. Hospedagem compartilhada é papel para ficar com um único servidor web é dividido entre n número de linhas. Uma vez que um servidor web é muito poderoso na configuração, no site básico usará apenas uma parte muito pequena do celular. Assim, a fim de utilizar o servidor web completamente e tornando as plantas econômicas para os compradores para hospedar seu site. As empresas de hospedagem fornecem planos de hospedagem compartilhada. Os planos de hospedagem compartilhada simplesmente compartilhou o servidor entre n número de usuários. Todos os usuários recebem uma configuração específica para seus atrasos. Algumas empresas otimizam os planos de hospedagem compartilhada para WordPress. Isso é chamado última hospedagem WordPress. Mas tenha em mente que WordPress hospedagem não é equivalente a Managed WordPress hospedagem. Estes são serviços diferentes. Wordpress hospedagem é econômico, mas gerenciado WordPress hospedagem ofereceu alguns recursos extras, e, portanto, que é um pouco no site caro. Então, sempre que você deseja comprar um plano de hospedagem compartilhada, sempre olhar para fora para a hospedagem compartilhada regular ou uma hospedagem WordPress. Se vemos as vantagens de um plano de hospedagem compartilhada, então número um, você tem que pagar menos para obter a hospedagem para o seu site. Número 2, algumas empresas ofereceram grande configuração mesmo no plano de hospedagem compartilhada. E número três, você tem acesso aos arquivos raiz e gerencia facilmente o site de acordo com sua exigência. No entanto, existem algumas desvantagens para o número um, os servidores de hospedagem compartilhada são muitas vezes lentos e aumenta o tempo de carregamento do seu site. Número 2, restrições de dados sobre o uso dos recursos e muitas vezes seu site está inativo depois que os recursos estão esgotados. Mudando, estranho. 22. Passos para comprar um plano de hospedagem: Escolher o plano de hospedagem certo ocupa um pouco de estudo e pesquisa. É verde passar tempo procurando o plano de hospedagem mais confiável para o seu site. E por que não? Porque um site é o seu ativo, seu valioso ativo que vai ficar por anos vindouros. Portanto, é muito importante construir esse ativo em um terreno que esteja livre de obstruções e perigos de problemas como falha, hacking, inacessível e servidores lentos. Eu gostaria de perguntar-lhe, como você se sentiu quando você tenta abrir algum site E portão dá-lhe uma edição dizendo que o site não é acessível fazer a razão anexo. Irrita você, obviamente, e forma uma péssima impressão em sua mente. Você pode até criar desconfiança para esse site. Está certo ou não? Diga-me honestamente. Agora a mesma coisa acontece com todos os usuários da internet. Assim, no processo de criar um site bonito, é muito importante selecionar um plano de hospedagem confiável, confiável e sólido para colocar seu site na web. Uma vez que selecionar o plano de hospedagem certo é um passo extremamente crucial, eu recomendo fortemente que você pesquise totalmente antes de comprar o plano. E se você quiser minha opinião, com base na minha experiência, eu vou recomendar que você investir em cadeia A20 se você estiver indo com plano de hospedagem compartilhada e maneiras de nuvem, se você quiser ir com hospedagem em nuvem, o serviços oferecidos por estas duas empresas são muito bons e eles fornecem muito bom valor para o dinheiro. Agora deixe-me mostrar-lhe o processo de compra de um plano de hospedagem para o site. Primeiro, vamos para a hospedagem A2 fazendo uma pesquisa no Google. Aqui, selecione o plano que deseja comprar e clique em Continuar. Você será solicitado a inserir seu nome de domínio se você tiver um, ou você pode usar um subdomínio. Aqui na configuração de hospedagem A2, eu recomendarei que você use um subdomínio, porque se você estiver indo com algum nome de domínio, então você será obrigado a renová-lo obrigatoriamente porque esse será o domínio raiz para o configuração. Então, ou você usa algum nome de domínio primário que você vai usar por um longo período de tempo ao configurar a conta de hospedagem ou então a melhor maneira é usar o subdomínio fornecido pela hospedagem A2 aqui. Lembre-se também de que você seleciona o local do servidor mais apropriado com base no local mais próximo do público-alvo. resto do processo é tão fácil quanto fazer uma compra online. Você pode feliz pular o anúncio em algum nível para up-selling, você será solicitado a criar uma conta. Vá em frente com o mesmo, faça o pagamento, e pronto. Você adquiriu com sucesso um plano de hospedagem para o seu site. Parabéns. A seguir estão os caminhos da nuvem. Vamos fazer uma pesquisa no Google para ele. Aqui. Comece com greening e conta como de costume, e eu vou tentar compartilhar algum código de cupom com você para que você possa obter US $30 prever que é quase três meses grátis em maneiras de nuvem. Verifique a seção abaixo deste vídeo. Uma vez que a conta é criada, depois de todo o processo de verificação, você precisa selecionar o servidor e a configuração. Aqui você tem opções para selecionar entre oceano digital, Leinhardt, abutre, Google e Amazon. Todos esses servidores são excelentes e desempenho e você pode selecionar um com base no preço, localização do servidor e sua exigência. Se você está apenas começando, eu mesmo recomendo usar o oceano digital sobre linha arte e cultura câncer durante a fase lútea. Depois de selecionar o servidor, você precisa simplesmente instalar o aplicativo, que é WordPress. No nosso caso. É isso. Existem algumas características marcantes da lei trabalhista sobre as maneiras da nuvem. Sinta-se livre para explorá-los. É uma hospedagem muito poderosa. Na verdade, uma hospedagem em nuvem muito poderosa. Indicar maneiras de nuvem em qualquer outro host é importante devido à facilidade de gerenciamento, suporte, desempenho na nuvem e opções de escalabilidade , como você pode atualizar o servidor em apenas alguns cliques. Além disso, o suporte é incrível em maneiras de nuvem. Além disso, você obtém um plano de preços flexível no qual paga pelos recursos à medida que usa. Se você quiser fazer uma comparação entre o prêmio, certifique-se de considerar o preço de renovação na hospedagem A2 e compará-lo com as maneiras Cloud para tomar uma decisão melhor. Porque geralmente em anfitrião diferente, você recebe um desconto muito pesado na primeira compra inicial, mas os preços da renina estão no lado mais alto. Portanto, precisamos considerar o preço de renovação porque mudar o host não é de todo uma tarefa fácil. Tudo bem, por fim, se você deseja obter uma hospedagem muito econômica para projetos menores ou para o seu site de prática, então você pode até mesmo preferir hospedar isso. O desempenho ato de hospedagem que é distinto e você vai encontrar o preço para ser extremamente econômico. O processo de criação da conta é quase o mesmo e você vai descobrir que opções regulares, como o outro host web, você será capaz de instalar facilmente WordPress e SSL com apenas alguns cliques. Então, se você quiser economizar muito dinheiro e hospedagem comprometendo com alguns dos recursos, consulte hospedagem lá. Mas tenha em mente que o econômico e os produtos sempre vêm com limitações. Como se você comparar a2 ou ficar com hospedagem, você vai descobrir que não há clareza na configuração e restrições de uso em hospedá-lo. Lake, por exemplo, você obtém SSL gratuito e este plano de hospedagem. Mas em quantos sites que não é mencionado. Então, as chances são de que você pode obter SSL livre, mas apenas para um site, e você pode ter que pagar extra para obter mais SSL. É o mesmo com outros planos de hospedagem econômica como GoDaddy e nomeado barato. Você vai obter as plantas a um preço super econômico, mas pode haver restrições e falta de clareza. Além disso, o tempo de atividade diminui com os econômicos. Então, eu recomendarei que você faça uma lista de tais perguntas e esclareça com o suporte ao cliente ou a equipe de vendas antes de fazer a compra. E mais uma coisa, maioria dos provedores de hospedagem fornecem garantia de devolução do dinheiro se você não estiver satisfeito com os serviços. Ec2 hospedagem de fato, oferece uma garantia de devolução do dinheiro vitalício que é bastante único em si mesmo, mas a maioria das outras empresas têm pelo menos 30 dias para solicitar o reembolso. Então, se você não está satisfeito com o plano de hospedagem, imediatamente afirmou que uma multa, e passar para o melhor host. Por causa da necessidade de construir nosso ativo. Precisamos construir um site apenas em terreno forte. Ou então podemos acabar perdendo o negócio e os clientes. É isso nesta lição, e continuaremos com as opções de hospedagem gratuita no próximo vídeo. 23. Como obter um plano de hospedagem gratuito para sites de prática: Todos gostamos das coisas livres. Então, se eu lhe disser que você pode obter um plano de hospedagem grátis, você vai ficar muito feliz. Mas antes de falar sobre os planos de hospedagem gratuita, eu quero alertá-lo que nunca, nunca use um plano de hospedagem gratuito para hospedar um site comercial ou cliente, pois esses serviços são adequados apenas para sites de prática e Não para os profissionais. Então, se você deseja obter um plano de hospedagem gratuitamente sem gastar dinheiro, então eu tenho algumas boas opções para você. Existem algumas empresas de hospedagem que fornecem planos de hospedagem para 0 encargos. Mas novamente, estou repetindo que você pode usar tais planos de hospedagem apenas para o site de prática como eles são bastante pouco confiáveis no serviço. E você pode enfrentar muitos problemas técnicos e tempo de inatividade enquanto hospeda o site em tais três servidores web. Então, no caso de você ter que publicar seu site em um servidor gratuito, Eu selecionei algumas empresas decentes que irá fornecer-lhe plano de hospedagem livre. O primeiro recomendado é estender hospedagem. E os outros para dar-lhe uma tentativa é hospedagem web aguda, host mordida, host pateta, e hospedagem infinito livre. Agora, eu espero que você vai comparar as características e benefícios de todos esses homens empresas de hospedagem compartilhada e selecionar aquele que acaba por ser fornecendo o melhor valor para o seu tempo. Você pode encontrar muitas restrições sobre limites de uso e você pode nem mesmo obter um SSL gratuito. Mas isso vai ser bom, já que estamos apenas criando este site para a prática. Selecione qualquer um dos planos de hospedagem acima para prosseguir. E os passos para configurar esta conta de hospedagem gratuita também são os mesmos. Você será solicitado a criar uma conta primeiro, enviar suas credenciais, selecionar um subdomínio, é isso. Sua conta de hospedagem gratuita na web está pronta. Agora basta usar um subdomínio gratuito fornecido a você para desfrutar do site de prática ou então você pode usar o domínio personalizado ou um domínio gratuito que você comprou de 39. Para usar um domínio personalizado, você precisará atualizar as configurações de DNS e aprenderemos sobre isso no próximo vídeo. Depois disso, você vai instalar o WordPress e criar um site gratuitamente. E não se esqueça, você tem que enviar a tarefa também. Você tem que criar o site de prática usando essas três opções e compartilhar o link comigo para que eu possa compartilhar meu feedback para o seu trabalho. Tudo bem, então continuaremos no próximo vídeo. 24. Como conectar domínio e hospedagem via configuração DNS: Depois de comprar o plano de hospedagem, você precisa fazer uma configuração muito importante para prosseguir. Você precisa atualizar o endereço IP ou os servidores de nome do servidor Web para o nome de domínio. Vamos primeiro entender por que isso é importante. Sempre que um usuário digita o URL na barra de endereços de um navegador da Web, o navegador bate a porta do domínio, não bate. O domínio fornece o endereço IP do servidor web onde os dados do site são armazenados. O navegador Gonstead busca os dados do site e os apresenta ao usuário. Agora, se o nome de domínio não souber o endereço IP do servidor web onde os dados do site são salvos, um navegador da Web não poderá apresentar o conteúdo da Web ao usuário e o resultado será uma página de erro. O endereço IP ou o servidor de nomes. Muitas vezes, os servidores da Web podem ser atribuídos ao seu nome de domínio por meio das configurações de DNS. Você precisa simplesmente localizar o endereço IP ou os detalhes do servidor de nomes fornecidos pela conta de hospedagem. Isso geralmente está presente nos detalhes do seu serviço ou mesmo na sincronização de e-mail de boas-vindas pela empresa de hospedagem, basta copiar os detalhes e ir para a conta de domínio. Então, deixe-me entrar na conta da GoDaddy e mostrar o processo. Depois de fazer login, vá para a seção do produto em que o domínio está listado e tente encontrar uma opção de configurações de DNS. Procure o campo chamado servidores de sobrenome. Basta colar os detalhes aqui e atualizar. Tenha uma coisa em mente que algumas empresas de hospedagem fornecem detalhes do servidor de nomes enquanto algumas fornecem endereço IP. Então, se você quiser atualizar os servidores de nomes, o processo será assim. E se você quiser atualizar o endereço IP, procure as configurações de DNS e atualize o endereço IP no campo de registro como este. Agora basta salvar as configurações e você conectou com sucesso seu host da web de figura de nome de domínio. Pode levar até alguns minutos ou algumas horas para atualizar as configurações de DNS em todo o mundo. Você pode verificar o mesmo visitando o Portsmouth DNS.net ou simplesmente fazer uma pesquisa no Google por verificação de propagação de DNS. Você receberá os links. Você pode seguir o mesmo processo para atualizar servidores de nomes ou endereço IP no Google, os domínios são nomeados baratos ou de qualquer registrador que você registrou o nome de domínio. Funciona da mesma maneira. Tudo bem, Na próxima lição, faremos login na conta de hospedagem e aprenderemos como usar o cPanel. Vejo você lá. 25. CPanel: Quando você faz login no plano de hospedagem, você precisa acessar o painel de controle para gerenciar os arquivos do site e outras configurações importantes. Existem diferentes painéis de controle, têm rotulagem, diferentes planos de hospedagem, mas o painel de controle mais comumente usado é o painel C. Então, o que é um cPanel? Então? Um painel C é um painel de controle popular que ajuda você a gerenciar o servidor de hospedagem web usando uma interface gráfica e humana amigável. Usando cPanel significa que você não precisa desse conhecimento técnico para gerenciar o servidor web. Vamos agora ver como funciona um cPanel. Bem, este é o terminal C dentro da conta de hospedagem E2. Ele oferece tantas opções, mas temos que nos concentrar apenas em domínios de casamento, subdomínios gerenciados, instalar WordPress, gerenciar os arquivos do site, gerenciar backups, versões gerenciadas do PS3 e gerenciar contas de e-mail. Sinta-se livre para explorar as opções restantes também. Agora, à direita, você vai encontrar os dados de uso e estatísticas como são fornecidos com o recurso limitado em qualquer plano de hospedagem. Então eu sempre recomendarei que você fique de olho nas estatísticas de uso para ficar ciente do seu consumo das fontes. Vamos começar com o gerenciamento de domínio. Você pode já ter fornecido um nome de domínio ao configurar o plano de hospedagem. Mas se você usou o subdomínio aqui, você pode adicionar esses nomes de domínio a partir desta opção. Quando você tem que adicionar mais sites à conta de hospedagem, você tem que listar o domínio em domínios complementares. Basta clicar em Criar um novo domínio adicional e digitar o nome do domínio aqui. Clique em Salvar. Pode levar algumas horas para instalar automaticamente o SSL neste domínio adicional. E você terá que esperar por cerca de duas a quatro horas até que o processo esteja completo. Então só você poderá instalar o WordPress neste domínio add-on dentro do SSL. Em seguida, se você deseja adicionar subdomínios ao seu domínio adicional existente, você pode clicar em subdomínios e clicar em Criar um novo subdomínio, selecionar o nome do domínio principal e fornecer detalhes de subdomínio que você deseja ter e clicar em Criar. Também levará algumas horas para instalar SSL e uma popa, você pode prosseguir para instalar o WordPress. Você terá que fazer a instalação do WordPress a partir do próprio painel C usando o software Oculus App Installer, é muito fácil. Veremos o processo completo para instalar o WordPress na próxima lição. Em seguida, depois de instalar o WordPress, se você tiver que acessar o diretório raiz e os arquivos do site, você pode acessá-lo usando a opção Gerenciador de arquivos no cPanel. Basta ter em mente que nunca experimente a opção Gerenciador de arquivos. Porque se você excluir por engano alguns dos arquivos importantes, então seu site pode falhar ou você pode perder o acesso para fazer login no site. Por favor, tenha muito cuidado ao usar esta opção. Em seguida, você pode fazer backup do site usando a opção back-office OUT aqui. Em seguida, você também pode gerenciar a versão PHP do servidor. Você pode atualizá-lo para a versão estável mais recente e ele é usado para melhorar a velocidade e o funcionamento do site. Certifique-se de que você sempre atualizou para a versão mais estável e mais recente. Em seguida, é gerenciar as contas de e-mail. Você tem a opção de criar e gerenciar contas de email para o nome de domínio que também é chamado como webmail. É como o seu ID de e-mail de negócios e é uma obrigação ter hoje em dia, com base nas características de glândula de hospedagem, você será capaz de criar n número de contas de webmail para criar um novo e-mail VM, use esta opção de contas de e-mail aqui no cPanel. Escolha o domínio e crie um nome de usuário e senha. Ele está disponível para uso instantaneamente após a criação. Você pode acessar este web mail diretamente a partir daqui ou usando algum aplicativo cliente de e-mail como o Microsoft Mail ou Apple Mail, ou algum aplicativo de terceiros, como o blue mail, tanto no computador quanto no celular. Há tantos outros recursos e opções de rótulo com cPanel, mas aprendemos os que são úteis para nós. Vamos agora proceder à instalação do WordPress no próximo vídeo. 26. Como instalar WordPress: Depois de adicionar o domínio ou subdomínio add-on, e algumas horas se passaram, você pode prosseguir para instalar o WordPress no domínio. Vamos selecionar estes de cálculo App opção instalador. Aqui, selecione WordPress. Você receberá uma opção para instalar o WordPress. Se você rolar para baixo, você vai encontrar a lista de todas as instalações WordPress que você fez no host web. Além disso, este ícone é o login mestre ou administrador. Isso é usado no caso de você esquecer o ID de login ou senha para acessar a área de administração do site. Além disso, você pode clicar no ícone de lápis para excluir uma instalação do WordPress. Eu quero que você tenha muito cuidado, pois leva meses e anos para ganhar vantagem. E o mesmo pode ser excluído em apenas alguns segundos clicando neste ícone de cancelamento. Tudo bem, tenha muito cuidado. Agora vamos avançar e clique em Instalar. Você está agora na página de instalação. Vamos selecionar o protocolo primeiro. Um protocolo é o nome inicial de uma URL, e é guiado pelas configurações de arquivo SCSS ponto. Existem quatro opções disponíveis a partir das quais temos que ignorar e selecionar uma de nossa escolha entre as duas opções restantes, ignoraremos as versões HTTP como elas são protocolos não-segurança sem SSL. Você deve ter visto esta manhã de conexão não segura em muitos sites, os usuários tendem a ignorar ou ter uma má impressão para tais sites. Mesmo isso é prejudicial para o seu site rankings na página de resultados do motor de busca. E uma vez que o SSL está disponível gratuitamente para nós, devemos garantir que o usamos. Doação de violinos, sempre instalar e versão HTTPS, pois é seguro e é cidade apresentada por um ícone de cadeado verde na barra de endereço do navegador. Selecionar www em seu URL é opcional. Algumas pessoas ignoraram, enquanto algumas pessoas o mantêm, é totalmente com você. Não criará qualquer diferença no funcionamento do seu site. É só por causa da sua apresentação. Pode ter um alto pessoalmente preferem URL sem www. Em seguida, selecione o nome de domínio na lista de domínios. Tenha uma etiqueta na sua conta de hospedagem. Basta dar de lado um título e um subtítulo. Eu não penso muito, não se incomode. Ele pode ser facilmente alterado depois também. Em seguida, atribua um nome de usuário que você se lembra e uma senha que ninguém além de você pode lembrar ou adivinhar, porque é a chave do seu ativo. Se ele é hackeado por alguém facilmente e você estará em apuros. A forma como seu ID de e-mail e ignorar as configurações avançadas. Basta clicar em instalar agora e esperar por alguns minutos. Respire fundo. Relaxe. Ok, então agora WordPress está instalado em seu domínio, e aqui está o URL de login. Você pode marcar este URL como ele pode ser usado para fazer login na área de administração do seu site. Bem, esta não é a única maneira que temos outra maneira de fazer login na área de administração do seu site. Geralmente, para todos os sites Wordpress, o URL de login é www dot seu domínio.com barra WP traço admin e pressione Enter. Aqui, você será solicitado para as credenciais de login. Você pode usar seu ID de e-mail ou nome de usuário e digitar a senha, verificar a captura e prosseguir com o login. Eles vão soldar quando você está na área de administração WordPress, e eu estou muito feliz em tê-lo aqui. Vamos dar uma olhada no site da vista de visitantes e voltar para o painel. Então este é o lugar onde você pode facilmente editar seu site e controlar como ele parece, o que ele mostra, e gerar um negócio de milhões e bilhões construindo este site valioso. Espero que você esteja desfrutando desta viagem emocionante e continuaremos no próximo vídeo. 27. Configurações no WordPress comuns: Prefiro sempre iniciar o processo de criação do site com a atividade de limpeza. Com a limpeza, quero dizer que, vamos primeiro remover todos os plugins desnecessários e equipes que estão pré-instalados em nossa configuração WordPress. Quais são esses temas e plug-ins? Esqueci-me de te contar? Não, eu me lembro disso. Eu tenho que explicar esses conceitos e vamos discutir o mesmo um pouco à frente neste curso. Para o bem desta lição, vamos passar o mouse sobre a opção plugins e clique em Instalar plugins. Você encontrará uma lista de plug-ins pré-instalados. Basta selecionar os plugins clicando assim. E aqui na parte superior e também na parte inferior, clique na lista suspensa e selecione, desative e clique em Aplicar. No WordPress sempre que você tem que instalar ou desinstalar um plugin, você tem que ativar ou desativar o plugin. Primeiro. Você pode fazer este processo para cada plugin individualmente, ou você pode selecionar todos os plugins e executar uma ação em massa. By the way, ações em massa realmente economizam muito tempo. Assim, os plugins indesejados foram desativados e agora é hora de desinstalá-los. Siga o mesmo processo. Selecione os plugins que estou selecionando todos juntos desta vez. Clique no menu suspenso Ações em Massa e selecione a opção Excluir. Clique em Aplicar. Foi embora. Todos os plugins indesejados agora são excluídos e nosso diretório de plugins está totalmente limpo. Em seguida, vamos seguir o mesmo processo para as equipes, mas há uma reviravolta aqui. Não é possível excluir todas as equipes presentes em nossa biblioteca. Exigimos que pelo menos uma equipe esteja ativa. Então vamos manter a equipe ativa e remover os indesejados de nossa conta. Isso teremos que fazer até uma equipe em um hall de tempo que acima da imagem do tema e clique em Gerenciar no canto inferior direito, localizar esta opção de exclusão, clique sobre isso, e sua equipe seria excluído. Além disso, observe que uma equipe ativa não pode ser excluída assim. Se você deseja excluir e equipe ativa primeiro instalar um tema diferente ativado, e então você pode excluir essa equipe. O mesmo processo que discutimos agora. Vamos, vá em frente e apague todas essas equipes indesejadas, um por um. Vamos também limpar as páginas de exemplo pré-existentes. Passe o mouse sobre o menu de páginas e clique em todas as páginas, selecione todas essas páginas preexistentes e siga o mesmo processo para excluí-las. Agora faça o mesmo com pré-existente, post. Outra coisa, clique na opção inicial do painel e você encontrará opções de tela. Mas aqui no canto superior direito, isso às vezes não é visível para um usuário, mas você pode encontrar algumas configurações aqui também. E, de fato, algumas configurações importantes. Portanto, para gerenciar a página inicial do painel, você pode selecionar quais caixas de informações deseja ver e qual altura. Dessa forma, você também pode limpar a página inicial do painel. Também sinta-se livre para explorar as opções de tela para outras opções de menu no WordPress. Hooray, nosso site é agora muito limpo e limpo. Agora vamos fazer algumas configurações básicas do WordPress, mouse sobre o menu de configurações e selecione comprimentos da Birmânia. Por padrão, a opção selecionada não é necessária para nós. Então, fora das tantas opções de trabalho, temos que selecionar a opção de nome do post e clique em Salvar. By the way, o que é um permalink? Um permalink é basicamente o URL das páginas da web. E com essa configuração atualizada, agora podemos tornar o URL mais relevante e fácil de entender em vez da estrutura complicada anterior. É uma configuração muito importante e no caso de você perder no início, então também não há problemas. Você também pode fazer isso mais tarde, mas nunca se esqueça de atualizar essa configuração nunca. Eu sempre prefiro iniciar minhas configurações Wordpress apenas para isso. próxima configuração comum é atualizar o título do site e slogan no caso de você não tê-lo mencionado no momento da instalação do WordPress, ou se você deseja alterá-lo. O título e o slogan são geralmente visíveis aqui na guia. Selecione a opção geral em configurações e atualize as informações. Você também precisa atualizar a hora para mostrar a hora correta. Faça os visitantes. Se você deseja alterar o endereço de e-mail, você pode atualizá-lo aqui no endereço de e-mail do administrador. Você receberá um e-mail de verificação para confirmar as alterações para o endereço de e-mail. Uma vez feito, clique em salvar as alterações aqui na parte inferior para atualizar as configurações. Em seguida, você pode personalizar a exibição visual do painel WordPress passando o mouse sobre a opção de usuários e selecionando a opção de perfil. Aqui você pode alterar as cores, alterar a exibição e o nome do autor atribuído a uma imagem de perfil, e atualizar a senha de login do site. Uma vez feito, clique em Atualizar perfil para salvar. Em seguida, você pode ir para a opção de leitura aqui e certifique-se de que a opção de mecanismos de busca desencorajar está desmarcada. É importante desmarcar isso porque ele pode impedir que os motores de busca rastreiem o site e seu site não estará disponível na pesquisa do Google. Estou finalmente, se você não vai ser compartilhado acesso de seu site para fins de edição, seja com seu co-fundador, parceiro de negócios, ou qualquer membro da equipe, você deve criar um novo usuário, indo para adicionar novo usuário aqui, você pode atribuir o nome de usuário, endereço de e-mail , nome, segundo, a senha de login, e atribuir uma função adequada e clique em adicionar novo usuário para compartilhar o acesso para editar o site. Existem 700 opções de regras disponíveis, como um administrativo terá acesso a todos os recursos do site. Um editor pode publicar e gerenciar postagens de vários autores. E o autor pode publicar e gerenciar seu próprio post. Um colaborador pode escrever a postagem, mas não poderá publicá-la. E um assinante só pode ler o conteúdo. Atribuir as regras corretas é importante porque um site é seu ativo e você nunca deve assumir qualquer risco em termos de segurança. Nunca compartilhe os detalhes de login do super administrador com desigual. Tudo bem, uma última coisa aqui é gerenciar as atualizações. Você receberá atualizações sobre temas e plug-ins do WordPress regularmente. Certifique-se de atualizar todos eles para segurança e desempenho do site. Embora estas sejam as configurações comuns que atualizamos no início, eu recomendarei que você explore todas as opções disponíveis aqui na área de administração do WordPress para se familiarizar com todo o monte de opções, algumas das quais será usado nos próximos passos. É isso. Acabamos com as configurações mais comuns para o WordPress e estamos prontos para seguir em frente. Continuaremos no próximo vídeo. 28. Temas para WordPress: Agora é hora de começar a personalizar o site. Você criará um site para você ou para o seu cliente. Vamos começar com a instalação do tema de nossa escolha. Vamos passar o mouse sobre o menu de aparência e clique na opção Tema. Atualmente que a equipe 2021 está instalado e é o tema padrão WordPress. By the way, o que faz um tema WordPress? Uma equipe WordPress é uma ferramenta para mudar o layout e design do site. Os temas personalizam a aparência do site, incluindo o layout, tipografia, cor e outros elementos de design. Um tema WordPress age como uma estrutura arquitetônica para o seu site. Ele fornece a funcionalidade para editar diferentes partes de uma página da Web, cabeçalho lago, conteúdo principal ou área do corpo, rodapé, widgets, locais de menu e muito mais. Escolher o tema WordPress certo é muito importante porque estabelece as bases do design do site. Então, o que acontece quando você muda uma equipe depois criar n número de páginas e publicar conteúdo? Bem, mudar a equipe do WordPress não mudará o conteúdo. Páginas, usuários ou outras informações armazenadas no banco de dados, mas a equipe muda como todas essas informações são exibidas para os visitantes do site. Se fizermos alterações na equipe depois de colocar conteúdo, então as chances são de que o design será alterado como para a equipe, e v pode acabar fazendo n número de revisões, reorganizando o design do site. Portanto, tenha certeza, não começar na seleção da equipe certa para o site. A equipe que você selecionar deve carregar rapidamente com tribunais otimizados. Tem opções de design poderosas, como gerenciar os layouts, cabeçalho e rodapé opções de estilo de suporte tipografia e cores para diferentes elementos. Seo otimizado e responsivo para trabalhar bem com todos os dispositivos. Há mais uma vez, milhares de temas gratuitos e pagos para escolher. Mas com base na minha experiência, eu selecionei dois a três temas que eu recomendo que você use em seu site de negócios, site pessoal, site de e-commerce, ou, de fato, qualquer tipo de site que você deseja fazer. O primeiro é Astra, o outro é o oceano WP, e o último é a equipe Hello. Astra e Ocean WP são temas premium. Isso significa que eles têm uma versão gratuita e eles também têm os complementos pagos para melhorar a funcionalidade da equipe. Por outro lado, a equipe Halo é livre, mas é uma equipe de baunilha simples e destina-se a ser usado com a versão Pro do Elementor para fazer sentido. Agora, obviamente, você pode começar com a versão gratuita das equipes. Eu vou recomendar que você use Astra sobre oceano WP como é o tema WordPress mais leve. E funciona absolutamente bem com todos os construtores de páginas populares. Então, eu vou em frente e clique no botão Adicionar novo. Agora, na barra de pesquisa, vou digitar Astra. Aqui estão os resultados da pesquisa. Selecione cuidadosamente o Tema Astra e clique em Instalar. Então a instalação está em andamento, e aqui está feito. Como eu tinha dito antes, é sempre um processo em dois passos. Então, depois que o tema é instalado, clique em ativar para fazer Astra, nosso tema de trabalho neste site. Certifique-se de ativar atualizações automáticas para o tema, pois há atualizações regulares fornecidas pelo criador e V deve atualizá-lo para desempenho e segurança. Caso haja alguma atualização pendente, verifique a opção de atualizações no painel. Como você está apenas começando, eu vou recomendar que você instale o Ocean WP bem como para testar as diferenças entre as duas equipes. E se você quiser comprar algum produto verbo do mercado Envato ou Envato Elements. Certifique-se de que é compatível com o Elementor. Construtor de páginas que estaremos usando para projetar nossas páginas web. Mais um conceito que eu gostaria de lhe dizer, sempre que criamos um site profissional, é sempre recomendado usar um tema infantil. Uma equipe filho é uma extensão do seu tema principal, e é usada por algumas razões estratégicas. É um tema que herda a funcionalidade e estilo de outra equipe chamada como a equipe pai. As equipes de canal recomendaram modificar as equipes existentes, mantendo seu design e código. Vamos supor que você colocou alguns códigos personalizados em seus arquivos de tema e há uma atualização. Quando você instala a atualização, seus códigos personalizados seriam redefinidos e você precisa inseri-los novamente. Então, para ficar longe de tal problema, sempre recomendamos usar uma equipe infantil. Criar um tema filho é muito fácil. Faça uma pesquisa do Google para a equipe Astra e clique neste link por Astra. Aqui, dê um nome a esta equipe filho e clique na opção Avançado. Você também pode carregar uma imagem em miniatura para representar um tema e clicar em Download. Agora você pode carregar esta equipe filho no WordPress e usá-lo junto com o pai como sub-tema, instalando e ativando. É isso. Sua equipe filho está ativada e lembre-se, não exclua o tema pai. É obrigatório ter a parentalidade instalada, a fim de fazer com que a equipe infantil trabalhe para o seu site. Isso foi tudo sobre os temas WordPress. Continuaremos na próxima lição e aprenderemos sobre os plugins WordPress. Vejo você lá. 29. Plugins do WordPress: E se eu pedir para usar um smartphone sem aplicativos móveis? A funcionalidade de um smartphone é aprimorada com aplicativos dedicados, como mensagens instantâneas, mídia social, aplicativo de player de música, e-mail ou aplicativo de gravação de vídeo e muito mais. Sem laboratórios tão especiais, um smartphone não é de uso especial. Da mesma forma, a fim de melhorar a funcionalidade e os recursos de um site, eles usam plugins. No geral, conecte dentro da principal fonte de funcionalidade especial para o nosso site WordPress. E há uma enorme coleção de plug-ins para cada tarefa no WordPress. Como se você tivesse plug-ins de construtor de páginas para projetar uma página da Web usando a técnica de arrastar e soltar. Você tem plugins de personalização de cabeçalho e rodapé. Você tem plugins SEO, plugins de otimização de imagem, plug-ins de gerenciamento de cache e lotes, muito e muito mais plug-ins para cada função especial. Você também pode fazer uma pesquisa do Google para os plug-ins mais recomendados para ter em um site WordPress e até mesmo comparar os diferentes plugins antes de instalá-los. Agora, embora existam tantos plugins disponíveis, mas devemos usá-los de forma inteligente, recomenda-se usar o menor número de plugins para manter o site leve, limpo, rápido e livre de bugs. E sempre certifique-se de instalar os plugins de desenvolvedores autorizados para se manter seguro contra erros e erros indesejados. No momento das configurações comuns do WordPress, tínhamos removido todos os plugins pré-instalados, e agora é hora de discutir os plug-ins mais importantes que vamos usar em nosso processo de criação do site. Vamos dar uma olhada neles um por um. O primeiro e o mais importante plugin que temos que usar é um plugin Page Builder. Um construtor de páginas é um plugin que nos ajuda a projetar uma página web sem a necessidade de códigos. Ele transmite funcionalidade de arrastar e soltar para a edição do site a partir do front-end. Isso nos ajuda a nos concentrar inteiramente no conteúdo e design do site sem ter que nos preocupar com a codificação. Ele ajuda não codificadores como você e eu criar um site bonito e que para ingerir nenhum tempo. Vamos obter um pouco de clareza por parte das citações. Usar um construtor de páginas não significa que seu site não tem cotações. Ele tem citações, mas usando construtores de página, via não necessária para escrever esses códigos, temos que apenas projetar as páginas da web e construtor de páginas irá criar automaticamente códigos para nós. No back-end. Estes construtores de paz revolucionaram o desenvolvimento web nos últimos anos. Há tantos plug-ins Page Builder agora disponíveis para WordPress como Elementor, Beaver Builder, Devi, construtor de oxigênio, breezy, Visual Composer. Mas eles usarão o melhor deles. De acordo com a minha experiência, Elementor toneladas até ser o plugin Page Builder mais eficaz para WordPress. Agora mesmo. É o construtor de páginas mais avançado com recursos e funcionalidades excepcionais. Os tribunais no back-end também são limpos e ajudam no carregamento mais rápido do site. E há muitos modelos disponíveis para o Elementor para acelerar o processo de criação do site. Vamos ver o processo para instalar um plugin mouse sobre o menu plugins e clique em Adicionar opção plug-in. Agora digite elemento ou na barra de pesquisa, e você vai ter que também é aqui em baixo. Selecione o plug-in oficial do Elementor e clique em Instalar. Ao instalar um novo plugin, certifique-se de instalar o plugin oficial, pois haverá tantos plugins diferentes disponíveis com nomes e extensões semelhantes. Além disso, instalar um plugin e WordPress é um processo de duas etapas. Agora temos instalar elementor e fim de semana ativar o plugin clicando neste botão. Mas trigo, eu tenho mais um plugin para instalar. Este é um plugin premium e eu tenho tomado a assinatura deste por um ano. É o Elementor Pro, e você poderá baixá-lo do site da Elementor depois de comprar a assinatura. Bem, eu estou usando o Elementor Pro porque ele melhora a funcionalidade e as características do elemento livre ou para um lote inteiro extinto. Você obtém muitos recursos, como o construtor de pop-up, o construtor de equipe, cerca de 13 assistentes premium adicionais para usar ao projetar as páginas da web. É um plugin muito poderoso. Na verdade, uma assinatura paga muito poderosa do elemento gratuito do, e eu recomendo que você o use se você quiser criar sites profissionais para você ou seus clientes. Agora, desde que eu baixei o plug-in Elementor do elemento ou site e eu tenho que enviá-lo para o meu WordPress. Vou clicar em Adicionar Novo, e clicar no upload. Uma vez que ele é carregado e instalado, agora podemos ativar ambos os plugins juntos. Passe o mouse sobre o menu plugins, clique em Instalar plug-ins. Aqui está a lista de plugins instalados. Tudo bem, então estamos tendo apenas dois plug-ins deste lado. Deixe-me mostrar-lhe outro site que tem mais plug-ins para entender melhor este processo. Os plugins que estão instalados, mas ainda não ativados, não têm esta cor de sobreposição e borda azul. Considerando que os plugins que foram instalados e ativados terão a sobreposição e a borda azul. Precisamos selecionar os plug-ins que estão instalados, mas não são ativados. Então, aqui fizemos a seleção e agora clique em Ações em Massa, drop-down, selecione a opção Ativar e clique em Aplicar. É isso. Temos vários plug-ins arqueados e isso economizou nosso tempo. Eu recomendaria que você inicie o processo de desenvolvimento apenas com os plugins essenciais e sempre certifique-se de usar o menor número de plugins no site. Estaremos instalando os outros ligandos quando precisarmos deles um por um em nossa jornada de criação do site. Mas espero que você esteja claro com o processo de instalação do plug-in. Assim como você recebe atualizações para o laboratório móvel. Da mesma forma, você estará recebendo atualizações para plug-ins também. Wordpress lado plugin agora auto atualizado, mas continue verificando se algum são betas reparando indo indo para a opção Atualizações no painel. Se você estiver usando alguns plugins premium, certifique-se de que as licenças estão ativas para receber as atualizações. E mais uma coisa, deixe-me desativar o plugin Elementor Pro por enquanto, porque é um pago. E eu quero que você comece com o básico primeiro, que é usar a versão gratuita do Elementor. É isso. Para esta lição, continuaremos no próximo vídeo. 30. Como criar a primeira página web: Agora, vamos começar a criar o site a partir do zero e vamos criar a primeira página da web, pairado sobre a opção páginas e clique em Adicionar nova página. Você pode se livrar desse pop-up clicando em qualquer lugar no espaço aberto. Uma coisa importante que eu gostaria de dizer-lhe é iniciar o processo de adicionar páginas e post é quase o mesmo. Então, se você quiser criar uma postagem de blog, você terá que simplesmente selecionar a opção Adicionar Post a partir daqui. Mas o resto do processo será visto como ler uma página web. Agora, vamos ver as configurações que obtemos através da criação de página da Web. Aqui na parte superior, você tem a opção de fornecer título para a página como Home About Us produtos, serviços, condutores, política de privacidade. Este título é importante para que os usuários reconheçam as informações do rótulo nesta página da Web. Como estamos apenas começando com um site, vamos criar a página web mais importante ou a página padrão que chamamos como a página inicial no título, deixe-me digitar em casa. Próximo. À direita, você encontrará várias configurações e opções. Algumas configurações e opções são padrão do WordPress, e algumas configurações são adicionadas com base na equipe ou alguns plugins que estamos usando no site. E deixe-me dizer-lhe que estamos usando como tema thrity neste curso. Se eu minimizar todas as categorias, então você terá uma aparência clara de todas as opções disponíveis. Assim, podemos gerenciar o status e a visibilidade aqui. Mas mulling destaque emergir atributos de página de discussão e configurações de equipe. Para esta página. Vamos ver as opções um por um. A opção de status e visibilidade permite ocultar a página ou praia trancada com uma senha. Se você deseja mostrar-lhe a publicação de uma página ou de um post, você pode atribuir a data e hora e a página ou publicação será automaticamente publicada dentro do cronograma. Em seguida, sob as configurações de permalink, você pode gerenciar o slug do URL Hall, certo? Então, o que é uma lesma? Um slug é geralmente o título da página ou postagem que é otimizado para uma melhor compreensão do visitante. É a extensão que fica satisfeita após o nome de domínio na URL. E se você deseja fazer alguma alteração no slug, você pode editá-lo aqui a partir das configurações de permalink. Não se confunda com as configurações de permalink anteriores que eu lhe disse. Este permalink sentado aqui para esta página é editar a estrutura do URL para esta página específica apenas. Tudo bem, a próxima opção é adicionar uma imagem em destaque. Ele é muito útil para uma postagem de blog e age como uma imagem em miniatura para a postagem na página de arquivo, e também é exibido no topo da página de postagem única. Em seguida, você pode permitir ou não permitir os comentários na opção de discussão. Em seguida, você pode usar algum layout ou modelo para a página usando as opções de atributo de página. Aqui, você também pode atribuir a categoria pai a uma página que é útil na otimização da estrutura de URL. É um recurso muito útil, comumente usado em sites de comércio eletrônico para mostrar claramente essa categoria e subcategoria nos próprios URLs. Por último, você tem as configurações da equipe para a página. Aqui em Astra, você tem as opções para mostrar ou ocultar a barra lateral da página. É apenas o layout de conteúdo, ativar ou desativar o cabeçalho, título da página, imagem em destaque e rodapé para a página ou post. As outras opções de tema como cabeçalho transparente deve ser um distinto do personalizador. Então podemos pular aqui. Uma vez feito com as configurações, você pode clicar em Publicar, e novamente clicar em Publicar, e é isso, as páginas criadas. Se pretender desactivar esta verificação dupla para publicação, pode desmarcar esta opção aqui. Agora, para editar esta página, somos fornecidos com um editor de blocos padrão pelo WordPress. E este é o modo de edição para projetar uma página ou postagem. Mas vamos editar a página usando o Elementor, que é o construtor de páginas mais avançado do mundo. Criar páginas web usando o Elementor é uma tarefa muito emocionante e nós estaremos aprendendo sobre o básico de usar o Elementor na próxima lição. Vejo você lá. 31. Como configurar o Elementor para primeiro uso: Bem-vindo à primeira lição do Elementor, e vamos começar a jornada de criar páginas web impressionantes e website pixel-perfect sem qualquer codificação usando Elementor, vamos começar com a configuração do elemento ou 4 primeiro EUA e deixar vemos algumas configurações comuns. A primeira coisa que você tem a fazer com o Elementor é clicar nas configurações do Elementor a partir daqui e certifique-se desmarcar que os alertas padrão desativados e telefones para ativar as configurações do telefone corante usando o Elementor. Elementor é completo em si mesmo para gerenciar várias configurações. E assim não queremos usar o índice Theme Colors Phi. Estamos habilitando o elemento ou configurações padrão. Aqui. Estaremos configurando os valores globais para cores, tipografia e espaçamento. E isso será aplicável para todos os elementos e páginas do site. Isso significa que estaremos configurando as cores do guia de marca. Estou dobras aqui na Elementor para tornar o processo de desenvolvimento de sites fácil e consistente como parte do nosso design. Agora, a fim de editar a página web, vamos clicar em editar e voltar para a opção Configurações novamente. Aqui, clique em Editar com Elementor. Você será redirecionado para esta tela de edição e para a interface principal do sistema que temos que entender para criar um site incrível. Então esta é a interface de edição para Elementor, e devo dizer que é muito fácil e fácil de usar. Você tem todas as opções de edição aqui à esquerda pagas e a tela de edição à direita. Há um botão para ocultar o painel de edição e isso abre a página de visualização. O modo de visualização, você não será capaz de editar a página da web, pois você só pode visualizá-la. Para voltar ao painel de edição. Clique nesta seta novamente, e você receberá as opções de edição de volta. Vamos começar a configuração com as opções disponíveis no topo. Ao clicar no ícone de hambúrguer, você receberá opções para Configurações do Site, construtor de equipe e gerenciar preferências do usuário. Vamos vê-los um por um. Vamos clicar em Configurações do site primeiro. Aqui, você tem que mencionar as cores que você finalizou no guia de branding. Clique na cor primária aqui e digite o código hexadecimal da sua cor. Isso agora é salvo na paleta de cores. Você também pode renomear a categoria, se necessário. Da mesma forma, atualize o texto secundário e a cor de destaque com as cores da marca que finalizamos no guia de branding. Mesmo que deseje adicionar mais cores à paleta, você pode adicioná-las, renomeá-las e também excluí-las. E se você quiser remover uma cor ou limpar a cor, clique nesta opção clara aqui, ela irá reverter para vazio. Graduação. O válido colorido é o primeiro e o mais importante passo de usar eliminar ou porque economiza muito tempo, escolhendo as cores padrão com apenas um único clique. Agora volte para o menu anterior clicando aqui. O próximo é configurar os telefones globais. Aqui, você vai atribuir as configurações de tipografia padrão para todos os diferentes tipos de telefones, como cabeçalho da família, cabeçalho secundário, XT e XT e telefones, atribuir as configurações globais do telefone salva o estilo no estilo de fonte paleta aqui. E você será capaz de atribuir facilmente esse estilo com um único clique. Clicar no ícone de lápis abrirá as configurações de topografia. A primeira opção é selecionar a família do telefone. Você fará com que os telefones do Google selecionem neste menu suspenso. Faça uma seleção da família Ford de acordo com o guia de marca. Próxima opção é selecionar o tamanho do telefone. Você pode rolar essa roda manualmente ou simplesmente inserir o valor. Existem quatro unidades de medida, mas vamos com pixels. Há outra coisa a notar aqui. Se eu excluir o valor no tamanho do telefone que ele será restaurado para o valor padrão. Você deve estar se perguntando que se não houver nenhum valor na caixa, ele precisa dele um 0, mas não é assim no elemento ou será 0 somente se você mencionou 0 aqui, ou então se você mantê-lo vazio, ele será o valor padrão. Este conceito em mente, porque ele vai ajudá-lo muito no curso. Nossa cabeça em seguida é o peso. Isso fará com que seu texto pareça leve ou negrito. Em seguida, você pode tentar transformar configurações para tornar o texto em maiúsculas, minúsculas ou maiúsculas. Em seguida, você pode tornar seu texto em itálico a partir da opção de estilo. Na decoração, você pode inserir manchetes e quais linhas para os textos e até mesmo linhas riscados que também podemos ajustar a altura da linha. E vamos dizer para o TextContent, preste atenção às unidades de medida e temos que usar a unidade de pixels para cada medida. Quero perguntar-te uma coisa. Você percebe este pequeno ícone de tela depois de algumas configurações? Bem, este ícone representa que você pode fazer ajuste personalizado nesta opção de configuração para diferentes dispositivos. Como se você deseja atribuir um valor diferente do tamanho do telefone para o telefone celular, você pode clicar neste ícone, selecionar Móvel, e atribuir o valor diferente que será especificamente para o dispositivo móvel e o mesmo que você pode fazer para um tablet. Aqui, o design do site ajuda muito, porque já tínhamos finalizado com o tamanho do telefone para cada tipo de dispositivo e não precisamos gastar tempo experimentando diferentes Valores na fase de desenvolvimento. Outra coisa, se você tiver que redefinir as configurações tipográficas completas para o padrão, você pode clicar neste botão padrão aqui. E uma vez que você está feito que suas configurações de Tipografia clique neste ícone de lápis novamente, e ele irá destacar. Desta forma, você pode salvar os telefones globais como diariamente. Vamos voltar agora. Agora clique na tipografia. Aqui você pode configurar a tipografia para tipos de textos específicos como Título 1, Título 2, até o título 6, os alimentos parágrafo e um link dobras. Essas configurações são aplicáveis quando você coloca uma nova caixa de texto ou caixa de cabeçalho ou cria um hiperlink no campus de edição. Definir os valores aqui pode economizar tempo e ajustar a topografia uma e outra vez. Então agora você será capaz de fazer uso das cores globais e telefones globais que acabamos de dizer no menu anterior. E isso economizará muito tempo na fase de desenvolvimento. By the way, uma vez que você é feito com as configurações, Clicando no botão de atualização aqui na parte inferior para salvar as alterações. É um bom hábito salvar o trabalho pelo menos a cada cinco minutos. As próximas configurações estão relacionadas ao botão padrão, imagens e campos de formulário, mas vamos ver para eles na lição widget primeiro e depois, se precisarmos, podemos voltar aqui para atribuir os valores padrão. Abaixo disso, temos configurações relacionadas à identidade do site, plano de fundo, layout e caixa de luz. Vamos configurar a identidade do site primeiro. Você também pode atualizar o nome e a descrição do site iguais ao título e slogan do site a partir daqui. Em seguida, você pode carregar o logotipo do site. Certifique-se de usar as dimensões corretas para que o logotipo apareça impactante no cabeçalho. Em seguida, você pode fazer o upload do fairway pode encomendar ícone do site para exibir aqui na guia. Um ícone fav ou citocinina deve ser sempre projetado na proporção do que é para um, preferência 52 pixels por 500 pixels. Agora, aqui está a configuração de fundo da página. Você pode selecionar entre as opções clássicas de ingredientes e usar alguma imagem colorida ou um gradiente para o plano de fundo da página. Então, se você quiser criar um site de cor escura, você pode selecionar cor preta como o plano de fundo da página. Atribuir uma cor de página aqui aplicará a cor a todas as páginas do site. Se você deseja personalizar o plano de fundo para alguma página específica, você será capaz de fazê-lo a partir do ícone Configurações aqui na edição de página individual. Tudo bem, agora vamos voltar e selecionar a opção de layout. Aqui você pode dar uma olhada no espaçamento, largura e layout. Essas configurações padrão funcionam melhor e não há necessidade de fazer nenhuma alteração aqui. Apenas mudou. Terceiro, layout de página padrão para Elementor largura total como não estamos usando as configurações de tema. É isso. Em seguida, são as configurações padrão da caixa de luz. A propósito, o que é a caixa de luz? Um pop-up de caixa de luz é uma sobreposição de janela que aparece no topo de uma página da Web como esta. Quando uma caixa de luz pop-up aparece, o plano de fundo é oferecido, esmaecido e desativado, o que significa que os visitantes do site não podem interagir com o outro conteúdo do site. Isso chama a atenção para a própria caixa de luz. Então, você poderá ajustar nossas configurações padrão para as lâmpadas dos displays, mas não é tão importante agora. Vamos ver se as alterações que fizemos, clique em Atualizar, e agora vamos voltar. Você pode ignorar o CSS personalizado. Não é para os aposentos como você e eu. E se você conhece revestimento, então você pode definitivamente fazer uso desse recurso assinando o Elementor Pro. Estou finalmente, você pode clicar na opção de configurações adicionais para ir para as configurações de plug-in Elementor na área de administração em uma nova guia. Aqui, nós já fizemos a configuração no início da lição na dinastia apenas necessária configuração que precisávamos fazer. E se você estiver inscrito no Elementor Pro, você pode carregar os telefones personalizados e ícones personalizados a partir dessas opções disponíveis. Vamos pular essa opção de construtor de equipe aqui, como é de liberal no Elementor Pro. E veremos isso mais tarde no curso. Vamos ver as preferências do usuário. Aqui, você terá a opção de alterar o elemento ou exibição. Atualmente, estamos no modo de luz e você pode mudar para a placa escura também. Eu sei que alguns de vocês vão definitivamente iluminar o modo escuro em comparação com o modo de luz. Mas deixe-me continuar no modo de luz apenas neste curso. Você pode ajustar manualmente a largura do remo também assim. E se você quiser restaurá-lo padrão, você pode inserir cerca de 300 pixels em. Você pode ajustar o peso de acordo com sua preferência. Então terminamos com o setor do Elementor para o primeiro uso, e continuaremos aprendendo os conceitos básicos do Elementor na próxima lição. Vejo você lá. 32. Noções básicas de usar Elementor: O painel de edição do Elementor é muito fácil de usar. Ele contém uma lista de widgets que são categorizados nas visitas básicas e genitais. Se você estiver usando o Elementor Pro, você contratou categorias adicionais, como os widgets Pro e do site. Aprenderemos sobre o uso de todos os desertos nas próximas lições. Mas, por enquanto, deixe-me dizer-lhe como usar a tela em branco nesta lição. Primeiro de tudo, a linha superior que é o cabeçalho do site e a última linha que é o peso total do site comprado. O cabeçalho e o rodapé não podem ser editados ou criados a partir deste Canvas de edição. As configurações de Cabeçalho e Rodapé podem ser acessadas a partir do personalizador se você estiver usando as configurações de equipe no elemento, nosso construtor de equipe, se você estiver usando o Elementor blue. Então esqueça o cabeçalho e rodapé enquanto você está na página. Modo de edição. Aqui, concentre-se apenas na área de conteúdo principal da página web. Você pode inserir uma seção clicando neste ícone de adição e selecionando a estrutura com um número diferente de colunas. Por padrão, uma seção é sempre inserida com uma única coluna. Você pode começar com uma estrutura simples, pois pode ser personalizado mais tarde como por sua exigência. Aqui, a linha de borda azul representa um limite de seção ou uma borda de seção, enquanto a linha pontilhada cinza representa uma coluna. Você pode adicionar mais seções acima da seção clicando no ícone de adição aqui ou na parte inferior. Se você quiser excluir a seção, clique lá, cancele, eu chego aqui. Agora, para editar as configurações desta seção, você precisa clicar com o botão direito do mouse nos pontos aqui e clicar na seção Editar. As opções de edição desta seção serão abertas no painel esquerdo. Se você der uma olhada na guia superior, você encontrará os três tipos de configurações. Layout de números dos corredores Número dois, seu estilo, e número três é avançado. Todas as configurações para seções, colunas e, de fato, todas as visitas terão os três tipos de configurações ou as três guias de configuração, tarde, estilo Leon e avançado. Sempre tenha isso em mente. Em seguida, se você tiver que voltar para a tela inicial do painel de edição, clique nesta grade. O Eigen. Saiba que meu pai está metido em algum ambiente. Se você clicar neste eigen grade, você vai voltar para a tela inicial do painel de edição D como este. Vamos agora ver quais outras opções eu tenho rotulado por, clicando com o botão direito sobre os pontos aqui. Bem, você pode criar uma duplicata desta seção. Em seguida, você pode copiar esta seção e colá-la em algum outro local, cima ou para baixo em qualquer lugar da página. Em seguida, você pode usar a opção colar estilo. É como se você quiser copiar as configurações de uma seção e aplicá-la a alguma outra seção, você pode copiar e colar o estado. É muito útil às vezes. E se você quiser redefinir uma configuração de seção para padrão, clique em Estado padrão. Agora, a próxima opção é muito importante. Você pode salvar a seção como um modelo. E sabemos que podemos reutilizar esses modelos em diferentes páginas e sites diferentes. Então, basta clicar em Salvar modelo, Dê-lhe um nome, e clique em Salvar. By the way, esta é a biblioteca de elementos ou modelos. Aqui você vai encontrar uma enorme coleção de blocos pré-projetados, páginas e uma lista de alertas que você pode ter salvo. Se você deseja inserir um modelo neste local, você pode simplesmente clicar em Inserir, e aqui está. O modelo é inserido. Muito fácil. Se você quiser usar blocos e modelos Elementor, você precisa se registrar em elementos ímpares e criar uma conta gratuita. Então você será capaz de inserir os modelos gratuitos. E se você tiver a assinatura do Elementor Pro, poderá inserir os modelos Pro também. Agora, se você deseja exportar nosso modelo, você pode clicar nos três pontos e clicar em Exportar. Esse modelo será explorado no formato JSON e você pode carregá-lo em um site clicando nesta opção Importar e carregando o arquivo. Se você quiser acessar esses modelos, você pode clicar neste ícone de pasta aqui. Em seguida, novamente, clique com o botão direito do mouse nos pontos e veja o que mais permanece aqui. Certo, o próximo é o Navigator. E aqui você pode gerenciar a ordem das seções e colunas, assim como gerenciamos as letras e a ferramenta de design gráfico. Também é útil para alterar a ordem das seções e você também pode renomeá-la clicando duas vezes. Agora, a última coisa que temos que aprender sobre o elemento ou painel de edição é esta barra inferior. Aqui, você vai encontrar a opção de configuração da página e você pode alterar o título, status e imagem em destaque para a postagem do blog. Estas são as mesmas configurações que fizemos ao criar a página. Se você clicar na opção de mancha aqui, você vai descobrir que você pode alterar o tipo de fundo para esta página específica. Ele tem as mesmas opções como é de cor sólida ou uma imagem, ou uma cor gradiente. Se você deseja atribuir alguma cor de pêssego, você pode selecionar uma indo para estilizar e selecionar o tipo de fundo como ingrediente clássico e selecionar a cor. Por favor, note que esta cor de pêssego só é aplicável a esta página específica. Em seguida, você pode habilitar o navegador a partir daqui também. Em seguida, a próxima é a opção de história. Aqui você vai encontrar um registro de atividades e você pode facilmente reverter usando as ações e revisões. A opção de ações terá uma lista de atividades na sessão atual antes da última atualização. E a opção de revisões terá cópias de salvamento automático de algumas das versões mais antigas também antes de atualizar. Próxima opção é otimizar o site para diferentes dispositivos. É muito importante porque nós definitivamente queremos criar um site responsivo que funcione muito bem em todos os dispositivos como computadores, telefones celulares e tablets. Você pode facilmente selecionar a visualização da área de trabalho, visualização do tablet e a visualização móvel a partir daqui, e otimizou seu site de acordo. Em seguida, o IA gun é usado para ver a visualização da página e o botão de atualização é usado para salvar e publicar a página da Web. Todas as alterações que você faz no site. Ele é publicado imediatamente assim que você clicar neste botão Atualizar. Além disso, eu vou sugerir que você faça um hábito para salvar seu trabalho a cada cinco minutos. Perto do botão de atualização, você encontrará uma seta com mais algumas opções. Em vez de publicar a página globalmente, você pode salvá-la como um rascunho e atualizar assim que o design for concluído. E você também tem uma opção para salvar a página como um modelo. Agora, se você salvar um modelo a partir desta opção, você será capaz de salvar toda a página que o Act é executado em um único modelo. Então, se você quiser salvar uma única seção, você pode salvar as configurações da seção como vimos anteriormente. E se você deseja salvar uma página completa, você pode fazê-lo daqui perto da opção de atualização. Ambos serão acessíveis no modelo como senhora. Agora lembre-se que você está no modo de edição aqui. E para ver a visualização, você pode ocultar o painel ou clicar na opção Exibir página. Desde vn usando WordPress, você sempre vai encontrar a barra preta na parte superior da página lá você tinha logado para o WordPress. Você também pode hidratar, mas isso é muito útil, pois você pode voltar para o painel passando o mouse sobre o título e clicando no painel. Ou você pode ir para as configurações do personalizador. Desde personalizar, você pode ver as atualizações pendentes, comentários, adicionar uma nova página, uma nova publicação, editar as configurações da página ou editar o design da página com o Elementor, você também pode redirecionar para editar os layouts personalizados como cabeçalho e rodapé daqui em si. E se você deseja sair do modo de edição do site, mouse sobre o nome de usuário e clique em logout. Esta barra preta é o atalho para muitas configurações e opções. Se você deseja sair pelo painel da área de administração, clique na opção Sair do painel. É isso. Então é assim que você pode acessar o Elementor e aprender mais sobre as configurações de seção e coluna no próximo vídeo. Vejo você lá. 33. Configurações de seção e coluna: Em seguida, usamos estão projetando ferramenta. Podemos facilmente criar um retângulo e colocar o conteúdo por um simples arrastar e soltar. Mas organizar as informações em tal estrutura em uma página web é um jogo totalmente diferente. Você precisa usar seções e colunas para gerenciar o layout da página. Então, o que faz esta seção e o que é uma coluna? Seção é a área da página onde você pode colocar colunas para apresentar as informações de forma organizada. E por coluna, queremos dizer um bloco vertical de conteúdo. Você pode exigir várias colunas na largura da página. Uma seção pode conter uma ou mais colunas e você pode ajustar o estruturado de acordo com o requisito de design. Vamos ver como gerenciar essas seções e colunas em uma página da Web. Sabemos como inserir uma nova seção. Clique no ícone de adição e selecione uma estrutura. Você pode selecionar uma estrutura simples e podemos, obviamente, personalizá-la mais tarde. Uma seção é representada pela linha de borda azul e coluna é representada por uma linha pontilhada cinza. Agora dentro como seção, há colunas para dividir esta seção em 23 ou qualquer número de peças que você precisa. Em uma seção, há obrigatoriamente pelo menos divertido coluna. Outro ponto importante a observar aqui é que as colunas só seriam adicionadas da esquerda para a direita. Isso significa colunas são usadas para organizar rejeições e forma horizontal. Se você deseja adicionar mais área em forma vertical, você terá que usar seções como ele funciona de cima para baixo. Vamos dar uma olhada nas configurações da seção. Basta passar o mouse sobre a parte superior do meio e clicar com o botão direito sobre os pontos. Agora podemos ver o painel de edição e esquerda com as configurações que têm as três guias principais, layout, estilo e avançado. Em Configurações de layout para uma seção, temos listas suspensas como estas. As principais configurações de rótulo, nossas configurações de layout e estrutura com um clique esquerdo na guia Layout e ele se expandirá. Vamos discutir as principais configurações que são úteis na edição de um site. O primeiro título é conteúdo sagacidade. Ele tem duas opções para selecionar, caixa e vetor completo. Por padrão, atualmente temos encaixotado selecionado e através fornecido uma escala para ajustar a largura manualmente como parte de um requisito. Você pode rolar a balança para a esquerda e para a direita e decidir o peso certo para sua seção. Além disso, você pode colocar o valor na caixa fornecida. Tenha em mente que estaremos seguindo o design que já criamos na ferramenta de design como Figma ou Adobe XD. E usaremos todas essas dimensões e valores aqui em Elementor. Esta é a fase de desenvolvimento e estaremos desenvolvendo a página de acordo com o design que já criamos em sua fase de design. O valor que você colocará aqui na dimensão está em pixels. Você tem que fazer alterações nas configurações de largura com um pouco de cuidado como se você tem a palavra menor, isso afetará a exibição nas telas e seu site vai acabar mostrando encolhido. E no caso de você desejar voltar ao valor padrão que estava disponível antes de ajustar manualmente a largura da seção, basta excluir o valor na caixa assim. Sabemos que excluir o valor não fará com que seja 0. Na verdade, ele irá restaurá-lo para o padrão. Além disso, você pode selecionar a opção de largura total para expandir a seção em toda a tela, independentemente da largura da tela. Em suma, você pode bloquear a largura do conteúdo, colocando algumas dimensões específicas ou então você pode permitir a expansão de tela cheia selecionando a opção de largura total. A próxima configuração útil é a altura. Usando esta opção, podemos ajustar a altura da seção, tornando-a mais alta para cobrir toda a tela, ou torná-la pequena, ou permitir que ela se ajuste com base na altura das colunas e widgets dentro da seção. Você também pode ajustar a altura da seção manualmente usando a opção de escala de altura mínima. Deixe-me dizer-lhe que a eleição altura adequada desempenha um papel muito importante no gerenciamento do espaço em branco e na criação de uma interface de usuário envolvente. Agora, a próxima configuração é a posição da coluna. Como sabemos que todas as seções têm colunas, por isso é possível ajustar o alinhamento das colunas para cima, meio ou inferior de acordo com o requisito de design. Além disso, há uma opção para esticar esta seção para torná-la ponta a ponta enquanto visualiza o site em uma tela mais ampla. Em seguida, vamos explorar as configurações sob esta guia bloco. Normalmente, as configurações relacionadas ao plano de fundo, sobreposição de fundo, borda, forma, divisor, tipografia e cores são listadas sob a guia de estilo para as colunas de seção e, de fato, para todos os widgets. Então vamos começar com as configurações de fundo. Podemos ajustar o plano de fundo para visualização normal e vista pairar. Na exibição normal, você pode selecionar o plano de fundo de quatro tipos diferentes, clássico, gradiente, vídeo e apresentação de slides. Vamos entender o clássico primeiro, você tem uma opção para escolher as cores como o fundo da seção. Então, clique na janela Cor e a paleta de cores será aberta no seletor de cores, você pode rolar essa roda e escolher o conjunto certo de cores para o seu projeto. Mas já fizemos esse passo salvando as opções globais de cores. Então, precisamos simplesmente clicar na opção de cor global aqui e escolher a cor como plano de fundo para esta seção. É por isso que eu disse anteriormente que quando você salvar a paleta de cores, você economizará muito tempo. Assim, desta forma, você pode definir uma cor sólida como o plano de fundo da seção. Agora, em vez de uma cor sólida, você também pode escolher uma imagem enquanto esta seção fundo paira sobre a caixa de imagem e você encontrará uma opção para Adicionar imagem. Clique nele, e o uploader de imagem será aberto, carregue a imagem do seu dispositivo e clique em adicionar. A imagem será adicionada ao fundo da seção. Adicionar uma imagem ao plano de fundo requer algumas decisões e ajustes. Vamos dar uma olhada no mesmo. Sempre tentou carregar uma imagem em suas dimensões que são necessárias. Significa edição e imagem de antemão para corresponder às dimensões da seção. Desta forma, você não enfrentará o problema em cortar ou aumentar a imagem em exibição. Se as dimensões não forem precisas, então, após o upload, elas surgirem, use as configurações rotuladas a seguir, você pode ajustar a posição da imagem para centralizar as opções de alinhamento, as opções alinhamento superior e a parte inferior opções de alinhamento. Há uma configuração muito legal e esse anexo você pode selecionar a partir da opção fixa ou a opção de rolagem. Se o tamanho da imagem for pequeno, você poderá selecionar essa opção de repetição para cobrir a seção com imagens repetidas. E, finalmente, você pode tentar ajustar o tamanho da imagem usando algumas configurações de tamanho neste que cobrir e conter opções são as mais úteis. Agora, em todas as configurações, há uma opção padrão. Então, no caso de você se perder nas várias configurações, basta selecionar padrão para voltar às configurações originais. O próximo tipo de fundo é gradiente. Um gradiente é uma fusão de duas cores e você pode misturar as duas cores para criar uma composição de cores incrível para a sua seção de volta para baixo, você precisa selecionar as duas cores agiu localização, ajustar esse tipo de mistura e ângulos para combinar sua exigência. O próximo tipo de fundo como vídeo, é uma mistura muito boa. Você só precisa inserir o link do seu vídeo do YouTube ou do Vimeo ou até mesmo dos seus vídeos auto-hospedados. E ele será adicionado ao fundo da seção. Para vender Foster Video, basta carregar o arquivo na Biblioteca de Mídia. Você pode ajustar as configurações de hora de início e hora de término e também ajustar as opções de reprodução em loop e reproduzir o vídeo no celular. O vídeo no leste móvel para ser tomado especial cuidado como as dimensões da tela são diferentes e o vídeo pode aumentar o zoom. Portanto, preste atenção às configurações de capacidade de resposta se você estiver inserindo um vídeo no fundo desta seção. Há também uma opção para fallback em segundo plano. Isso significa que você pode selecionar uma imagem como fallback de fundo. Porque em alguns casos, se o vídeo não for capaz de renderizar ou reproduzir, deve haver uma imagem de backup para mostrar em segundo plano. O último tipo de tipo de plano de fundo é uma apresentação de slides. Ele mostra as diferentes imagens em formato de apresentação de slides e que mantém aspecto deslizante que o tempo e a velocidade. Você mencionou. É um recurso muito comumente usado e você pode aplicá-lo facilmente usando o Elementor. Basta selecionar as várias imagens e selecionar a opção de loop com este botão, você pode fazer a apresentação de slides rápida ou lenta, ajustando a velocidade e milissegundos. Existem alguns efeitos de transição e você pode ajustar a velocidade de transição também. As opções de tamanho de fundo e posição de fundo também são úteis no caso de as dimensões da imagem serem diferentes das dimensões da seção. O efeito Ken Burns também é um recurso legal, pois obtém uma visão crescente ou decrescente da imagem. Estas são as opções de fundo para a visualização normal. Vamos ver algumas configurações para o efeito de pairar. Você pode aplicar dois tipos de plano de fundo e visão geral, clássico e gradiente. As configurações são as mesmas que aprendemos anteriormente. Apenas a visualização do plano de fundo aparecerá enquanto passa o mouse. Em seguida, vamos aprender o recurso de sobreposição de fundo. Você deve ter notado a sobreposição de cor sólida acima de uma imagem como esta. Você pode aplicar uma sobreposição na exibição normal, bem como na exibição de Harvard. Vamos aprendê-las um por um. Além das opções de edição padrão que aprendemos anteriormente, há uma opção para ajustar a opacidade em termos de fundo excessivamente. Ele varia de 0 a um, com 0 sendo o mínimo e um sendo o máximo. Você também pode aplicar os filtros CSS e diferentes modos de mistura como Marie ou habilidades de design. Experimente as configurações para opções de pairar, bem como elas são quase semelhantes. próxima configuração sob a guia de estilo está ajustando a borda. Novamente, ele tem a visão normal e toda a visão geral. Em Tipo de borda, você pode selecionar o tipo sólido, duplo, pontilhado, tracejado e ranhura das bordas. Depois de selecionar o tipo de borda, você terá uma opção para selecionar o peso da borda e direcionar. Agora, esta caixa contém quatro valores. Cima, direita, inferior e esquerda. Isso é seguido por uma caixa que liga todos eles juntos. Então, no caso de você desejar atribuir o mesmo valor para todas as quatro direções, primeiro, marque a caixa de ligação, ou se você deseja fornecer variáveis são valores diferentes. Primeiro, desmarque a caixa de vinculação e insira os valores nas caixas superior, direita, inferior e esquerda. Abaixo disso, você pode selecionar a cor da borda da mesma paleta colorida. Além disso, você pode usar a sombra de caixa e você também pode aplicar as configurações de borda para efeito de pairar. Próxima opção de edição são divisores de forma. Você pode aplicar o divisor nas partes superior e inferior da seção. Ele tem tantos tipos criativos e eu vou sugerir que você explore os diferentes tipos em ambas as partes superior e inferior da seção. Última opção é topografia, mas não vamos alterar as configurações aqui, pois vamos fazê-lo individualmente para cada conteúdo de texto que adicionamos. Agora, a próxima guia na guia Configurações é Avançado. É muito importante e muito crucial quando entender e praticar. E também deixe-me dizer-lhe que as configurações avançadas são quase as mesmas para cada coluna de seção e quase todos os widgets Elementor. Isso significa que se você é capaz de entender essas configurações avançadas uma vez que você pode aplicá-lo a todas as seções, colunas e widgets. Então, o que tudo isso inclui? Ele inclui o efeito de movimento de configurações avançadas. Então, atributos de configurações responsivas e CSS personalizado. Vamos começar com as configurações avançadas. A primeira opção é a margem. A margem para a seção pode ser ajustada para a parte superior e inferior esquerda e direita está desabilitada para as configurações da seção, pois é um distrito automaticamente baseado no vetor de conteúdo. Mas você terá todas as quatro direções, inferior, esquerda e direita para as colunas e widgets. Margem significa a espécie fora do limite desta secção. Deixe-me repetir. Margem significa o espaço fora do limite de uma seção, enquanto que na ligação, é o espaço dentro do limite de uma seção para cima, inferior, esquerda e direita. Margem clara significa espaço fora do limite da seção, e preenchimento significa espaço dentro do limite da seção. Você pode usar inteligentemente o botão de vinculação para vincular os valores juntos enquanto ajusta, ajustar os valores para cima, inferior, esquerda e direita é uma prática muito importante e você terá que usar este Senhor opcional. Portanto, familiarize-se com a vinculação dos valores e a vinculação dos valores e a ancoragem dos valores para cima, inferior, esquerda e direita. Então essa é uma opção para editar o índice Z ou índice para a seção. Ajuda-o a ajustar a ordem. Se outra seção se sobrepõe, então há opções para atribuir classes CSS ICSID, que são usados para algum propósito específico que podemos discutir no curso à frente. A seguir são os efeitos de movimento. Como o nome sugere, a configuração tem configurações de animação. Você terá acesso a este efeito de resfriamento se você se inscreveu no Elementor Pro ou então, você só pode usar a opção de animação de entrada na versão gratuita. Vá em frente e experimente isso, pois há tantos efeitos legais para usar carregando a seção que as configurações responsivas também são importantes. Você vai ajustar a posição da coluna em uma seção para celular e tablet. E você pode reorganizá-los de acordo com sua exigência. Além disso, você pode ocultar algumas seções ou colunas, especificamente para celular, tablet ou desktop. Este recurso é usado com bastante frequência porque você tem algumas seções que você precisa exibir apenas nos dispositivos desktop. E há algumas seções que você projetou especificamente para os dispositivos móveis. Então você pode ocultar as seções e você pode mostrar as seções. É muito útil usar. Portanto, estas são as configurações importantes para uma seção. E se você é capaz de entender o conceito ainda aqui, você será capaz de ajustar as configurações para todos, maioria de Aliyah que rejeita ao projetar a página web. Agora, vamos também entender as configurações para a coluna. Para abrir as configurações para uma coluna, Harvard a partir do canto de uma coluna e clique neste ícone de lápis. Ele também tem o mesmo estilo de layout e etapas avançadas nas configurações de layout. Você pode ajustar a largura da coluna em termos de porcentagem. É muito útil quando você tem várias colunas e você deseja atribuir o veredicto para as diferentes colunas dentro de uma seção. E configuração importante é ajustar o espaço de visita e ele está ancorado em pixels. Se você se lembrar, inserimos 20 pixels como o espaço padrão do assistente. Além disso, gostaria de chamar sua atenção aqui como a caixa de valor é MD e isso não significa que é 0, significa que é o valor padrão, que é 20 pixels. Se você deseja torná-lo 0, você pode simplesmente digitar 0 na caixa OT else, se você deseja atribuir qualquer valor de espaçamento específico, você pode digitar isso. Vá em frente e faça algumas experiências que o ajudarão a se tornar um bom aprendiz. A guia estilo e a guia Avançado têm opções semelhantes, assim como uma seção. Sinta-se livre para explorá-los também. Então é assim que você pode gerenciar a seção e colunas em uma página da Web. E vivant começar a aprender a aplicação de widgets Elementor a partir do próximo vídeo. Vejo você lá. 34. Aplicação de widgets básicos: Como eu tinha dito a vocês que estaremos desenvolvendo a página web sem qualquer codificação, simplesmente usando a técnica de arrastar e soltar. E chegamos ao estágio em que iremos aprendê-lo. Agora, nesta tela em branco, depois de inserir uma seção e coluna, precisamos arrastar os widgets para a coluna e usar os diferentes tipos de widgets, projetar a página web. É uma maneira muito simples, mas eficaz de desenvolver páginas da web modernas sem a necessidade de qualquer codificação do seu fim, porque Elementor está gerando casacos para você no backend. Então você apenas fazer uso dos widgets de rótulo para você e começar a construir a página web. Agora, vamos discutir as diferentes visitas têm trabalhado para nós no elemento livre ou um por um, os widgets disponíveis e livre Elementor são categorizados em básico, antigo. E se você tem a assinatura do Elementor Pro, então você terá os desertos da sonda e visitas ao site também. Vamos começar a aprender a aplicação de widgets básicos nesta lição. O método para inserir um widget é muito simples. Basta clicar no orçamento, manter pressionada a tecla do mouse, arrastar, arrastar e soltar. Dentro da coluna, você verá uma bandeira azul forma retangular que destaca a posição onde o widget está sendo inserido. Depois de fazer a visita, você pode clicar no ícone de lápis e as opções de edição serão abertas no painel esquerdo. A primeira visita e a lista estão em sua seção. Ele é usado para criar colunas aninhadas dentro de uma seção. Então este widget é na verdade um novo conjunto de seção com colunas e você pode usá-lo para criar layouts complexos como este. Vamos dar uma olhada nas opções de configurações de vídeo do rótulo para o widget seção interna. Agora há uma seção e há colunas. Então você vai editar as configurações para a seção como esta e para uma coluna como esta Como tudo o mesmo as opções de edição de seção e coluna que discutimos no vídeo anterior. As mesmas três guias principais, layout, estilo e avançado e as opções de edição também são as mesmas. Então, não precisamos discutir isso de novo aqui. Mas sempre faça um uso inteligente da interseção sempre que necessário. Quero dizer que se você quiser inserir uma nova coluna, você pode simplesmente inseri-la usando a opção Adicionar Coluna. Portanto, não use em suas seções desnecessariamente como eles somam-se aos códigos de marcação que podemos facilmente evitar. Use interseções somente para criar layouts aninhados complexos. Tudo bem. A próxima visita de trabalho e Elementor livre é o título. Ele permite que você crie títulos elegantes. Use este widget para adicionar títulos. Pergunte o que o design e estilo que você criou na ferramenta de design. Basta arrastar o widget para a seção, marcar o conteúdo. Eu apenas um estilo configurações e ajustar a posição para mestre design. É muito fácil. Se virmos as configurações para este lagarto, novamente, ele tem as mesmas três guias principais, Estilo de conteúdo e avançado. Na guia de conteúdo, você terá que digitar o título. Você também pode digitar o conteúdo diretamente clicando na caixa Título na página da Web. Mas eu pessoalmente recomendo digitar o conteúdo do cabeçalho nessa caixa de título sob esta guia Conteúdo no painel de edição, você encontrará a opção chamada como tags dinâmicas aqui no título. E você pode usá-lo somente se você tiver a assinatura do Elementor Pro. Mas uma vez que é muito importante. Então deixe-me mostrar-lhe um exemplo de como usá-lo. As tags dinâmicas são usadas para buscar conteúdo diretamente do site ou da página ou publicação atual. E a melhor parte é que ele muda automaticamente à medida que o conteúdo básico é alterado. Por exemplo, se você inserir o título da página ou da postagem como uma tag dinâmica no cabeçalho, ela será rápida automaticamente a partir do título da página ou publicação. E no caso de você fazer alterações no título da página que será atualizado aqui automaticamente. Vejamos outro exemplo. Se você inseriu a data e a hora atuais como a marca dinâmica. A data e hora, continuaremos atualizando automaticamente aqui. Isso é uma coisa muito maravilhosa. Esta é a principal vantagem de usar imposto dinâmico, e você tem algumas configurações extras para as tags dinâmicas. Clique no ícone da chave inglesa. Você pode alterar as configurações e atribuir o texto antes e depois na opção avançada. Você também tem a opção de atribuir conteúdo de fallback aqui. Opção de fallback é usada para exibir o texto padrão no caso de a tag dinâmica não ser acionada devido a alguns motivos, ou se o título está vazio. E as opções de ação em tags dinâmicas variam para diferentes configurações, que significa que você pode encontrar mais opções em suas tags dinâmicas para algum outro orçamento ou outra opção de configuração como mostrar um pop-up com o clique de um link. Tenha em mente que você terá acesso a essa opção de imposto dinâmico somente quando assinar o Elementor Pro. Agora, abaixo do título, você pode inserir um link, o que significa que se um usuário clicar no título, ele será redirecionado para o URL. Você vai mencionar aqui, este link pode ser um link interno levando a uma página web em seu site ou algum link externo. Além disso, há um pequeno ícone de engrenagem para abrir as opções de link. Ele contém opções para tornar o link aberto em uma nova guia e adicionar nofollow atributo do ponto de vista SEO, você pode deixar os atributos do cliente aqui como ele é. Você pode deixar a opção de tamanho aqui, atribuir a tag HTML de acordo com o plano SEO, e ajustar o alinhamento. Estas são as configurações básicas e entendidas por padrão. Preste atenção a mais uma coisa aqui. Você vai encontrar este pequeno ícone de dispositivo de computador perto de algumas opções, e ele representa vD. Representa que as configurações de alinhamento que estamos fazendo aqui são para computadores. Se você deseja alterar o alinhamento para os outros dispositivos. Basta clicar no ícone da tela e a lista abrirá o interruptor do dispositivo para fora do celular e tablet. Assim, você pode tornar as configurações de alinhamento diferentes para os diferentes tipos de dispositivo. É altamente recomendado para otimizar o design do seu site, para se sentir bem em todos os três tipos de dispositivos. E você pode fazer as configurações de otimização no nível da seção ou no nível da página da Web. Deixa-me dizer-te uma coisa muito rapidamente. Suponhamos que você está projetando uma página da Web e assim que sua seção foi projetada completamente, você pode otimizá-la para dispositivos móveis e tablets alterando a exibição da barra inferior aqui. Isso será chamado como otimização de nível de seção. Por outro lado, você pode projetar a página da Web completa e, em seguida, alterar a exibição para celular e, em seguida, para tablet para fazer as configurações de otimização. Isso será chamado como otimização do nível de pH. Ambas as técnicas são igualmente boas e você pode fazer uma escolha de acordo com a sua conveniência. Mas por favor tenha em mente que você tem que tornar seu site completamente otimizado para todos os três tipos de dispositivos. Em seguida, vamos ver a guia estilo. A primeira opção é selecionar a cor do pastoreio. Você pode facilmente escolhê-lo a partir da paleta global que temos seita. Se você quiser selecionar alguma outra cor, você pode usar o seletor de cores. Em seguida, temos as configurações de topografia e sabemos como fazer alterações na topografia. Você pode selecionar facilmente usando os telefones globais para economizar tempo. Em seguida, você pode ajustar os acontecimentos das sombras para o seu título e brincar com os diferentes modos de mesclagem. Em seguida, é a guia Configurações avançadas. E tem quase o mesmo conjunto de opções, mas para o widget cabeçalho, como você pode ajustar a margem e preenchimento, atribuindo os efeitos de rolagem, os esforços do mouse torná-lo pegajoso ou adicionar animação de entrada. Você pode ajustar o fundo do título e a borda da dor de cabeça. Mas há uma configuração adicional aqui, que é a configuração da posição. Primeiro, você vai ajustar a largura dos brejos cabeçalho escolhendo entre padrão, filbert na linha, Ang, costume atrasado. Aqui, o padrão é geralmente a largura total. E isso significa que quando você insere o widget de cabeçalho, ele irá cobrir toda a largura das colunas da esquerda para a direita. E se você selecionar a opção de veredicto interior, o assistente de cabeçalho terá somente leitura pode o conteúdo está disponível e haverá um espaço vazio para adicionar algum outro widget à direita. Sim. Você terá que atribuir o vert interior para o outro rígido também. Então, só ficará satisfeito aqui no espaço vazio da coluna. Isto em Lane. Ou, mais precisamente, usando o personalizado trabalhado em porcentagem, você será capaz de criar layouts aninhados e complexos facilmente no Elementor. Você pode fazer um bom uso da dessorção, especialmente em telefones celulares. Em seguida, você tem a opção de posição aqui, e inclui padrão, absoluto, fixo. Se eu escolher absoluto, eu posso colocar os elementos livremente na página, mas eu queria deixar claro que você deve usar esta opção apenas em casos raros projetados onde não é possível implementar o design sem isso. Porque este método não é considerado bom para o site responsivo. E você pode precisar criar muitos ajustes para dispositivos que consomem muito tempo. A posição fixa é usada para fixar o elemento para uma posição específica da página. E não importa o quanto um visitante percorra, este elemento ficará apenas aqui. Por favor, use essas duas opções com muito cuidado e muito inteligente. Resto das configurações, como capacidade de resposta, são as mesmas. E você pode ocultar esse widget ou dispositivos diferentes. E você pode deixar os atributos, certas opções CSS. É hora de salvar o guia de palavras, atualizar o site, por favor, atualizado pelo menos a cada cinco minutos. Vamos agora aprender o uso dos outros widgets. O próximo é inserir a imagem. Então clique nele, segure, arraste e solte dentro da coluna. Aqui você pode adicionar uma imagem passando o mouse sobre o suporte do lugar. Clique em Escolher imagem. Você pode carregar uma imagem do computado ou inserir uma imagem que já tenha sido carregada na biblioteca de mídia. Digite o texto alternativo para a imagem do ponto de vista SEO e clique em Inserir mídia. Voto, a imagem agora é inserida na página web usando este widget de imagem. Muito fácil. Agora vamos editar as configurações. Clique na imagem ou clique no ícone de lápis para abrir o painel Configurações à esquerda. Vamos discutir as opções de edição e a mandíbula esquerda parecia três guias, Conteúdo, estilo e imagem avançada que já carregamos. Você pode usar as tags dinâmicas para inserir automaticamente a imagem em destaque, logotipo ou a animação automática. Em seguida, você pode ajustar o tamanho da imagem e o alinhamento. Além disso, você pode adicionar legendas, que é a linha de texto para mostrar abaixo desta imagem. As legendas poderiam ser adicionadas tanto na imagem na mídia, ADICIONAR ODD else usando a opção de legenda personalizada aqui. Se você selecionar arquivo de mídia aqui, você terá uma opção para abri-lo no Modo Lightbox como este, ou então você pode sob algum URL para redirecionar o visitante para o link que você mencionou, e na mesma guia ou uma nova janela. Ao ajustar as configurações para o link. Sob a guia estilo, você pode ajustar a largura e a altura da imagem. Além disso, você pode ajustar a opacidade e algumas configurações de filtro CSS, tanto na visualização normal quanto em toda a visão geral. Ele pode ser usado para criar belos efeitos como estes. Abaixo está a configuração de borda para gerenciar a borda ao redor da imagem e as configurações de sombra de caixa muito legal. Você também pode ajustar as configurações de alinhamento, tipografia de cor e espaçamento para o texto da legenda. A última guia é Configurações Avançadas e contém o mesmo conjunto de configurações. Mas para o widget de imagem, não precisamos discutir isso de novo e de novo. Próximo assistente é o editor de texto. Ele é usado para inserir parágrafos para a página web. Novamente, as mesmas três guias aqui, Conteúdo, estilo e avançado. Na guia de conteúdo, adicione o texto que deseja digitar. Você pode adicioná-lo clicando aqui também. Deixe-me dizer-lhe que este é um editor poderoso e você terá tantas opções de formatação. Você pode adicionar mídia ao parágrafo a partir daqui e ajustar essa posição de empacotamento assim. Você pode ajustar a formatação do texto, como deixar o texto em negrito, itálico ou sublinhado. Além disso, você pode inserir marcadores, lista numerada, inserir o link no texto e até mesmo torná-lo um editor de tela cheia. Você pode alternar para mais opções clicando neste botão. Aqui você terá opções para fazer o texto riscado, inserir linha horizontal, alterar a cor de palavras ou frases específicas para destacar. Use blockquote. Posso organizar o alinhamento, usar caracteres especiais e aumentar ou diminuir o recuo. Você pode atribuir lacuna solta, o primeiro alfabeto do parágrafo e dividir o conteúdo em colunas. Devo ver que é um editor decente o suficiente para inserir parágrafos na página web. Agora, sob a guia de estilo, você tem o mesmo conjunto de textos, configurações de estilo. E a guia Avançado também tem o mesmo conjunto de configurações para este widget editor de texto. Agora, o próximo widget que temos é o widget de vídeo, e é usado para incorporar vídeos. Faça a página da web. Vamos ver as configurações sob o conteúdo que você encontrará configurações para rádio e imagem estranhamente. Vamos ver as configurações de vídeo primeiro. Comece selecionando a origem. Você pode usar um vídeo hospedado no YouTube, Vimeo, movimento diário ou carregado em sua mídia como diariamente, ou de fato, qualquer lugar que você tenha percorrido. Se quiser iniciar esse vídeo a partir de um clipe específico, ajuste a hora de início, a hora de término. Depois, há algumas outras opções de vídeo. Você pode ajustar as configurações de reprodução automática, silenciar o vídeo, loop, a reprodução para mostrar ou ocultar os controles do player. Se você estiver vinculando a um vídeo do YouTube, pode ajustar as configurações modestas de identidade visual. E se você estiver usando um vídeo do Vimeo, você poderá ajustar a cor do player também. Você pode até ajustar os vídeos estatísticos para mostrar vídeos do canal atual ou de qualquer vídeo aleatório. A próxima configuração está relacionada à sobreposição de imagem. Isso ajudará você a personalizar a miniatura do vídeo. Você pode carregar uma imagem do dispositivo e ajustar o tamanho da imagem se desejar exibir o botão Reproduzir que você pode fazer. Então, se você deseja fazer o vídeo ser reproduzido no modo Lightbox aparecendo, você pode selecionar isso também. Em seguida, sob a guia estilo, você pode ajustar a proporção para a escolha do desejo, juntamente com alguns filtros CSS para ajustar a aparência. E então você pode personalizar o ícone de jogo com cor e tamanho. As configurações avançadas são as mesmas para o veredicto do vídeo. Certo, o próximo widget é um botão. Ele é usado para adicionar botões clicáveis para a página web. Por favor, preste especial atenção às configurações do widget de botão porque um botão é a estrela do site. Através dele é uma superstar porque uma instância de botão C, D, E, chamada à ação. Certo, vamos ver as configurações do botão Vijay. A guia de conteúdo tem configurações relacionadas ao botão. O primeiro é o tipo de botão e ajustar as cores padrão do registro com base no tipo de manteiga, insignificante. Em seguida, você pode inserir o texto do botão fornecido, mas o link, e é o propósito mais importante de ter um botão no site. Os visitantes devem ser redirecionados para algum URL com o clique do botão, ou um pop-up deve aparecer mais distante visitante para concluir a ação ou para baixar algum arquivo como um PDF. redirecionamento é fácil simplesmente digitando o URL e ajustando as configurações. Abrir um pop-up é possível usando essas tags dinâmicas e pode baixar um arquivo. Você pode fazer upload de terrenos na biblioteca de mídia como um PDF, copiar o link e colá-lo aqui no URL. Nesse clique, o arquivo será aberto em uma nova guia e, a partir daí, o visitante pode baixá-lo. Se você deseja baixar o arquivo diretamente sem abri-lo em uma nova guia, então você terá que atribuir um atributo personalizado como sinal de pipe de download. Finalmente, isso fará o download do arquivo sem abrir no novo dapp e, em seguida, ajustar o alinhamento. Você pode pular o ano de potência para carbono. Eu posso fazer o botão. Você pode selecionar um ícone do eigentlich, muito estranho, você pode inserir um ícone personalizado, carregando o design no formato SVG. Nós discutimos os benefícios de usar um SVG em vez de um PNG ou JPEG para os ícones porque os arquivos SVG não estão borrados. Então você pode usar algum pré-projetado de liberal no eigentlich Diddy ou então carregar o que você projetou usando a opção de upload aqui, ajustar o espaçamento ícone e você pode fornecer um ID de botão para rastrear os cliques no pixel do Google Analytics ou do Facebook, ou seja, a parte do Advanced Analytics. Em seguida, temos as configurações de estilo para o widget de botão. Você pode começar ajustando a topografia e, em seguida, você terá a opção ajustar as cores tanto para a visualização normal quanto para a vista de focagem. As cores de um botão são muito importantes e fornecem a cor de destaque para destacá-lo do resto do conteúdo. Além disso, você pode escolher entre uma variedade de animações de Harvard para o botão e também ajustar as configurações de borda. Em seguida, você deve ajustar o espaço dentro do botão. E para isso, temos as configurações de preenchimento aqui. Preste atenção. É importante. Use-o para tornar o botão maior, menor, dólar ou violado. E a guia Configurações avançadas para o assistente de botões também tem o mesmo conjunto de letras de configurações. Pule isso. Tenha em mente que o botão é diversidade e v saber o quão importante é devido, fazer muito bom uso desta visita. A próxima visita está dividida. Ele é usado para adicionar linha horizontal e diferencia para dividir o conteúdo. E que a guia Conteúdo que você pode selecionar entre os diferentes estilos. Depois de dividido, ajuste a largura e porcentagem ou pixels, ajuste o alinhamento do divisor e adicione algum elemento na forma de EXT ou ícone ou um ícone personalizado, carregando SVG e coloque-o antes do dividido ou depois ou no meio. Sob a guia estilo, você pode fazer ajustes para cor e tamanho, muitas vezes divididos, bem como o intervalo. A guia Avançado novamente tem o mesmo conjunto de configurações para essa visita dividida. Em seguida, é o widget espaçador. Ele cria um bloco de espaço em qualquer lugar na página web, você pode preencher este bloco de espaço com alguma cor ou uma imagem. Mas este não é o único uso de um widget espaçador. Você pode usar este widget para criar formas personalizadas e usá-lo no site. Quando estou compartilhando um link do vídeo abaixo para ajudá-lo a aprender como criar formas personalizadas usando esse espaço e rejeitar todas as configurações de curtidas assim por diante. Tem apenas duas abas. Você pode criar uma caixa vazia com o espaçador e ajustar a altura. As configurações avançadas são as mesmas. Em seguida, você pode ajustar a margem adicionando cor da borda de fundo, posicionamento e as mesmas configurações. Então, aplique sua criatividade enquanto usa o espaço de orçamento e assista ao vídeo clicando no link abaixo. Próximo widget é adicionar o Google Maps à outra página. É uma maneira fácil de incorporar o Google Maps em seu site. Isso é muito útil para páginas de conduta para que seus visitantes possam saber onde você está localizado no mapa. Simplesmente ligado à localização que deseja mostrar no mapa e ajustar o zoom na área. Você também pode ajustar a altura do mapa. A guia estilo tem alguns mentores CSS, enquanto a guia Avançado tem as mesmas configurações. Próximo assistente é inserir um iBeacon. Tenha em mente que os ícones desempenham um papel muito importante na manutenção do equilíbrio do design do site. Então faça bom uso dos ícones no site. Basta selecionar um item da responsabilidade do ícone ou carregar o ícone personalizado no formato SVG. Como eu tinha dito anteriormente, que preferimos os ícones em SVG e não PNG ou JPEG. Você pode ajustar a exibição para padrão, empilhado e emoldurado. Além disso, você pode fornecer um link como discutimos antes para o botão e ajustar o alinhamento sob o estilo. Você pode ajustar a cor para a exibição normal e para a exibição com o cursor do mouse. Você também pode fazer ajustes para tamanho e rotação. A guia Avançado, novamente tem o mesmo conjunto de configurações para a visão do ícone. Então, todos estes são os widgets básicos fornecidos no construtor de página Elementor. E você pode usá-los para desenvolver as seções, colunas e todo o design da página da Web. É muito fácil de usar, simples arrastar e soltar e ainda muito poderosa maneira de construir sites modernos. Tenho certeza de que você será capaz de usar todos eles no desenvolvimento da página web de acordo com o design que você criou em sua ferramenta de design. Sei que vai exigir uma boa quantidade de prática para tomar consciência de todas as vinhas e opções de configuração. Mas uma vez que você tenha dominado, ninguém pode impedi-lo de construir um site, um site pixel-perfeito, de forma rápida e fácil, sem qualquer codificação. Saiba mais sobre os orçamentos gerais e aprove orçamentos nos próximos vídeos. Fique atento. 35. Aplicação de widgets gerais: Estamos usando os orçamentos Elementor para desenvolver as páginas web de acordo com o design que criamos na ferramenta de design. É um processo fácil e poderoso de desenvolver sem qualquer codificação. Agora, vamos aprender o uso, muitas vezes widgets cada rótulo sob a categoria geral. Estes orçamentos são, na verdade, apenas uma extensão dos widgets básicos. Combinar os diferentes widgets em um orçamento comum para acelerar o processo de desenvolvimento da página web. E junto com isso, há alguns orçamentos mais criativos também nesta seção, vamos aprendê-los um por um. A primeira visita do rótulo aqui é a caixa de imagem. Ele é usado para adicionar uma caixa de imagem que combina uma imagem com um título e texto, que é frequentemente usado na seção de recursos do site. Simplesmente escolhido emergir no título e descrição e você obtém o mesmo conjunto de configurações, como um título de imagem e descrição que aprendemos no último vídeo. Semelhante à caixa de imagem, temos o próximo widget chamado como a caixa de ícones. Também é comumente usado para criar a seção de recursos. Tem todas as mesmas configurações. Apenas você pode usar um ícone em vez de uma imagem da biblioteca de ícones ou carregar SVG personalizado e ajustar usando o mesmo conjunto de configurações. Não estou repetindo essas configurações comuns de novo e de novo. Espero que você esteja claro como usar as configurações para os widgets. A próxima visita é adicionar classificação por estrelas. Agora, usando este widget, você pode atribuir classificações de estrelas na página da Web. Pode ser usado junto com os depoimentos e comentários. Você pode personalizar o ícone de estrela e um rótulo para tamanho, cor e topografia. A guia de conteúdo tem configurações relacionadas às estrelas. A primeira opção é selecionar a escala de classificação entre 0 e cinco ou 0 a dez. Na próxima opção, você pode atribuir valor com base na escala. Na próxima opção, você pode selecionar as duas versões do ícone estrela. Um é via font-awesome e o outro de Unicode. Escolha o que você gosta. Em seguida, você pode selecionar o estilo não marcado de sólido para contorno. Você pode até adicionar um título antes da classificação por estrelas como esta e ajustar o alinhamento selecionando esquerda, centro, direita ou justificado. Na guia estilo, você pode ajustar as configurações de topografia e cor do título e início. Sinta-se livre para explorar as configurações restantes. Ele contém quase o mesmo conjunto de configurações. Próximo assistente é adicionar imagem, obter acil. Ele ajuda na criação de galerias de imagens deslizantes para a página sob a guia de conteúdo. A primeira configuração está relacionada ao carrossel de imagem. Você pode selecionar várias imagens clicando no ícone de adição. Você pode ajustar o tamanho da imagem. E a próxima opção é importante. Você pode selecionar quantas imagens serão exibidas de cada vez e quantas imagens serão roladas. Por exemplo, se você selecionou três imagens para mostrar e uma imagem para deslizar, ela ficará assim. E não se esqueça, você tem que otimizar as configurações para o dispositivo móvel e tablet também. Então essa é uma opção para esticar a imagem caso as dimensões da imagem não estejam em ordem. Em seguida, para mostrar a navegação, você pode selecionar as setas e pontos. Só as setas são apenas pontos. Se quiser exibir as imagens no Modo Lightbox, selecione o arquivo de mídia e os links e pressione sim na opção lightbox. Ou então você pode atribuir um hiperlink imagens 2D e ajustar as configurações de legenda. Nas configurações adicionais você pode controlar o recurso de reprodução automática, boson hover, boson, clique na interação, a velocidade de reprodução automática, configurações de loop, velocidade de animação e direção da esquerda para a direita ou direita para a esquerda. As configurações de estilo contêm as opções para modificar as cores e a posição para navegação, emergir e legenda. Nas configurações de navegação, você pode ajustar a posição, tamanho e cor das setas e pontos. As configurações de emitem contêm as opções de alinhamento, espaçamento, tipo de borda e raio de borda. Em seguida, há configurações padrão para legenda, como todos os outros widgets de texto. As configurações avançadas contêm o conjunto semelhante de opções para o widget colossal. É isso. Próximo widget é a galeria de imagens básica. Ele é usado para adicionar galerias de imagens para a página, mas não o deslizamento quando ouvido. Opções de configuração. Quase o mesmo. Sinta-se livre para explorá-lo. O próximo widget é adicionar lista de ícones. Ele é usado para criar uma lista fácil de gerenciar de itens com cada item destacado por seu próprio ícone. Vamos começar com as configurações sob a guia de conteúdo. A primeira opção é selecionar o layout. Existem duas opções e é padrão e iluminado. Em seguida, você pode digitar esses itens diferentes na lista. Um item contém o texto e eu posso, juntamente com uma opção de link, você pode criar uma cópia do item ou excluído clicando sobre isso. Sob a guia estilo, há o mesmo conjunto de configurações para ajustar a lista. Eu posso terminar texto e também há uma opção para adicionar um divisor no meio. A guia Avançado também é a mesma para a lista de ícones do widget. A próxima visita é contada. Se for legal, ele é usado para adicionar qualquer contador numerado medido à página da Web. Na guia de conteúdo, há opções para ajustar o contador. Você pode mencionar o número inicial, o número final, o prefixo e o sufixo para personalizar os valores do contador. Em seguida, você pode ajustar a duração da animação que irá alterar a velocidade de contagem e também mostrar ou ocultar o separador de mil é separado, poderia ser um ponto ou um espaço. Você também pode atribuir um título, embora ele apareça na parte inferior do contador como uma legenda. Sob a guia estilo, você poderá ajustar as cores e a tipografia para o número e o título. As configurações avançadas são as mesmas. O próximo vídeo é a barra de progresso. Ele é usado para adicionar totalmente estilizado quaisquer barras de progresso matriz para a página web. Ele contém as configurações para a barra de progresso. Primeiro, você pode mencionar o título do BOD de progresso e atribuir uma porcentagem para preencher. É opcional mostrar o valor percentual e o texto interno, que também é chamado como o texto do titular do lugar. Sob a guia estilo, você pode fazer ajustes para a goela da barra de progresso, altura e raio. A tipografia e as cores fora do texto interno juntamente com o título, também podem ser alteradas. As configurações avançadas são as mesmas. Próximo widget é adicionar seções de depoimento. Isso torna sua tarefa fácil, combinando o conteúdo e emergir layout aninhado em um único widget. Isso é útil para economizar tempo em fazer ajustes de layout de coluna. A primeira configuração na guia de conteúdo é para depoimentos. Você pode escrever o conteúdo do depoimento e fazer upload de uma imagem do seu cliente junto com o nome, designação e opção Link. A posição da imagem tem duas opções de lado, superior, juntamente com as configurações de alinhamento. Na guia estilo, cores e topografia poderiam ser gerenciadas para conteúdo, nome e designação, juntamente com as configurações padrão para imagem. As configurações avançadas são a cena. Próximo vídeo é inserir guias. Ele ajuda a dividir o conteúdo em guias, horizontalmente ou verticalmente. Na guia de conteúdo, temos configurações para as guias. Você pode criar uma lista de guias que a opção de copiar e excluir uma guia. Aqui, você pode selecionar o tipo de guia entre horizontal e vertical. Sob a guia estilo, você tem configurações para ajustar a largura da caixa de menu, tendo esse título e a largura da borda, a cor da borda e a cor do plano de fundo. Em seguida, você pode ajustar as configurações de topografia para título e conteúdo. Há uma opção para ajustar a guia ativa aqui, isso significa que você pode atribuir configurações específicas para a guia ativa que um usuário está acessando. Garantia. As configurações avançadas são as mesmas. Os próximos dois orçamentos são quase comuns com o mesmo propósito, mas com uma ligeira diferença no seu funcionamento. Estes são acordeão e alternar. O widget acordeão é usado para exibir texto de forma recolhida, condensada e ajuda a economizar espaço. Com o acordeão. Os visitantes podem digitalizar os títulos dos itens e optar por expandir um item somente se ele estiver fora dos seus interesses. Como vemos em uma seção de perguntas frequentes. Se virmos as configurações de um acordeão, ele contém a lista de itens com título e descrição. Ele também contém ícones. Você também pode tornar o ícone ativo diferente aqui. Você também pode atribuir as tags HTML ao título do ponto de vista SEO. A guia estilo contém as configurações de uma borda guardiã, tornozelos, topografia e configurações de cor para o título, descrição e Eigen. As configurações avançadas são as mesmas. Agora, quando também inserimos esse widget de alternância, ele serve o mesmo propósito, mas com uma pequena diferença. Verificado esse widget de alternância, um visitante pode ver quantos itens desejar e todos podem ser expandidos ao mesmo tempo. No entanto, com o widget acordeão, apenas um item pode ser expandido ao mesmo tempo. À medida que você expande outra gravação, eu termo o item aberto anteriormente colapsa automaticamente. Então essa é a única diferença entre o acordeão e a rejeição de alternância. As configurações para o orçamento de alternância são as mesmas que o acordeão. Próximo assistente é inserir os ícones sociais. Ele ajuda na adição de links de ícones para seus perfis de mídia social. Na guia de conteúdo, você pode fazer alterações na lista de ícones sociais. Você pode ajustar o ícone e vincular junto com opções para editar as cores. Você pode selecionar entre uma variedade de formas, como um arredondado, quadrado e círculo. Se você deseja empilhá-lo em linhas, você pode escolher o número de colunas e escolher o alinhamento. Sob a guia estilo, você pode fazer alterações para a cor. Existem duas opções para escolher, a cor oficial e a cor personalizada. Bem, ambos são freqüentemente usados na concepção do site e você pode escolher de acordo com o seu esquema de design. Ao selecionar a cor personalizada, você pode ajustar a cor primária e a cor secundária. Em seguida, você pode gerenciar o tamanho dos ícones sociais adicionando espaçamento e lacuna de linhas, você pode inserir uma borda também. Você também pode atribuir um efeito de emissão. o mouse sobre os ícones sociais. Essa é legal. As configurações avançadas são todas iguais para o widget de ícones sociais. Próximo assistente é adicionar caixa de alerta. Vamos, todos estejam alerta. Ele permite que você exiba uma caixa de alerta colorida para chamar a atenção para alguma mensagem importante e ela desaparece depois que o visitante executa uma ação sobre ela. Existem diferentes tipos de caixas, apenas com cores de fundo diferentes, nada significativo. Você pode adicionar o título e a descrição de sua escolha aqui, o botão Fechar e ocultar o alerta também é opcional. Na guia estilo, você pode fazer ajustes para a cor e borda e para o título e descrição. As configurações avançadas também são as mesmas. O próximo vídeo é SoundCloud. Ele incorpora clipes de áudio do SoundCloud para o site. Você pode inserir o link de áudio, escolher a exibição do player, habilitar desativar a opção de reprodução automática por curtir, baixar, compartilhar comentários do botão, contas, nome de usuário e controlar as cores. O próximo é um widget de código curto. Então, o que é um código curto? É código curto basicamente é uma tag especial que entramos em uma página no WordPress que é substituído pelo conteúdo atribuído quando visualizamos o site ao vivo. Deixe-me lhe dizer um exemplo. Se você tem que incorporar um formulário criado usando plugin de terceiros como formulários WP, então você precisa adicionar o código curto para incorporá-lo na página web. É código curto também é usado para incorporar APIs e visitas como um widget do Twitter na página web. Ele economiza tempo e ajuda na adição de conteúdo especializado. Em um fácil, basta digitar o código curto em um determinado campo e clicar em Aplicar. Seu conteúdo apareceria no site. As configurações avançadas são as mesmas. O próximo widget é adicionar código HTML à página da web. Assim como o código curto inserido, você pode adicionar um HTML, CSS, códigos curtos ou JavaScript na página web usando este widget. Como se você tiver o código HTML para um formulário, você pode inseri-lo aqui para incorporar o formulário na página da Web. As configurações avançadas também são as mesmas. Em seguida, é o widget âncora do menu. Ele é usado para criar uma página com navegação de rolagem interna. Isso significa que se um visitante clicar em determinado elemento aqui será automaticamente rolar para os outros elementos na mesma página. Ele é usado para a mesma navegação de rolagem de página. O processo é simples. Basta inserir o assistente de âncora do menu na parte superior da seção onde você deseja rolar o visitante. Dê um nome a ele. Agora, edite esse elemento clicável que irá redirecionar ao clicar no campo URL, digite o mesmo nome, mas começando com uma hashtag, é isso. O menu e get é criado e as configurações avançadas são as mesmas que de costume. A próxima visita é inserir uma barra lateral. Ele ajuda na adição de qualquer uma das barras laterais de equipes que podemos ter criado na página. Você será capaz de editar os elementos de uma barra lateral quer indo para o Personalizador de Temas ou elemento ou construção de equipe. A propósito, adicionar barras laterais a um site de negócios é muito raro hoje em dia. É apenas comumente usado nos sites de blogs. Finalmente, há um assistente de modo de leitura, mas você pode ignorá-lo, pois não é tão útil. Então você aprendeu sobre a aplicação de widgets gerais também. E isso é o que todo o portão com o plug-in Elementor gratuito. Estes widgets são bastante poderosos e V são capazes de desenvolver a página web baseada no web design de forma muito rápida e fácil sem qualquer codificação usando todos esses widgets, você pode desenvolver todas as partes das páginas do site com muita facilidade usando essas visitas para ter acesso aos recursos e widgets mais avançados, você pode planejar obter a assinatura do Elementor Pro e aprender vívido sobre a aplicação dos widgets de teste na próxima lição. Vejo você lá. 36. Aplicação de Widgets profissionais: Ao assinar o Elementor Pro, você obtém acesso aos recursos premium, como o construtor de equipes, formulários e integração de dobradores pop-up, animação de mouse e rolagem, orçamentos globais, tags dinâmicas e cerca de 30 widgets avançados para criar web designs interativos de forma rápida e fácil. Então vamos agora aprender sobre os widgets de trabalho na versão Pro do elemento de. Em primeiro lugar, gostaria de lhe dizer o que é um orçamento global? Um elemento ou um orçamento global é usado para controlar as configurações de um widget específico é exibido em vários lugares no site. Isso significa que se você quiser usar um widget nas diferentes páginas e editar todos eles juntos avançar. Você pode usar uma rejeição global. Por exemplo, se você quiser usar o mesmo orçamento de depoimento na página inicial de produtos e entre em contato conosco página. Em seguida, dar vida para salvar a seção como um modelo e inserido em todas as três páginas. Mas se você deseja fazer alterações neste widget de testemunho, você terá que editar todas as três páginas e vai consumir tempo desnecessário. Aqui, você pode fazer uso do orçamento global porque você está usando as mesmas configurações para o widget de depoimento em todas as páginas diferentes. Então guarde esse depoimento como um orçamento global e inserido em todas as três páginas. Agora, se você deseja fazer alterações, visita adjetivo em uma página e o resto será atualizado automaticamente porque eles estão vinculados. Tenha em mente que, se você excluir o assistente global, ele será removido de todas as páginas onde ele foi inserido. E assistente global trabalha para widget, não quatro seções. Alguns prós, alguns contras. Tudo bem. Deixe-me dizer-lhe o processo, como criá-lo. Crie qualquer orçamento global simplesmente clicando com o botão direito do mouse e salve como global, insira um nome, salve. Ele será adicionado a esta lista de orçamentos globais perto dos elementos. Tem uma borda amarela em vez de azul. Agora, para inserir este assistente global em qualquer outro lugar, basta arrastar e soltar. Mas a partir desta lista global de widgets, se você quiser editar o widget Global, clique no ícone de lápis e ele mostrará que a visita está bloqueada. Você pode clicar em editar e começar a editar o projeto. Ele será atualizado em todos os lugares automaticamente. E se você deseja editar apenas a visita nesta página e não as outras, você pode clicar em desvincular. Ele vai se tornar um orçamento regular e agora fez as alterações apenas para este widget aqui nesta página. Então esse é o conceito de rejeição global. Agora vamos discutir os Elementor Pro Widgets. O primeiro assistente é postar. Ele é usado para inserir o arquivo de postagem para a seção de qualquer página. Na verdade, você pode mostrar o arquivo de páginas, o portfólio de produtos ou selecionar manualmente quais seções você deseja exibir de forma arquivada em uma página da Web. É poderoso e comumente usado para exibir o arquivo de cartaz bloco na página inicial? Se virmos as configurações para este projeto, então, sob a guia de conteúdo, você pode alterar os visuais selecionando a capa de protetores clássicos e conteúdo completo. Altere o número de colunas e postagem. Mas página você pode optar por mostrar a dimensão de feição e ativar o efeito de alvenaria. By the way, alvenaria é um layout de grade que usa todo o espaço, reduzindo quaisquer lacunas desnecessárias entre as imagens. Você pode alterar o tamanho da imagem. Odeio o título e o trecho. Configurações de metadados, modelagem de leads, emblema e Avatar. Se você mudar a pele, algumas opções são alteradas, mas são apenas comuns e fáceis de entender. Em seguida, nas configurações de consulta têm níveis avançados, opções de personalização como escolher a fonte de conteúdo e incluindo ou excluir determinadas categorias de conteúdo ou autor. Você pode selecionar o gabar-se para mostrar por um período de tempo específico e também gerenciar a sequência de ordenação da publicação. Além disso, você tem as opções para personalizar os elementos de paginação como números e anteriores. Em seguida, sob a guia estilo, você será capaz de ajustar os visuais, layout, espaço, alertas e tipografia para o conteúdo da imagem, ANC, paginação e as configurações avançadas são novamente as mesmas. Você pode usá-los como por sua exigência. Em seguida, é o widget do portfólio. Ele é usado para exibir as páginas de post e tipos de post personalizados em um atraente pensar que grade capaz. Funciona quase da mesma forma que o orçamento postal. Apenas, você pode adicionar uma barra de filtro para que o visitante possa clicar nos filtros para ver o post relevante e layouts personalizados de forma organizada. As configurações são todas iguais com apenas uma opção adicional para ativar e desativar barra de filtro mais antiga sob a guia estilo, novamente, você obtém o mesmo conjunto de opções com Justin, configuração adicional para o filtro, mas nada significativo. E as configurações avançadas também são as mesmas. Vamos agora ver o próximo vídeo, mas ele faz a galeria de imagens. Ele ajuda na adição das galerias de imagens complexas e bonitas na página web. Esta é uma versão avançada do GAL80 básico que aprendemos antes. Você pode adicionar uma única galeria ou várias galerias com toques de filtro. Você pode escolher o layout da grade, justificado e alvenaria. Você pode gerenciar o número de colunas, espaçamento, link e proporção. Você pode fazer alterações na barra de filtro para rótulos, ponteiros e animação. Além disso, você pode personalizar a sobreposição de plano de fundo, o título e a descrição. Sob a guia estilo, você obtém configurações para sobreposição de imagem, conteúdo e filtrado sobre, que são simples como aprendemos, lutou os widgets antes, Avançado que os bancos também são os mesmos. A próxima visita no Elementor Pro é especial e é adicionar formulários. Usando isso, você pode configurar um formulário de contato no site para permitir que os visitantes uma maneira simples de entrar em contato com você. By the way, este é o orçamento mais importante, especialmente para páginas de destino. Na guia de conteúdo, você obtém configurações para campos de formulário, envia a ação do botão após enviar e algumas opções adicionais dão para formar um nome e adicionar os campos que você deseja mostrar. O tipo de campo contém todos os campos padrão e comumente usados no formulário, como texto, e-mail, número de telefone, área de texto, botões de opção, caixa de seleção, data, hora, recaptura e modo. Você pode usar quantos campos quiser. Apenas certifique-se de que o processo de preenchimento do formulário deve ser muito suave e fácil para o visitante e deve consumir o menor tempo possível. Você pode mostrar ou ocultar o rótulo ou a marca necessária ativando ou desabilitando essa opção. Em seguida, você pode gerenciar as configurações de botão como tamanho, peso e etapas de alinhamento e botão Enviar. Agora atribua a ação após o envio do formulário, como enviar um e-mail, redirecionar o usuário para uma página de agradecimento ou adicionar o usuário à lista de público-alvo da ferramenta de marketing de e-mail. Aqui, a primeira opção de e-mail é enganar os desertos de submissão em seu ID de e-mail. E o e-mail também é usado para dizer um e-mail automatizado no envio bem-sucedido do formulário, como um respondedor automático usando o Elementor. Você pode escolher quantas ações quiser aqui. Em seguida, você pode fazer as configurações para os formulários de várias etapas. By the way, para criar um formulário de várias etapas, selecione etapas do tipo de campo de lista, e isso atua como um divisor para a diversão do passo. Você pode adicionar mais taxas e Dave será exibido na etapa 2. Em vez de enviar botão, você vai encontrar o próximo botão no passo um e o beta1 anterior, juntamente com Enviar e passo 2. Formulários de várias etapas são úteis quando você tem mais número de campos e você deseja dividir o processo de preenchimento de formulário em um mais lógico. E, finalmente, sob as opções adicionais, você pode editar as mensagens personalizadas que são mostradas depois de enviar um formulário como a mensagem de sucesso. Ou a mensagem de erro, a mensagem campo adquirida ou a mensagem de entrada inválida. Na guia estilo, você pode gerenciar as configurações de taxas, conteúdo, botão ang para espaçamento, cor, biografia e visuais. Preste atenção ao estilo passos como você terá opções para estilizar o passo inativo, ativo e concluído. Deixando a guia Opções avançadas para você tentar. Próximo widget é o formulário de login. Isso facilita a criação uma página de login personalizada em vez da página de login padrão do WordPress. Na guia de conteúdo, há opções para editar os campos de formulário, botão e opções adicionais para direcionar o visitante após o login, mensagem de login de logout e opções para editar o rótulo e o titular do lugar. As opções de estilo e avançadas contêm as mesmas configurações comuns. Em seguida, é o widget de slides. Ele ajuda na criação de slides simples que funcionam perfeitamente bem. Você pode criar slides de seções com plano de fundo personalizado, título, descrição e botão. Basta arrastar e soltá-los para alterar sua posição, duplicar, excluir ou adicionar um slide. Quando você clica em um único slide, suas opções se abrem para configurações de fundo, conteúdo e estilo. Você pode criar n número de slides, ajustar a altura, e nas opções de controle deslizante você pode ajustar a navegação, reprodução automática, boson hover, placas ou interação loop de velocidade de reprodução automática, e selecionar uma transição maravilhosa de slide ou fade. Além disso, há uma opção para atribuir animação de conteúdo de diferentes direções. Na guia estilo, você pode gerenciar os visuais, o espaço, a cor e a topografia de slides, título, descrição, botão e navegação. A guia Avançado tem o mesmo conjunto de configurações. Agora a próxima visita é Menu Nav. Ele o ajuda usando os menus que você criou no WordPress e projetá-los de qualquer maneira que você quiser. Isso significa que você pode inserir um menu de navegação em qualquer parte da página da Web. Na guia de conteúdo, você pode ajustar as configurações de layout, como menu horizontal , menu vertical ou um menu suspenso. Com base no layout selecionado, você terá opções para editar o ponteiro de alinhamento, indicador de submenu de animação, configurações do Anki para o menu suspenso móvel. Sob a guia estilo, você pode ajustar as configurações para o menu suspenso principal e botão de alternância. Certifique-se de editar as configurações para o modo normal e ativo. As configurações avançadas também são as mesmas. O próximo widget é o título animado. Ele é usado para criar manchetes de atenção que giram ou incluem a animação destacada. Você pode criar manchetes emocionantes com efeitos atraentes. Na guia de conteúdo, comece com a seleção do estilo de seu nome que são dois estilos rotulados. Destacado e rotativo. O texto realçado pode ser realçado com alguma forma como círculo ou sublinhado. Que os textos rotativos poderiam ter a animação de digitação ou clipe, redemoinho e muitas outras animações. No próximo campo, você pode adicionar antes do texto, texto destacado ou rotativo e o texto posterior. Você também pode adicionar links, ajustar o alinhamento e atribuir as tags HTML a isso acontecendo do ponto de vista SEO. Styling é fácil. Sob a guia estilo, você pode ajustar a forma e os visuais com cabeçalhos. A guia Avançado também é, como de costume. A próxima visita é a lista de preços. Ele é usado para criar catálogos e menus totalmente estilo que incluem preços. Em termos de edição das configurações, é semelhante à lista de ícones, e acredito que você pode gerenciá-lo facilmente explorando o conteúdo, estilo e guia Configurações avançadas. próximo vídeo é a mesa de base. Ele é usado para criar tabelas de preços elegantes e avançadas que exibem os produtos ou serviços. É um bom e você pode editar todas as partes desta tabela de preços. Na guia de conteúdo, você pode editar o cabeçalho do título, descrição e tag HTML e, em seguida, gerenciar as configurações de preços, lista de recursos, botão , link e informações adicionais no rodapé. E, finalmente, habilite, desabilite a faixa de opções Quando para modificar o título e a posição. Sob a guia estilo, você será capaz de ajustar o espaçamento, cores, tipografia e visuais para os recursos voltados para o cabeçalho, rodapé e faixa de opções. E eles avançaram, seus tanques são os mesmos. Próximo widget é uma caixa invertida. Ele é usado para criar caixas animadas que se deslocam para o outro lado. Visitante monstro paira sobre eles. Significa que a seção tem um lado francês e um traseiro. E você pode mostrar conteúdo diferente na frente e na parte de trás. O lado da frente pode ser usado para criar emoção e atração para virar a seção e a parte de trás tem um CTA para incentivar a ação. Se virmos as configurações, a guia de conteúdo terá configurações para frente, verso e opções de configuração. Sob a opção frontal, você pode projetar o conteúdo e fundo na opção convento, escolher um elemento gráfico como uma imagem ou eu posso alterar o tipo de exibição como padrão, empilhado ou emoldurado, inserido título e descrição. E na opção de fundo, você pode alterar a diagonal da seção. Em seguida, você pode alterar a parte de trás da seção, que é visível após o flip. E tem quase as mesmas configurações, mas com o botão que pode atuar como um CTA. Nas configurações, você pode ajustar a altura e o raio da seção, atribuindo o efeito flip, direção de flip e um efeito 3D. Na opção de estilo, você pode fazer ajustes para a frente e a parte de trás para preenchimento, alinhamento, posição, tipo de borda e configurações relacionadas ao ícone, título e descrição parecem longe o traseira com configurações adicionais para personalizar o botão. E, finalmente, você obterá o mesmo conjunto de configurações na guia Avançado. próximo é um widget de chamada à ação. É uma ferramenta para criar belas caixas que combinam uma imagem, algum texto e um botão. O widget Usuários e emissões e efeitos CSS para criar interações do usuário que aparecem quando o usuário passa o mouse sobre a caixa. Aqui, sob a opção de conteúdo, você vai ajustar as configurações de imagem, conteúdo e faixa de opções. Escolha o tipo de pele e ajuste a posição da imagem. As configurações de conteúdo têm quase o mesmo conjunto de configurações regulares. E na faixa de opções, você pode mostrar um texto inclinado no canto superior direito e superior esquerdo. Sob a guia de estilo, há configurações para caixa, botão de conteúdo e um efeitos de Harvard benignos. Você pode ajustar a altura, o alinhamento, a posição e o preenchimento após a seção com opções para editar a largura e a altura da imagem. Em seguida, há opções de configuração regulares para conteúdo e botão. Sob a opção de faixa de opções, você pode alterar a cor de fundo, x colorido e distância do canto, topografia e sombra. E as configurações avançadas também são as mesmas. Próximo widget é um kit de mídia acyl. Ele é usado para criar um controle deslizante de vídeos e imagens. A visita inclui três skins. Número um, fique incrível. É a capa de carrossel rotativa padrão que mostra um número personalizado de slides de imagem ou vídeo. Mas poucos. Número dois é apresentação de slides. É uma capa deslizante que exibe um slide primário e miniaturas de imagem pequenas abaixo. Número 3 é fluxo coberto. É uma pele deslizante que mostra um slide central na frente e duas luzes locais na parte de trás. Dentro de cada abatido, você pode adicionar a imagem ou vídeo e tê-lo vinculado ao seu arquivo de mídia ou a um link externo. A excitação do gueto pode exibir uma mistura de imagens e vídeos, atuar uns. Você pode alterar a altura do efeito de slide e gerenciar as configurações de miniatura. Nas opções originais, você pode ativar, desativar a navegação deslizante, opções de reprodução automática e tamanho e ajuste da imagem. Na guia estilo, você pode gerenciar os visuais, o espaçamento, a cor e a tipografia para slides, navegação e caixa colocada. As configurações avançadas são as mesmas para a mídia também pode rejeitar. Próximo widget é uma cetose de testemunho. É usado. Display é deslizante carrossel de depoimentos de clientes em uma variedade de projetos. Ele tem o mesmo conjunto de configurações e que o estilo de conteúdo e guia Avançado que você pode agora facilmente explorar. Próximo assistente é mostrar comentários. Ele exibe um carrossel deslizante de comentários de usuários, embora as opções de envio são as mesmas para este widget falhou, mas você obtém um recurso muito benéfico aqui. Você pode inserir um ícone como um ícone de mídia social e fornecer o link para a revisão ou o perfil do visualizador. Isso realmente ajuda na construção de credibilidade e autenticidade na percepção dos visitantes. Muito boa linha. Em seguida é a terceira tabela de widget de conteúdo. Ele é usado para inserir cabeçalhos em uma seção e os títulos são rápidos automaticamente a partir do conteúdo da página com base em H1 para H6 níveis de hierarquia. Embora os processos automáticos, você tem muito controle sobre o que fica incluído e placa fica excluído da tela. Você pode incluir as tags de cabeçalho para mostrar e escolher entre o número ou marcadores. Sob as opções adicionais, você pode habilitar o contorno de texto quando vetor de coluna não puder acomodar texto longo em uma linha, habilitar desabilitar a caixa minimizada para forçar um clique para expandir o índice e habilite desabilitar a exibição hierárquica e recolher os subitens. Na guia estilo, você pode gerenciar o mesmo espaço visual, cor e configurações de topografia para Cabeçalho Caixa e listar configurações avançadas úteis também são as mesmas. A próxima visita é uma contagem regressiva. Ele permite que você adicione contagens regressivas à sua página sem o uso de qualquer plugin de terceiros. Personalizar o temporizador é fácil. Escolha entre a data de vencimento ou o temporizador perene, embora não haja diferença significativa entre eles, você pode alterar o tipo de exibição habilitar desativar os dias, horas, minutos e segundos, mostrar ou ocultar o rótulo e um rótulo personalizado. Você pode definir uma ação após o temporizador expirar e escolher entre redirecionar um visitante para outra página ou Neymar de alta tecnologia ou mostrar alguma mensagem personalizada. O estilo e a guia Avançado têm o mesmo conjunto de configurações que você pode gerenciar facilmente. Próximo widget é botões de compartilhamento. Ele adiciona botões de compartilhamento a qualquer página ou post do site. Este orçamento é muito importante porque se os visitantes compartilharem esta página com suas conexões nas mídias sociais, você terá mais tráfego e terá o controle total para personalizar o design e estilo do botão de compartilhamento. Na guia de conteúdo, adicione as redes e crie uma lista. Você pode alterar o tipo de exibição, mostrar ou ocultar o rótulo, mudar para o tipo de capa, forma, número de colunas, alinhamento. E URL de destino que indica a página atual ou outra página ou postagem a ser compartilhada. Sob a guia estilo, você pode gerenciar os visuais e o design dos botões e as configurações avançadas são as mesmas aqui também. Próximo assistente é blockquote. Ele é usado para incorporar aspas totalmente estilo. Você também pode configurá-los como clicado para twittar ir para permitir que os usuários compartilhá-los facilmente no Twitter. Comece escolhendo o tipo de capa, insira o conteúdo criado, habilite ou desabilite o botão Tweet com um clique, altere o tipo de exibição e a capa do botão Saudação, insira a mão-de-obra e seu nome de usuário do Twitter. Você pode ajustar o estilo do botão de conteúdo e borda muito facilmente e as configurações avançadas e também o mesmo. Em seguida, temos algumas visitas relacionadas ao Facebook para aumentar os sites, o engajamento do Facebook para que você possa obter mais curtidas, compartilhamentos e interações. O primeiro é adicionar o botão Facebook para o site. Usando isso, você pode adicionar um Facebook como Beta1 para que os visitantes possam gostar da página web ou postar na página do Facebook diretamente do site. Você pode escolher o tipo de ação entre curtir e recomendar. Layout, tamanho, cor, curto, oculte o botão Compartilhar e imagens de perfil. Você pode obter curtidas para a página atual do site ou inserir o URL da página do Facebook em Guston. Uma vez que o estilo segue alertas padrão do Facebook. Assim, você não tem a opção de editar o estilo. E o passo avançado também tem o mesmo conjunto de configurações para este widget. Próximo assistente é adicionar comentários do Facebook. Ele é colocado no final do post para permitir que os leitores comentar facilmente usando sua conta do Facebook. Você pode escolher quantos comentários mostrar e ordenar. Você pode mostrar os comentários da postagem atual ou algum outro, ancorando esse URL personalizado. Próximo widget é incorporar postagem do Facebook. Ele ajuda a incorporar facilmente Facebook postar vídeos ou comentários na página do site. Você pode optar por incorporar um vídeo ou comentário de gabarito. Você pode facilmente obter o URL do Facebook clicando com o botão direito do mouse e copiar método URL. Simplesmente colado aqui no campo URL. Você pode habilitar para mostrar o texto completo da postagem ou ajustar as configurações do vídeo. Próximo assistente é adicionar a página do Facebook no site. Sim, você pode adicionar o feed de página do Facebook no próprio site. Basta digitar o URL da página do Facebook aqui no campo do link. E você pode escolher as opções de layout a serem exibidas no feed, como linha do tempo, eventos e mensagens. Ative desativar o cabeçalho, a foto da capa, as fotos do perfil e ajustar a altura da visita. As configurações avançadas são as mesmas. O próximo orçamento é inserir um modelo global personalizado na página. Este modelo geralmente é salvo e sincronizado com a biblioteca elementor para a conta de licença, você pode fazer uma pesquisa para o nome do modelo agir simplesmente inserido. Se você deseja editar este modelo a partir da própria página, publique a página, e então você terá uma opção para editar o modelo tão simples quanto ele é. O orçamento final e Elementor Pro é Lottie. Latae. Widgets são elementos pequenos e limitados que são renderizados a partir de arquivos JSON. Basta fazer upload ou referência e arquivo JSON externo e ajustar conforme desejado. Este widget melhora a interação mostrando conteúdo animado na página. Você pode criar um Lottie usando o Adobe After Effects ou usar algumas animações de latae pré-projetadas. Basta fazer uma pesquisa no Google, baixá-la para carregar uma biblioteca de mídia, ou então inserir o URL para o arquivo externo e o Elementor. Vamos buscá-lo diretamente de lá. Escolha a legenda de alinhamento, âncora, link no clique. Nas configurações, você pode ajustar o gatilho para animação, velocidade de reprodução de loop, ponto inicial, ponto final e reverso. Mais tarde renderizador ser SVG. Para visuais nítidos e claros, você tem algumas opções de estilo para gerenciar o espaçamento e os visuais, e as configurações avançadas são as mesmas. Então, tudo isso onde a sonda visita que você começa com o Elementor Pro. Junto com isso, você também recebe algumas visitas ao site com o elemento ou construtor de equipe. Vejamos também aqui. O primeiro é rejeitar o logotipo do site. É um veredicto dinâmico que é usado para inserir o logotipo do site. Você não seria capaz de alterar ou substituir o logotipo a partir daqui, mas você pode personalizar os visuais e aspectos de design até um certo extinto. Em seguida, é o widget título do site. Também é um assistente dinâmico que exibe o título do site atribuído no personalizador WordPress. E aqui também, você pode ajustar o design e os visuais do título. Próximo assistente é o título da página. Ele exibe o título da página que é atribuído no editor de página WordPress. O próximo é o Menu Nav. É o mesmo que o menu à esquerda que discutimos antes nos dígitos da sonda. Em seguida é o widget de formulário de pesquisa. Ele ajuda na adição de uma barra de pesquisa em qualquer lugar do site. Em seguida, é o sitemap, que ele cria um sitemap SML estruturado, organizado e acessível do site, que fornece aos visitantes e motores de busca e fácil acesso com um clique para a lista de páginas no site . Em seguida, você receberá um widget para a migalha de pão Yoast SEO. Aqui você pode inserir as migalhas de pão na página da web. A propósito, o que é uma migalha de pão? É um tipo de esquema de navegação secundária que revela a localização do usuário em um site. Você deve ter visto isso em uma loja de e-commerce como esta. Sim, este é um breadcrumb e você pode adicioná-lo usando Yoast SEO plugin, que é muito útil para as configurações de SEO na página da página da web. Tudo bem, então terminamos com a aplicação de desertos. E eu acredito que todos esses elementos são básicos, gerais e provam orçamentos são suficientes para desenvolver a página web interativa que envolve o visitante e proporciona uma boa experiência de usuário. Eu quero que você passe um bom tempo praticando todos esses orçamentos um por um para todas as opções de configuração que estão disponíveis para cada widget. Vamos, tire um tempo e continue praticando. E ainda assim, se você precisa de mais alguns widgets para melhorar as capacidades de design do Elementor do que há muitos plugins de terceiros que lhe ofereceram mais widgets para adicionar o elemento de sua escolha. Se você deseja explorar, eu recomendo usar o plugin definido por blocos Grochow. Isso é muito bom para aumentar o poder do Elementor. Mas eu não vou recomendar o uso de mais plug-ins no site, pois pode diminuir a velocidade de carregamento e alguns dos elementos livres ou add-ons muitas vezes dão dinheiro levando a erros na página web. Portanto, tenha um pouco de cuidado ao escolher o conjunto certo de elementos complementares para o Elementor. E o mais importante, essas visitas são de nenhuma utilidade até que e a menos que você as aplique para desenvolver o design das páginas da web que está pronto na ferramenta de design, você tem que usar esses widgets gerais básicos e provar para desenvolver toda a web que você já criou no Figma ou no Adobe XD. Simplesmente saber sobre o funcionamento desses widgets não ajudará. Você tem que aplicar o conhecimento. Então vá em frente, use todas essas seções, colunas e visitas para completar o desenvolvimento de todas as páginas do site de acordo com o design que você criou no design. Bom. Tudo bem, é isso para aprender nesta lição e vamos continuar no próximo vídeo. 37. Como configurar o menu: Agora, você sabe como desenvolver uma página web usando o elemento ou widgets, e você já tem a lista de páginas da web, não é hora de criar todas as páginas, completar o desenvolvimento e chegar ao menu de navegação. A primeira coisa que você precisa fazer é ir para as configurações de leitura aqui e atribuir a página inicial e página do blog. Selecione a opção de página estática e atribua a página inicial como página inicial e blog como página de publicação. Clique em Salvar alterações. Agora passe o mouse sobre a opção Aparência e selecione o menu. Aqui, você precisa criar um novo menu clicando sobre isso. Dê um nome ao menu. Eu estou chamando de menu primário porque ele vai ser o menu de navegação principal para este site. Nas configurações do menu, você tem a opção de adicionar automaticamente uma nova página a este menu quando criado. Mas geralmente preferimos não fazer isso automaticamente. Você pode adicionar páginas manualmente para o menu de acordo com a exigência. Então deixe desmarcado. Então você tem que escolher o local de exibição. Uma vez que estamos criando o menu primário, selecione o local como menu primário e clique no menu Criar. Você pode adicionar páginas, gabar-se e links personalizados ao menu. Normalmente, você só precisa adicionar as páginas e links personalizados. Sob a opção de páginas, você tem três guias. Visualização mais recente toda a pesquisa de ferro. Você pode clicar em Exibir tudo para obter a lista de todas as páginas que você criou. Agora, selecione as páginas que você deseja adicionar no menu e clique em Adicionar ao menu. Isso irá adicionar as páginas ao menu. E aqui você pode organizar a ordem das páginas. Basta clicar, arrastar, arrastar, arrastar e soltar. A ordem foi alterada. Você pode ajustar facilmente a ordem arrastando e soltando. Agora, como criar é sub-menu. Para criar um submenu, você terá que arrastar o item um pouco, para a direita, e soltar. É isso. Sub item é realçado e agora é um sub-menu. Você pode até criar um submenu de nível mais profundo arrastando o item mais logo abaixo do item de submenu como este. Uma vez que você é feito com o pedido, clique no menu Salvar para atualizar e publicar. Em seguida, é o conceito de comprimentos personalizados. Usamos um link personalizado para criar uma opção de menu que pode ter um link externo levando a alguma outra página da Web ou para destacar um pop-up ou apenas um link vazio para organizar os processos do menu de navegação. Muito simples. Basta dar um título ao link ou inserir o URL. É isso. Se você quiser atribuir um link em branco, insira um símbolo de hashtag. Há uma coisa muito importante aqui na configuração do menu. Se você quiser abrir um link em uma nova guia, como fazê-lo, então? Não vejo nenhuma opção aqui. Está bem. Então, quantos de vocês já exploraram as opções de tela para cada opção de configuração em WordPress admin, área, salão, certo? Então aqui estão as opções de tela para obter a opção de fazer um link abrir uma nova guia, você tem que ativar a opção indo para as opções de tela. Espero que você tenha entendido agora que é muito importante explorar todas as opções que estão disponíveis em cada cenário. Estes de leste a oeste, de norte a sul. Passe algum tempo explorando a área de administração do WordPress. Você vai gostar. Outra coisa aqui, você pode criar vários menus para usar em diferentes locais, como em um rodapé ou em alguma parte da página da Web. Assim, os processos parecem, ir em frente e começar a fazer os menus de acordo com a exigência. E para personalizar o estilo deste menu, não aprendemos as configurações de cabeçalho e rodapé no próximo vídeo. Vejo você lá. 38. Personalizar o cabeçalho e Footer: Aprendemos como desenvolver as páginas web usando o Elementor, e agora é hora de aprender a editar o cabeçalho e rodapé do site. Tenha em mente que o cabeçalho e o rodapé permanecem os mesmos para todo o site. Assim, para editar o cabeçalho e rodapé, você pode fazer uso das configurações da equipe ou como cabeçalho personalizado criativo usando o recurso de construtor de equipe disponível no Elementor Pro. Vamos aprender as opções da equipe primeiro como dados disponíveis gratuitamente através do uso da equipe Astra. E ele nos fornece algumas excelentes características e flexibilidade para projetar o cabeçalho e rodapé. Basta passar o mouse sobre a opção Aparência e clicar em Personalizar. Este é o lugar onde você pode gerenciar as configurações da equipe para diferentes opções, como valores globais, cabeçalho, breadcrumb, barra lateral e rodapé. Nosso desktop, você encontrará o nome da equipe ativa que estamos usando. A primeira opção disponível para nós é a configuração global para tipografia, cores, espaçamento e botões. Não precisamos usar isso porque já fizemos as configurações necessárias no Elementor. Mas se quisermos usar as configurações da equipe, você pode atribuir os valores aqui. Vamos voltar e a próxima opção é o construtor de cabeçalho. Isso é o que precisamos nos concentrar no Personalizador de Temas. Ele tem a mesma funcionalidade como Elementor, e você pode facilmente atribuir o vértice para o cabeçalho primário acima e abaixo cabeçalho. Vamos vê-los um por um. O primeiro e o mais importante é o cabeçalho primário. Você pode ajustar a altura do cabeçalho e, na guia Design, você pode gerenciar o peso e a cor da borda inferior. Em seguida, você pode alterar a cor de fundo de acordo com o esquema de design do site. E então você pode gerenciar o espaçamento através de configurações de preenchimento e margem. Então é totalmente personalizável. Para ver a lista de widgets disponíveis. Clique no ícone mais e v gate, um número decente de widgets elementares como conta, em seguida, HTML, logotipo, menu primário, menu secundário, barra de pesquisa, ícones sociais e widgets personalizados. Você pode facilmente desenvolver o cabeçalho usando esses vídeos. Quanto ao design declarado significou, vamos colocar um logotipo à esquerda do cabeçalho primário. Você pode gerenciar essas configurações do logotipo no painel de edição esquerdo. Estas são as mesmas configurações, como escolher a imagem para o logotipo, alterar o título do site, eu estou escolhendo o site Eigen ou ícone fav. Em seguida, na guia Design, você pode gerenciar a tipografia para Site Title, Act, gerenciar o espaçamento. Em seguida, vamos inserir o menu primário no lado direito. Clique nele e as configurações serão abertas no painel esquerdo. Você pode até gerenciar as configurações do menu a partir daqui que aprendemos na lição anterior. Crie um menu, edite o menu ou altere-os em novos locais. Você pode gerenciá-lo muito facilmente. Agora, abaixo disso, você pode gerenciar o sub-menu trabalhado e animação de contêiner, juntamente com uma opção para habilitar item dividido. Na guia Design, você pode escolher a mão de estilo Harvard menu. Estes são realmente bons para usar. Você encontrará mais algumas configurações e aludidas ao contêiner do sub-menu, as configurações de cor para os links do menu sob o modo normal e ativo, configurações de hidrografia, espaçamento do menu e margem. Tudo pode ser personalizado de acordo com o requisito de design. Em seguida, você pode adicionar um botão e projetá-lo usando as opções de edição. Tenho certeza de que agora você pode gerenciar essas cores gerais, tipografia e configurações de espaçamento para desenvolver o elemento. De acordo com o departamento de design. Normalmente, mantemos apenas esses widgets no cabeçalho primário. Você fez ele colocou o botão com ícones sociais e você pode até mesmo fazer uso da seção de cabeçalho acima. Vamos colocar os ícones sociais aqui à direita. Na seção de carboidratos. Você pode gerenciar as configurações genitais e de design para personalizar os visuais. By the way, você pode gerenciar a altura, cores e espaçamento para o cabeçalho acima também. Sinta-se livre para adicionar os widgets necessários aqui ou na seção de cabeçalho abaixo. Bem, mais uma característica que temos na equipe Astra livre é aquele cabeçalho transparente. Sim, é muito boa. Na antena do transmissor. A seção de heróis começa diretamente do topo da praia e o cabeçalho é colocado acima da seção de heróis, que dá uma aparência moderna ao site. Clique em Ativar no lado Completo e as opções serão abertas. Você pode desabilitar o cabeçalho transparente em determinadas páginas de publicação AMP, se necessário. Você também pode optar por habilitar o cabeçalho transparente tanto no desktop quanto no celular, ou no desktop e somente no celular. Você pode até mesmo usar um logotipo diferente para o transparente dela morta, se necessário. Na guia Design, você pode ajustar a borda inferior, sobreposição de fundo colorida e as configurações de cor para o menu e outras opções de cabeçalho. Mas tenha muito cuidado com as configurações de cor usando um cabeçalho transparente porque a seção herói irá atuar como o plano de fundo. E então você precisa escolher o esquema de cores com o contraste certo para manter a visibilidade adequada dos links. Clique em Publicar aqui na parte superior para salvar vt, ainda não acabou. Quando você altera o estado do dispositivo para celular, você obtém mais alguns widgets, como o botão de alternância, seção Andy off Canvas. Você pode personalizar o botão de alternância para o campo glucagon. E nas configurações desativadas do Canvas, você pode escolher entre os diferentes estilos de aparência, posição e alinhamento do Canvas. Você pode ajustar as cores na guia Design. Se você deseja adicionar mais widgets na seção Off Canvas, clique no ícone de adição e selecione os widgets necessários. Assim, desta forma, você pode personalizar o design do cabeçalho usando o Astra Theme Settings. E devo ver que essas configurações são bastante poderosas. Uma vez feito, clique em Publicar e lexico volta. Agora, a próxima opção no personalizador é habilitar as migalhas de pão, se necessário. Em seguida, temos Configurações e aludido ao blog e aos alunos vívidos nos próximos vídeos. Então vamos pular aqui. Próxima opção é gerenciar o site BOD, e é mais de vidro gerenciado no nível de página em si. Então vamos deixar uma criança. O próximo é o construtor de rodapé. Isto é importante. Assim como Ve criou o cabeçalho, agora podemos facilmente desenvolver o rodapé também. Aqui também, você obtém o rodapé primário e acima rodapé e uma seção de rodapé abaixo. Clique nas configurações de rodapé principal e você pode gerenciar o número de colunas, layout, largura e alinhamento. E na guia Design, você pode gerenciar as cores e o espaçamento. Mesmo para a seção de rodapé acima e abaixo também. Agora clique no ícone de adição para adicionar os widgets ao rodapé. E acredito que agora é uma tarefa fácil desenvolvê-lo. Então você tem alguns widgets vazios e vamos ver o que tudo você pode fazer isso então. Vamos começar com o número 1. Aqui, à esquerda. Nas configurações, você pode atribuir uma visita a esta seção de visita a partir de uma lista de opções. Você pode escolher entre arquivo, reprodutor de áudio, categorias de calendário, clientes, DML, responsabilidade de seções seguras, galeria emergir, modelagens, menu de navegação, lista de páginas, comentários recentes postar feeds RSS, um formulário de pesquisa, backload, ext ou um vídeo. Bem, algumas dessas opções de visita estão desatualizadas, mas ainda assim você pode usar o texto e a imagem e projetar o widget personalizado. Descanse todos os widgets importantes como as versões sociais, o menu de rodapé e a tag de direitos autorais já estão disponíveis para uso. Você pode relaxar, pois a tag de direitos autorais contém o código curto para atualizar automaticamente o ano. Assim, você pode projetar o filtro com uma interface simples de arrastar e soltar. E não se esqueça de otimizar a pasta para dispositivos móveis e tablets também. Tenha também em mente que o cabeçalho e rodapé permanecerão os mesmos para todo o site. Então projete-o de acordo. E todas estas são as Astra Theme Settings para o cabeçalho e o rodapé. Agora, deixe-me dizer-lhe outra maneira simples criar o cabeçalho e rodapé para o site usando um elemento gôndolas plugin livre fora da cabeça que pés e blocos modelo por força brainstorm. Vamos instalar rapidamente este plugin e aqui e que aparência dada encontrar as configurações para este plugin. Clique nele. Agora clique em adicionar novo. Este vai ser um layout personalizado, será injetado para o tema. Dê a este layout o nosso título. Agora, a partir do tipo de modelo, selecione a pasta. Em seguida, selecione para exibir em todo o site. Agora clique em Editar com Elementor. Aqui, você pode projetar o rodapé usando as colunas de seção, ang widgets fornecidos pelo elemento ímpar. Sim, da mesma forma que você desenvolve uma página web. Este método pode ser mais conveniente para você, já que você já está confortável usando o elemento ou widgets. O rodapé agora pode ser facilmente desenvolvido de acordo com o requisito de design. E quando você nem faz a área de widgets, você vai achar que este plugin adicionou mais alguns widgets que são de uso para criar um cabeçalho e rodapé. Então você pode utilizar o poder do Elementor aqui e criar um maravilhoso filtrado usando este plugin gratuito. By the way, você pode criar um cabeçalho seguindo o mesmo processo. Basta criar um novo layout personalizado e selecionar o tipo como cabeçalho e exibido em todo o site. Agora, projetado o cabeçalho usando os elementos DOD widgets têm liberal no painel esquerdo. Faça uso dos blogs e widgets de rodapé de cabeçalho para tornar a tarefa fácil e suave. Vamos, vá em frente e tente isso. Projetando seu primeiro cabeçalho e rodapé fonte de fatores site. Portanto, estas são as opções gratuitas de equipe e plug-in que podemos usar para personalizar o cabeçalho e rodapé. E se você deseja obter algumas opções avançadas de design de cabeçalho e rodapé, então você precisa se inscrever para os pagos como o Astra Pro ou Elementor Pro. Astra Pro é uma extinção da equipe Astra. Para melhorar as capacidades da versão gratuita. Usando isso, você será capaz de criar cabeçalhos avançados como um cabeçalho pegajoso ou um mega menu. Um cabeçalho pegajoso é aquele que adere ao topo da tela quando uma escola visitante pedra a página web, é um bom para usar, pois fornece acesso rápido ao menu de navegação sem ter que rolar para cima novamente e novamente. No próximo ano. O recurso avançado é um mega menu. É uma forma organizada de um menu grande, ou você pode ver uma forma visual do menu. Também é bastante eficaz em termos de impacto e interface do usuário. Estas são as duas principais vantagens de usar Astrup true para faturamento Cabeçalho e Rodapé. Além disso, você obtém alguns outros recursos relacionados a configurações de epigrafia, gerenciamento de layout para um único post e blogger deu discurso Andy opção para nossos layouts personalizados no site, o que basicamente significa injetando códigos HTML personalizados em diferentes partes do site e páginas da web. Que regras personalizadas de inclusão e exclusão. Os layouts personalizados são úteis quando você tem que integrar seu site com outras ferramentas como o Google Tag Manager ou pixel do facebook. No geral, é um bom para se inscrever, mas temos outra opção premium para criar o cabeçalho e rodapé e morreu este Elementor através. Bem, Elementor não é apenas um construtor de praia, é um construtor de equipe muito poderoso e um construtor de página de destino com poderosas opções de personalização. Usando isso, você pode facilmente projetar um rodapé de cabeçalho personalizado, página de publicação única, modelo página de arquivo de blog, pesquisas e fala e editar 400 quatro páginas. Você também tem acesso a uma enorme responsabilidade de modelos para o cabeçalho não filtrado. E você pode importar esses designs com apenas um clique. Bem, há tantos recursos e benefícios de usar o Elementor Pro, mas nesta lição, vamos nos concentrar em classificar o cabeçalho e o rodapé. Somente. O processo de classificação do alimento com iodo ou usar o Elementor Pro é quase o mesmo que a edição da página. Você pode clicar em, Adicionar novo sob as opções de construtor de equipe, selecione um tipo de modelo como haggard, dar-lhe um nome e clique em Criar. Você pode selecionar os Modelos aqui para economizar tempo ou azul definido para construir do zero. Agora, assim como o plugin blocos de rodapé cabeçalho, você pode criar uma seção, usar os widgets do site e outros elementos ou widgets para criar um cabeçalho personalizado impressionante para o site. Como você já sabe, você pode personalizar cada parte da seção e agradar os widgets desejados para desenvolver o cabeçalho, Asperger projetou um glutamato. Você também pode colar o cabeçalho usando a opção stick e ajustar as margens negativas para gerenciar o efeito de cabeçalho transparente. Você também obtém algumas opções de ponteiro para realçar o menu no Elementor Pro. E você também pode criar e acima heterossexual e abaixo seção de cabeçalho. Uma vez feito, clique em Publicar, clique em Adicionar condição. Você pode mencionar suas regras de exibição, se necessário. Como geralmente escondemos o cabeçalho e rodapé nas páginas de destino. Uma vez feito, clique em Salvar e Fechar. É isso. Um cabeçalho totalmente personalizado é criado para o site. Em seguida, para criar o rodapé, os processos parecem. Crie um novo layout, selecione pasta, atribua um nome, projete-o, atribua a condição e salve. É isso. Se quiser em mente que ao projetar a barra de rodapé, certifique-se de usar a tag dinâmica de data atual para o ano de direitos autorais para atualizar automaticamente no deserto de alimentos. E mais uma coisa, se você deseja criar mais avançado para mega menu para algum site, então há um poderoso plugin chamado nós injetar menu por blocos Grupo. É um grande, mas você pode usá-lo para criar um super incrível mega menu para o site. Como eu disse, você pode personalizar o design do site da maneira que você imaginar. E isso também, sem qualquer codificação. Então, basta ir em frente e projetar o site na ferramenta de design e construí-lo com o Elementor usando a técnica de arrastar e soltar simples. É isso para aprender nesta lição e vamos continuar no próximo vídeo. 39. Fundamentos de um site no blog: Então, você realmente quer se tornar um blogueiro de sucesso? Não há um blog pessoal que você queira escrever ou é para apoiar o site de negócios ou loja de e-commerce? Seja qual for o propósito. Os conceitos que aprenderemos nesta lição são aplicáveis tanto a um site dedicado para blogs ou a um blog para apoiar o site de negócios. Normalmente, criamos um blog para fornecer conteúdo novo, único, informativo e envolvente aos seus visitantes. Como o conteúdo que publicamos em um site de negócios é estático e não muda, precisamos ter uma seção de blog no site para continuar fornecendo o conteúdo de atualização para que o visitante seja tentado a visitar o site novamente e novamente para a nova informação, um blog é uma fonte muito boa de tráfego e os visitantes repetidos no site. Portanto, certifique-se de seguir os conceitos para configurar um blog para apoiar o site de negócios ou configurar um site dedicado para blogs. Você pode facilmente configurar um blog seguindo apenas alguns passos simples. Desde agora você já sabe os passos para comprar um nome de domínio, comprar um plano de hospedagem e instalar o WordPress. Você também sabe como instalar os temas e plugins. E temas e plugins são de uso para você. Agora, você tem que selecionar a opção Add New vangloriar aqui, dar um título para a postagem do blog e começar a escrever. É isso. Não aprendemos mais sobre o design da página de arquivo de blog e o design de postagem única nos próximos vídeos. E neste vídeo, deixe-me dizer-lhe alguns conceitos fundamentais de se tornar um blogueiro de sucesso. O primeiro passo é selecionar os tópicos certos para o bloco. Tudo começa com a pesquisa tópico em sua indústria são nicho. Para isso, eu recomendo que você se mantenha atualizado nas mídias sociais e faça uso de ferramentas como bebidas do Google ou explorar tópicos. Você também pode se manter atualizado com Reddit ou Cora para apresentar as últimas discussões sobre consumidores, impressionado e perguntas. Você também pode usar ferramentas como BuzzSumo para chegar a tópicos de tendência. By the way, o que um blog postar? Uma postagem de blog geralmente é a forma longa de conteúdo. E há uma regra de ouro na indústria de marketing digital que bom conteúdo e grandes visuais juntos criam um grande post de forma longa que é envolvente para o visitante. Então, para escrever uma postagem de blog épica, você tem que fornecer conteúdo informativo que é valioso para o leitor em uma página que é lindamente projetada usando as cores certas, formulários e espaçamento. Você também pode incluir um índice para facilitar o processo de navegação e fazer um uso deliberado de rádios, imagens de dados e infográficos para envolver os visitantes. No entanto, a maior questão para todos que querem começar com blogs é como ganhar dinheiro com um blog. Pode haver várias fontes de receita. Mas se eu disser que duas maneiras principais de ganhar dinheiro são o número um, os anúncios e o número dois, o marketing de afiliados. Os anúncios são geralmente os anúncios de banner exibidos na postagem do blog. E você pode se registrar no Google AdSense para exibir esses anúncios em seu blog. Você pode ganhar dinheiro através de CPC, que é custo por clique. Isso significa que você é pago por cada clique no anúncio em sua postagem de blog. E o outro é CPM, que é o custo por 1000 impressões. Aqui, para cada 1000 impressões do banner, você receberá um certo valor. Em seguida é muito poderosa linha ou faz o marketing afiliado? É o processo de ganhar uma comissão promovendo produtos de outras pessoas. Assim como você deve ter visto blogueiros promovendo serviços de hospedagem como Blue Host n side crescido, e eles fornecem um link para comprar o plano de hospedagem. Quando um leitor clica nesse link e compra os servidores, o blogueiro recebe uma comissão da empresa de hospedagem. Assim, você pode promover os produtos através de texto e adicionar um link rastreável exclusivo que é fornecido a você para o produto. Se um comprador clicar no link e comprar o produto, você receberá uma comissão. Essa é uma fonte muito poderosa de fazer uma renda muito boa, pois é um processo muito emocionante para educar o cliente e promover o produto. Trata-se de uma situação vantajosa para todas as três pessoas envolvidas. Como você tem a oportunidade de criar conteúdo de qualidade e educar o comprador sobre os produtos mais valiosos. O comprador obtém informações completas sobre os recursos e detalhes úteis. Comparação em uma única página. Se o comprador clicar no link e concluir a compra, a empresa recebe receita. Então, em troca de seus esforços, eles lhe pagam uma comissão. Confie em mim, é uma fonte muito poderosa de renda e você pode promover produtos em seu blog muito facilmente compartilhando conteúdo de qualidade, educando os visitantes, e fornecendo links na forma de texto e banners. Para ganhar dinheiro através de blogs, você precisa de tráfego no site. Então, como obter tráfego? Esta é uma pergunta de 1 milhão de dólares. Vamos discutir algumas maneiras de obter mais visitantes para o blog. A maneira simples de garantir que as pessoas visitem seu blog é certificar-se de que eles estão cientes de que seu blog existe. Você pode promover seu blog nas mídias sociais ou através anúncios pagos em motores de busca e mídias sociais, ou otimizar o blog para pesquisa e classificações e algumas outras maneiras. Comecemos pelas redes sociais. interação com as mídias sociais é importante. Você tem um acesso fácil a milhões de pessoas que, por sua vez, podem compartilhar seu post no blog com seus amigos e familiares. Tudo o que você precisa é compartilhar conteúdo de qualidade que seja útil para os leitores e fornecer valor a esse conhecimento. Hora do Ang. Além disso, uma vez que você quer que eles saibam sobre você, você pode facilitar o compartilhamento de seu blog colocando botões relevantes de compartilhamento de mídia social na postagem do blog. Isso aqui é um truque. Vê-se que post de blog entre 100 a 2 mil palavras recebe o mais alto compartilhado nas mídias sociais. Se você vê-lo de outras maneiras, isso pode ser validado porque quanto mais valioso e informativo você fornecer ao visitante, melhor você será engajado e incentivado a compartilhar o conteúdo. Então tentou publicar postagem de blog de forma longa. Você também pode comentar sobre blogs relacionados. A chave para esta estratégia é certificar-se de que o seu comentário realmente adicionar algo de valor ao post. Funciona bem quando você está apenas começando. E até mesmo o menor número de tráfego é de valor para você. Em seguida, são os anúncios pagos. Os anúncios pagos não são os métodos mais baratos, mas às vezes é a maneira mais direta de obter o tráfego inicial. Comece a exibir anúncios pagos e certifique-se de que as pessoas vejam o seu blog quando pesquisarem determinados termos e navegarem determinados tópicos, e não se esqueça de criar a lista de e-mails colocando um formulário de assinante no blog, você sempre desejará que repetem os visitantes no blog. As campanhas de email marketing podem ser um lembrete consistente do seu blog. Basta preparar um boletim informativo, enviá-lo para os assinantes, e em breve você verá um grande aumento no número de visitantes repetidos. Agora, você deve estar se perguntando quão importante é SEO ou otimização do mecanismo de busca para obter tráfego. Sim, essa é a fonte de tráfego mais valiosa para um blog. Então, o que é SEO? É a ciência de garantir que seu conteúdo é visível primeiro em uma página de resultados do mecanismo de pesquisa e via CEO. Como as pessoas tendem a escolher os melhores resultados, alto você for, maisalto você for,maior a probabilidade de eles clicarem no link do seu blog. E se você quiser saber quantas pessoas estão procurando as palavras-chave relacionadas ao seu blog. Crie uma conta gratuita do Google Ads para o Planejador de palavras-chave e explore o volume de pesquisa de palavras-chave nos diferentes países. Isso lhe dará uma idéia melhor sobre o volume de pesquisa e o provável tráfego que você pode obter no blog. E se eu lhe contar algumas dicas simples para otimizar o blog para SEO, ele vai começar com a pesquisa de palavra-chave apenas. Você tem que criar uma lista de palavras-chave que as pessoas estão pesquisando relacionadas ao tópico da postagem do blog que você está escrevendo. Você também pode criar a lista de alto volume e palavras-chave potenciais em seu nicho na indústria e escrever um post de blog relacionado a esses tópicos. Você tem que se certificar de que você usar essas palavras-chave no conteúdo, nos títulos, nos parágrafos, e usá-lo no natural v. Du incluir a palavra-chave primária no título do post e nas primeiras linhas do corpo de conteúdo. Use também palavras-chave relacionadas e não tente fazer enchimento de palavra-chave. Mantenha apenas a densidade de palavra-chave apropriada. Você também pode usar termos LSA no conteúdo para torná-lo mais relevante. A seguir é otimizar os títulos do Meta e as descrições do Meta. Estes são os títulos e descrições que um visitante vê no discurso dos resultados do mecanismo de pesquisa. Você precisa se certificar de que inclui a palavra-chave primária no título e na descrição. Aqui, você precisa explicar o que o seu blog é sobre e torná-lo atraente e valioso para o leitor para que DEA, tentado a clicar nele. Você pode facilmente atribuir os títulos Meta e Meta descrições usando o plugin SEO usado para WordPress. Você encontrará as configurações para Yoast SEO em cada post ou página da web. Em seguida, fator muito importante para o blog SEO é a experiência do usuário. Ele é afetado por vários fatores como o design e layout do blog, navegação, velocidade de carregamento e capacidade de resposta. próximo fator é analisar os concorrentes e manter uma verificação nos concorrentes de topo e tentou entender o que eles estão fazendo melhor, você pode obter inspiração e idéias dos concorrentes. O último fator universal para o sucesso no blog é entregar valor. Seja qual for o conteúdo que você publicar, seja no site ou no blog, ele deve entregar valor visitante que é o eterno, mas para o sucesso. você também pode redefinir o conteúdo, como se você tiver uma postagem de blog popular, transformá-la em um vídeo do YouTube ou um episódio de podcast, apresentação ou info-gráficos. Porque é validado que o tópico e o conteúdo ressoa bem com as pessoas. Mais uma coisa aqui, você pode compartilhar seu post no Reddit e Quora como mundo e tentar fazer uso das mídias sociais tanto quanto você pode. Então é isso para aprender nesta lição, e vamos continuar com mais configurações de bloqueio no próximo vídeo. 40. Configurações do post único: Nesta lição, vamos aprender como criar uma postagem de blog e como projetar a página de publicação única para criar uma nova postagem, mouse sobre a opção de postagem e clique em adicionar novo. É o mesmo processo que criar uma nova página. Você pode atribuir um título para a postagem e deixe-nos ver as configurações à direita. Primeiro é o status e a visibilidade. Aqui as opções são as mesmas e você tem uma opção adicional para colar uma postagem no topo do blog, como uma postagem em destaque. Em seguida, você pode editar o permalink ou URL. Isso pode ser editado depois de publicar o post também. Em seguida, você pode adicionar categorias e tags. Faça este post. Agora, categorias e tags são muito importantes do ponto de vista do blog. Deixe-me explicar por que categorias e tags ajudam na estruturação do conteúdo. Categorias, ajudaram a agrupar amplamente os tópicos da postagem, enquanto o imposto ajudou a descrever a postagem com mais detalhes. Em suma, as categorias são o método mais geral de agrupamento de conteúdo em um site WordPress. Uma categoria simboliza um tópico ou um grupo de tópicos que estão conectados uns aos outros de alguma forma. Às vezes, um post pode pertencer a muitas categorias ao mesmo tempo. No entanto, talvez não seja a melhor ideia atribuir mais de duas ou três categorias a um post. O ponto aqui é ter seu conteúdo ordenadamente organizado de uma forma que torne o acesso mais fácil para o leitor. Por exemplo, um blog de marketing digital pode ter categorias como marketing de conteúdo, SEO, marketing de mídia social, web analytics, design e placa. Por outro lado, as tags são usadas para identificar um pedaço de conteúdo por algumas palavras-chave específicas. Basta escolher algumas palavras que descrevam um determinado post da melhor maneira possível. A principal diferença entre categorias e tags é a maneira como você as usa. As categorias são destinadas a indicar o janeiro do post. E as tags, por outro lado, vão muito mais em profundidade e indicam as coisas individuais sobre as quais o post fala. Portanto, você pode usar várias tags com uma única postagem de blog. Tenha em mente que categorias e tags são representadas pelo termo taxonomias no Wordpress. Em seguida, você pode adicionar uma imagem em destaque. E é muito importante porque age como uma miniatura na página de arquivo do blog. Em seguida, você pode inserir um post exert, que é basicamente um resumo da postagem do blog e geralmente é visível na página do arquivo de pôsteres. Se o trecho estiver vazio, WordPress cria automaticamente um trecho usando as primeiras 55 palavras do post. As próximas opções funcionam da mesma forma que para uma página. Agora, projetar a página de publicação única é uma tarefa fácil como você pode usar Elementor para projetar a página de acordo com sua exigência. No entanto, existem algumas configurações relacionadas à estrutura de uma única página de postagem, o que não é tão fácil com uma equipe livre como Astra. Para personalizá-lo, precisamos ir para o personalizador da opção Aparência, selecione a opção de blog aqui e selecione Single Post head. Você pode modificar a estrutura da publicação única usando as configurações do tema. No entanto, existem opções muito limitadas para personalizar a estrutura do único post. Aqui, você será capaz de ajustar o vert e gerenciar a ordem de estruturados e metadados da página de postagem única juntamente com as configurações de topografia. É isso. E se você usar Astra Pro, então você vai ter um pouco mais opções como ativar ou desativar as informações do autor, carregar automaticamente post anterior, ajustar o tamanho do recurso para mesclar a cor do título e espaçamento do recipiente. Mas ainda assim, você não é capaz de personalizar a posição da imagem em destaque, e layouts, como vemos no post do blog dos dias modernos. Portanto, estas são as opções limitadas que você começa para personalizar a aparência da postagem de sinal usando as configurações do tema. Por outro lado, se estivermos usando o Elementor Pro, você terá mais flexibilidade para projetar o layout de postagem única. Vamos ver como você pode projetar um único post com o Elementor Pro. Uma coisa aqui, antes de criar um elemento ou modelo para um único post, certifique-se de publicar pelo menos um post de blog no site. Passou o mouse sobre modelos opção e selecione construtor de equipe ou então simplesmente clique em Adicionar novo e selecione Single Post como o tipo de modelo. Dê um nome aqui e clique em Criar. Agora, você terá uma opção para suco de algum modelo pré-projetado. E estes são alguns layouts atualizados muito bonitos que você pode importar facilmente. Então, basta clicar em Inserir e ele estará disponível para edição. E se você deseja criar um modelo do zero, você definitivamente pode fechar a biblioteca e começar a projetar o layout. A estrutura básica de um bloco consiste na seção principal que mostra a imagem em destaque, título da postagem, autor, NFO e metadados como data, tags e categorias. Certifique-se de que você tem uma postagem de blog publicada antes de criar este modelo. Agora, clique no ícone Visualizar aqui. O Ivan, e clique em Configurações. Nas configurações de visualização, selecione Visualizar conteúdo dinâmico como postagem e digite o título da postagem a ser selecionado. Clique em Aplicar e pré-visualizar. Agora, aqui vamos começar a projetar o post a partir do zero, usando seções, colunas, organizando o conteúdo no design necessário, fazendo uso das visitas de post dedicadas como título do post, que irá buscar o título do post a partir do que selecionado para nos dar uma pré-visualização ao criar o modelo e outros. Você é livre para projetar o modelo de cartaz como se exigência de design usando os widgets e uma vez feito, clique em Publicar, adicione a condição para incluí-lo no post, e, finalmente, clique em Salvar. O modelo de publicação é criado e agora sempre que você criar uma nova publicação única, ele será exibido neste formato. Você pode criar modelos separados para categorias e autores, se necessário. Elementor construtor tema é muito poderoso e dá-lhe muitas opções para personalizar a aparência e sensação sem qualquer codificação. Uma vez que o modelo está completo, precisamos nos concentrar em projetar o conteúdo do único post. Então vamos agora discutir algumas idéias de design tendências para projetar a página de publicação única. O primeiro é fazer uso de Bonés de Broca. Você pode fazer isso muito facilmente no Elementor. Selecione as tags de número de desvanecimento do editor de texto e selecione a opção de capitular aqui na parte inferior. É isso. É uma boa maneira de iniciar o conteúdo da postagem. Em seguida é usar a borda colorida. Na verdade, uma borda colorida singular. Ele fornece ênfase e é ótimo para usar para citações são aspectos particularmente importantes do conteúdo. Você pode inseri-lo usando o assistente de cotação de blocos no Elementor Pro Arte minha classificação de uma borda apenas para a direção esquerda da seção. Você também pode usar o plano de fundo da seção para colocar ênfase em um determinado pedaço de conteúdo. Na verdade, você deve usar um número decente de imagens e vídeos no conteúdo do corpo, pois aumenta o envolvimento do visitante. E também sabemos que o post, que está na forma longa, que é entre 100 a 2 mil palavras, que proporciona o melhor desempenho e o melhor engajamento para o visitante. Portanto, certifique-se de incluir as imagens, vídeos, infográficos em sua postagem e criar um conteúdo envolvente e de alta qualidade para o visitante. Você também pode usar sombras de imagem para estilizar a página do blog. Isso pode ser feito sob as configurações de estilo do widget de imagem. Em seguida é fazer uso do texto estrela logo abaixo do título principal do post é usado para dar um início enfatizado para o blog. Basta inserir um título abaixo do título. Em seguida, é destacar os subtítulos para parecer criativo e destacado. É útil para quebrar a monotonia da leitura do convento. Faça com que pareça criativo adicionando alguma cor de fundo. Além disso, faça uso de divisores no design de conteúdo usando o widget divisor. próxima opção é escrever um título de postagem de blog sobre uma imagem de fundo. Basta selecionar um fundo de seção e colocar o widget de cabeçalho sobre ele. Próximo. E quase uma opção de estilo obrigatória é usar formulários inscritos no blog. É importante construir uma lista de discussão e atualizar os visitantes sobre os novos acontecimentos, incentivando-os a ler o novo post do blog e visitar seu blog repetidamente. Isso pode ser feito facilmente usando o Wizard of label da empresa no Elementor Pro. Próximos 10. Outro importante é ter duas ações no post design, torná-lo atraente para que você obtenha melhores conversões. Há até mesmo um orçamento dedicado para projetar chamadas para ações e Elementor Pro. A seguir é incluir botões de compartilhamento social para que um visitante possa facilmente compartilhar o blog com esta comunidade. Isso pode ser feito facilmente usando o orçamento de compartilhamento social disponível no Elementor Pro. Outro fator a considerar para a facilidade de navegação e SEO ponto de vista é criar links internos no conteúdo do corpo. Você pode facilmente adicionar links para os textos no editor de texto e ajustar as configurações para abri-lo na mesma janela ou em uma nova guia. Por fim, sempre inclua a seção de postagem relacionada no final da postagem do blog. Isso pode ser feito criando uma nova seção e adicionando um cabeçalho e subtítulo. Em seguida, coloque o assistente de layout de postagem e selecione as configurações personalizadas para modificar a aparência da postagem. Então, estas são as dicas e as idéias de design que você pode facilmente implementar ao projetar a postagem do blog. Dito isso para aprender nesta lição. E continuaremos com as configurações da página de arquivo do blog no próximo vídeo. Vejo-te lá. 41. Configurações do arquivo: Depois de começar a escrever postagem de blog e projetar a página de publicação única, você precisa projetar a página de arquivo de blog é a página onde toda a coleção de postagem de blog está listada. A página de arquivamento exibe uma lista de pausadas e serve como catálogo para publicação. Agora, para personalizar a aparência da página postdoc deu, vamos começar com as opções livres têm etiquetado para nós. Vamos para personalizar, selecione Blog, e selecione a arte deu opção. Aqui, você pode ajustar a largura, ordenação estruturada e apenas algumas configurações de Tipografia. É isso. Nenhuma opção de personalização significativa de rótulo no livre como uma equipe. Em seguida, você pode tentar a versão Astra Pro. Aqui você obtém algumas opções para selecionar o layout, número de colunas, gerenciar o espaçamento, habilitar a caixa de data, gerenciar o tamanho do trecho de postagem das cores da imagem em destaque, grafia Paypal, Estou espaçamento. Mas, a fim de personalizar totalmente as mensagens são dadas praia. Você precisa usar o Elementor Pro , seguir os modelos, Agnew, selecionar o nome do dividendo do arquivo e criar. Aqui novamente, você pode importar alguns modelos pré-projetados para economizar tempo ou então você pode começar a criá-lo do zero. Você pode clicar no ícone Visualizar, ir para Configurações, selecionar uma postagem recente como o conteúdo dinâmico para visualizar a página de arquivamento. Os processos mesmo e você pode criar seções e colunas e usar os widgets para projetar esse modelo. Uma vez feito, clique em Publicar, adicione a condição para mostrar em todos os arquivos. É isso. Você projetou uma página de arquivo de post maravilhoso. E criar uma incrível página de arquivo de publicações é importante se você quiser ter um forte impacto sobre o visitado. Então vá em frente, configure o blog para o site de negócios ou comece seu site de blog profissional. É isso para aprender nesta lição e vamos continuar no próximo vídeo. 42. Como criar uma página de terra que converte: No início desta lição, eu quero perguntar a vocês, qual é a diferença entre projetar uma página web geral e projetar uma página de destino? Bem, obviamente haverá diferenças em termos de layout e conteúdo. Mas tenha em mente que a diferença mais significativa está no propósito e na ação. Uma página de destino é a página onde você vende produtos, obtém leads e conversões de portão. As páginas de destino são focadas ações específicas e devem ter uma mensagem clara no conteúdo. O objetivo de uma página de destino é mover os visitantes do site para baixo no funil de vendas. Dependendo da estratégia de vendas, ele pode gerar leads que o feixe de marketing pode nutrir, fazer com que os usuários iniciem um teste gratuito do produto ou convertam visitantes em clientes potenciais que a equipe de vendas pode lançar. Então, vamos tentar entender como você pode chegar a uma página de destino eficaz no mínimo de tempo possível usando o Elementor. O processo de criação é quase o mesmo que uma página da Web regular usando os mesmos widgets, seções e colunas. Mas o que mais importa no ano são os fundamentos de projetar a página de destino. Tenha em mente que você tem apenas sete segundos para impressionar o visitante e converter pedidos, você vai perder um cliente potencial. Então tente projetar a página de destino que tenha uma primeira impressão muito forte. Sinta-se livre para adicionar provas sociais na seção de heróis acima da dobra, se necessário. Sempre lidere com ação em uma página de destino, resolva o problema dos visitantes imediatamente. Você também pode fazer uma oferta. Eles não podem recusar, oferecer-lhes ofertas, em vez de negócios, ofertas tempo limitado ofereceu-lhes descontos se bom modelo de negócio permitir. Mas sempre manter e fator de urgência ou então o visitante pode não tomar a ação. Você também pode educar os visitantes de alguma forma significativa. Não destaque os recursos nos rostos BM agitados para os benefícios que os clientes obterão com sua oferta. E evitar muita informação, precisamos convencê-los a agir, mas não estender o comprimento da página desnecessariamente. Inclua provas sociais, tanto quanto possível e forneça um CTA após cada etapa de mensagens. Você também pode tentar o conceito de agitar problema e solução na seção de conteúdo principal. Comece com os pontos problemáticos ou problemas do cliente e, em seguida, destaque o quão irritante é o problema e, em seguida, P's eles com a solução. Após esta seção, você pode criar sua seção de transição. Ele faz essa transição do problema para a solução dentro oferecido. Coloque o CTA aqui para que o visitante tome medidas. Porque se o visitante está convencido, você precisa dizer-lhe como começar sobre o que fazer em seguida. É isso. Reduza qualquer tipo de complexidade e atrito nos formulários de contato. Tentou criar formas simples com as mensagens claras. Mais importante ainda, certifique-se de que a página de destino esteja otimizada para diferentes dispositivos. Bem, eu rapidamente compartilhei muitos conceitos e fundamentos. Agora, você pode experimentar aplicando esses conceitos ao projetar uma página de aterrissagem. Por exemplo, você pode iniciar uma página com um título e sub-título cativantes juntamente com uma imagem impactante para ter a primeira impressão forte no visitante. Tentou incluir tantas provas sociais quanto possível, ter uma descrição clara com algum elemento oferta e urgência, juntamente com um poderoso CTA. Você pode destacar garantia também se disponível. É isso. Este pode ser o plano de conteúdo para suas páginas de destino. Agora, vamos ver como criar uma página de destino no WordPress usando processos elementais, simples e mesmo. Vamos criar uma nova página, dar-lhe um título. Agora, geralmente precisamos desativar o cabeçalho e rodapé para a página de aterrissagem, pois não fornecemos muitos comprimentos para evitar distração. Então você pode desativá-los no menu Configurações aqui à direita, se o rodapé do cabeçalho são criados usando equipe ou então você pode adicionar regra de exclusão no Elementor Tema Builder ou cabeçalho rodapé blogs plugin para ocultar o cabeçalho e rodapé em a página de destino. Agora, edite a página com o Elementor. O processo de design é o mesmo que uma página web normal. Então, basta usar o elemento ou widgets e projetar a página de destino. Faça uso de chamadas para ações, espumas e temporizador, se necessário. Você também pode fazer uso de animações para enfatizar alguns elementos. E se você quiser acelerar o processo de criação de uma página de destino, você pode usar os modelos pré-projetados que eu rotulei no elemento ou na Biblioteca de modelos. Você pode visualizar os designs e importar a página de destino completa com apenas um clique. Basta fazer as personalizações necessárias em texto e gráficos e sua página de destino estará pronta. Não se esqueça de integrar sua ferramenta de e-mail marketing. Se estivermos usando queimar com o Assistente de formulário para automatizar o processo de marketing por email. Você também pode criar uma biblioteca de referência fazendo capturas de tela de páginas de destino do rótulo em uma variedade de sites e plataformas como Behance, Dribbble e abortos. Essas referências irão ajudá-lo a obter inspiração e idéias. Você também pode explorar as opções de modelo rotuladas em e UE2. Portanto, criar uma página de destino é uma tarefa fácil para nós agora, usando o Elementor. Juntamente com a página de destino, você também deve criar uma página de agradecimento. É a página que carrega quando o visitante envia o formulário? Sim. Depois de enviar o formulário, o visitante será redirecionado para a página de agradecimento para que você possa iniciar o processo de criação de leads. Você também pode colocar as tags de conversão na página de agradecimento para buscar os dados das conversões nos anúncios do Facebook e nos anúncios do Google. O processo de criação e criação da página de agradecimento com o Elementor é o mesmo. Eu acredito que você pode facilmente fazer isso agora. Então é isso para aprender nesta lição. No próximo vídeo, vamos ver dois conceitos muito importantes que estão relacionados à página de destino número um, usando os pop-ups para captura de leads e integração da ferramenta de email marketing com formulários Elementor para automação. Vejo você no próximo vídeo. 43. Ferramentas de Popup e automação: O objetivo principal de uma página de destino é capturar leads e obter convergência. Podemos usar o orçamento de etiqueta da empresa no Elementor Pro e projetar formulários simples e bonitos e muito eficazes que têm campos mínimos, etiquetas limpas e mensagens claras. Mas o que são pop-ups? Um pop-up é uma pequena janela que aparece durante a navegação em um site ou ao clicar em um botão. Pop-ups são úteis porque simplificam esse processo de tomada para o visitante, aumentando a visibilidade da etapa de ação. Então, podemos usar um formulário em linha com o conteúdo simplesmente colocando o objeto ou então podemos atribuir um pop-up no botão CTA. Quando o visitante clicar no botão, uma pequena janela aparecerá e conterá o formulário para capturar o lead. Esta é a primeira coisa. Vamos ver como você pode criar tal pop-up usando Elementor Pro. Vá para modelos, clique em pop-up, dê um nome a ele e clique em Criar. Você pode selecionar alguns pop-ups pré-projetados da biblioteca ou criar um do zero. Vamos criar um a partir do zero. A primeira coisa que você precisa fazer é ajustar as dimensões desta tela pop-up. Para fazer isso, clique em Configurações aqui na parte inferior, e você chegará às configurações pop-up. Aqui, você pode ajustar a largura e a altura. Posicionar habilitar desabilitar o botão sobreposição e fechar. Você também pode atribuir a animação de entrada e saída. Em seguida, venha para a guia de estilo e altere a cor de fundo. Você pode ajustar a opacidade aqui para ter o efeito transparente e mostrar a página de destino em segundo plano. Você também pode usar a sobreposição e personalizar o botão Fechar. Nas configurações avançadas, você pode definir a hora, ativar e desativar a tecla de fechamento, sobreposição ou Escape. As opções são fáceis e acredito que agora você pode gerenciar essas coisas de acordo com a exigência. Agora projetar o pop-up é novamente a mesma coisa. Clique no ícone da grade para voltar ao painel de widgets. Basta inserir uma seção com uma única coluna ou duas colunas e começar a adicionar os widgets de acordo com o design do pop-up. O widget mais importante para usar aqui é a visita do formulário. Configurar os campos de formulário é como de costume, mas certifique-se de adicionar que cola ação pop-up sob a ação após enviar para este pop-up. Assim que um visitante preencher o formulário na janela pop-up, o pop-up será fechado. Agora publicou o pop-up e não adicione qualquer condição ou gatilho. Basta salvar e fechá-lo. Agora venha para a página de destino e abra as configurações para o botão CTA. Aqui na opção de link, clique na opção tags dinâmicas, e selecione pop-up como a ação. Ao clicar neste ícone de chave inglesa, você pode ajustar a ação pop-up para abrir e, em seguida, selecionar o pop-up pesquisando o nome. Uma vez que clique em Atualizar, você criou com sucesso um pop-up com o clique do botão CTA. Há mais uma coisa importante aqui. Idealmente, os visitantes devem redirecionar para a página de agradecimento. Depois de enviar o formulário. Para redirecionamento, Você pode adicionar redirecionamento nas ações após enviar e inserir o URL da página de agradecimento. Assim, quando um visitante clica no botão CTA, aparece um pop-up. O visitante preenche o formulário e, quando ele envia, o pop-up é fechado e o usuário é redirecionado para a página de agradecimento. Na página de agradecimento, você pode iniciar o processo de criação de leads e você também pode colocar as tags de conversão para obter os dados de conversões em anúncios do Facebook e anúncios do Google. Você pode usar o mesmo processo para redirecionamento para cada formulário de captura de lead, seja um formulário embutido ou um formulário pop-up. Bem, temos mais alguns tipos de pop up. O próximo tipo de pop-up que é importante para aprendermos para páginas de destino é o pop-up de intenção de saída. Um pop-up de intenção de saída é acionado quando o visitante move o cursor perto do botão de fechamento ou da barra de endereço do navegador. É usado para reengajar os visitantes antes de partirem. Um pop-up bem cronometrado presentes você segunda oportunidade de se conectar com os visitantes, efetivamente duplicando as chances de convertê-los. Deixe-me explicar o processo. Se um visitante não estiver convencido pelo conteúdo da página de destino, ele moverá o cursor em direção à tag de fechamento. E se você apresentar a eles um anúncio pop-up neste momento com um formulário claro de captura de mensagens e leads. Para dar um segundo pensamento à oferenda. Você pode até mesmo fornecer-lhe alguma oferta adicional para incentivar a conversão. Esse tipo de pop-up que aparece quando um visitante tenta fechar a página é chamado menos VD, o pop-up de intenção de saída. E tenha em mente que será muito importante para a sua página de destino. Se virmos o plano de conteúdo do pop-up intenção de saída, então ele deve ter um título CTA que introduz a oferta, seguido de texto CTA para explicar a oferta, em seguida, o formulário de captura de leads, ele desencorajando nenhuma opção incentivando enviar texto e imagem do botão para capturar a atenção. Um veterano próximo e o tamanho do buffer é preferido para ser tela cheia com o fundo transparente suave. Tenha em mente que esse pop-up aparece e o visitante pretende sair da página de destino sem preencher a empresa de captura de leads. Agora, para criar uma intenção de saída processos pop-up parecem. Você só precisa ajustar o pop de largura, altura, posição e outras configurações. Projete o pop-up. Quanto ao plano de conteúdo, clique em Publicar, adicione uma condição, Judeu singular. Em seguida, escolha páginas e pesquise o título da página de destino. Portanto, este pop-up só será exibido nesta página de aterrissagem. Clique em Avançar, e teremos opções para escolher o gatilho. Queremos acionar o pop-up na intenção da saída. Portanto, habilite a opção na intenção de saída da página. Clique em Avançar e você terá mais configurações para personalizar o gatilho fora do pop-up ang, segmentação. Clique em Salvar e Fechar. É isso. Você criou o pop-up de intenção de saída para a captura de Lee. Bem, existem outros tipos de ervas pop que são acionados com base no tempo ou atividade de rolagem ou barras opt-in ou pop-ups interagindo. Embora estes não são recomendados para a página de destino, mas você pode definitivamente usar qualquer um dos pop-up em qualquer página do site de acordo com o design e estratégia. E o processo para criar um pop-up é quase o mesmo. Você pode simplesmente atribuir as condições e acionado de acordo com o tipo pop-up. É isso. Agora, a próxima coisa que temos que aprender é o processo de automação de e-mail. Vou dar-lhe uma visão geral rápida deste processo. Uma vez que um visitante preenche o formulário de captura de leads, seus detalhes serão recebidos no e-mail. Mas também queremos colocar seus detalhes na lista de público-alvo da nossa ferramenta de email marketing. Ao adicionar o visitante na ferramenta de e-mail marketing, você pode enviar-lhes um e-mail automatizado logo após o envio do formulário e até mesmo enviar-lhes uma série de e-mails de acordo com a sequência de e-mail de automação. Bem, isso pode ser feito muito facilmente usando os formulários Elementor. Você pode integrar os formulários elementais com algumas das ferramentas populares de e-mail marketing como Mailchimp, convertido, gotejamento, campanha ativa, GetResponse ou me luz LED. O processo é simples. Você precisa integrar a ferramenta de e-mail marketing com elemento ou indo para as configurações do Elementor, integrações e adicionando a chave de API. Você pode encontrar a chave de API na ferramenta de e-mail marketing e adicionar as configurações de elemento ou integração e, em seguida, clicar em validar. Agora, você pode definir uma ação após a cúpula como Mailchimp, por exemplo, e selecionar a lista de públicos-alvo. Assim, sempre que um visitante preenche o formulário de captura de leads tem detalhes são adicionados à lista de públicos-alvo do Mailchimp. E você pode automatizar o processo de envio de e-mails criando uma sequência de e-mail. Você é livre para escolher a ferramenta de email marketing necessária acordo com as necessidades de recursos e seu orçamento. Mailchimp é amplamente utilizado converter bom como preferido por blogueiros e criadores. File Miller Lite é o mais econômico, mas com um conjunto muito bom de recursos. Depende de sua necessidade, mas certifique-se de usar o processo de automação de e-mail para nutrir os leads. E VonMar dizendo, se você quiser usar alguma ferramenta de e-mail marketing que não está disponível para integração direta com formulários Elementor, então você pode usar Zapier e criar o processo de automação. Sinta-se livre para explorar Zapier. É uma ferramenta muito poderosa. Com isso, gostaria de terminar esta lição e continuaremos no próximo vídeo. 44. Integração no Google Tag Manager: Avançando no curso, você precisa conectar o site com outras ferramentas de análise e marketing, como Google e Facebook. Então vamos começar a integração com os produtos do Google primeiro. Nesta aula, nós vamos aprender como você pode implementar o Gerenciador de tags do Google no site. By the way, eleitores Google Tag Manager. Para entender isso, vamos primeiro entender para testes de uma tag. Agora, esta tag é diferente da que aprendemos na seção de blogs. Bem, trechos de código Taxol que são adicionados a um site para coletar informações e enviá-lo para ferramentas de análise e rastreamento. Você pode usar tags para uma variedade de fins, como rastreamento de rolagem, monitoramento de formulários em missões, realização de pesquisas, geração de mapas de calor, remarketing e redirecionamento de campanhas ou rastreamento de como as pessoas chegam ao seu site. Eles também são usados para monitorar eventos específicos, como downloads de arquivos, lagos em determinados links ou itens que estão sendo removidos de um carrinho de compras. Bem, isso foi um pouco do lado técnico, mas todos sabemos que esses dados são muito importantes para o sucesso digital. Então, para tornar essa tarefa de adicionar tags fácil para você, há um Gerenciador de tags do Google. Google Tag Manager é uma ferramenta com uma interface amigável e baseada na web que simplifica o processo de trabalhar com impostos. Em vez de adicionar tags separadas para o Google Analytics, Search Console e o acompanhamento de conversões do Google Arts, você só precisa adicionar o código do Google Tag Manager ao seu site e todos os outros produtos do Google podem ser integrados usando apenas o Gerenciador de tags do Google. E menos citações no site significa o quê? Isso significa que o site vai carregar rapidamente, você vai obter velocidade de carregamento mais rápida. Então vamos ver como você pode configurar o Gerenciador de tags do Google no site. Faça uma pesquisa pelo Gerenciador de tags do Google. Aqui, clique em começar gratuitamente, faça login com sua conta do Google. Aqui, clique em Criar conta, dê um nome à conta. Selecione o país. Em seguida, dê um nome ao primeiro contêiner. By the way, o que é um recipiente? Um contêiner define as regras para um domínio específico. Então, aqui você pode atribuir o nome como nome de domínio para facilitar a identificação. Selecione o destino como Web. Clique em Criar. Você pode aceitar os termos e condições e se você quiser lê-lo, então você está livre para lê-lo. Clique em Sim. Agora, aqui estão os trechos de código que precisamos adicionar no site. Há dois conjuntos de aspas que precisamos adicionar. O primeiro deve ser adicionado na parte de Haia da página e o outro na tag de corpo de abertura. Embora eu tenha lhe dito que estaremos criando o site sem qualquer codificação, vite e saudita, Você só tem que colar estes dois conjuntos de códigos no site. E é uma tarefa muito simples. Vamos ver como você pode adicioná-los ao site, copiar a tag e voltar para a área de administração do WordPress. Nós estaremos usando um plugin Header Rodapé e post injeções, instalá-lo e ativar. Agora, usando este plugin, você pode adicionar os tribunais para o site na da cabeça e parte do corpo para todo o site. Você encontrará as configurações para este plugin aqui na opção Configurações. O código que nós copiamos deve ser adicionado na parte principal de cada página de um site. Então, basta colar o código aqui. Mesmo, copie o próximo, e cole-o após a tag body e clique em Salvar. Agora, volte ao painel do Gerenciador de tags do Google, clique em enviar para enviar um contêiner, você pode atribuir um nome de versão e clicar em Publicar. Agora, para verificar a ativação desta tag, teremos que usar uma extensão do Google Chrome chamada Google Tag Assistant. Instale a partir da Chrome Store. Clique em Ativar e atualize a página. Agora aqui você vai ver que a tag é disparada e temos integrado com sucesso o Google Tag Manager que o site. Assim, desta forma, você pode facilmente integrar o Google Tag Manager com o site usando um plug-in simples. Vamos ver como você pode usar o Gerenciador de tags do Google para integrar o Google Analytics, console de pesquisa e as tags de rastreamento de conversões com o site nos próximos vídeos, fique atento. 45. Integração com o Google Analytics: Integrar o site com o Google Analytics é quase um passo obrigatório no processo de criação do site. Mas por quê? O que é o Google Analytics? O Google Analytics é uma ferramenta gratuita de análise da Web oferecida pelo Google para ajudá-lo a analisar o tráfego do site. Ele fornece os dados de uso do seu site e ajuda a responder perguntas como, quantas pessoas visitam o seu site? Onde vivem os visitantes? Quais sites estão enviando tráfego para o seu site? Quais táticas de marketing que conduzem mais tráfego para o site? Quais páginas do seu site são as mais populares? Em quantos visitantes você se converteu? Leva nossos clientes de onde eles tinham convertido arma visitante e ir para o site. Como você pode melhorar a velocidade do seu site? Conteúdo do bloco Vd. Seus visitantes gostam mais? Então, deixe-me perguntar-lhe, você quer esses dados que possam responder a essas perguntas? Diga-me sim ou não. Bem, é um grande sim. Todo mundo precisa desses dados porque os dados são incomodados. Você pode analisar o tráfego atual e otimizado seu site, ir o tráfego do site, melhorar o ROI e crescer seu negócio alcance e outras coisas. Portanto, precisamos usar o Google Analytics e deixe-nos ver como você pode integrar o Google Analytics com o site. O processo agora é muito fácil porque você já instalou o Gerenciador de tags do Google e implementará o Google Analytics usando a interface do Gerenciador de tags do Google. Vamos fazer login no Gerenciador de tags do Google. E na outra guia, abra o Google Analytics. Fazendo uma pesquisa no Google. Aqui, clique em começar a medir. Você terá que criar uma conta primeiro, dar o nome de entrega do conjunto, rolar para baixo e clicar em Avançar. Dê a propriedade ou o site no nome, selecione o tempo de relatório tem NC, clique em Avançar, selecione o setor, tamanho do negócio, faça as seleções e clique em Criar. Ensine o país e aceite os termos e condições. Clique em Salvar novamente aqui, VD para configurar o fluxo de dados. Então clique na web, digite o URL do site e atribua um nome. Clique em Criar fluxo e copie o AD de medição. Agora volte para a tela Google Tag Manager funciona POR e clique em adicionar novo DAG. Clique em Configuração de tags aqui, selecione Google Analytics GA para configuração é o ID de medição aqui. Em seguida, clique no gatilho e clique em todas as páginas. Dê um nome a este e clique em Salvar. Agora, mais uma vez, precisamos enviar as alterações. Então, clique em enviar, atribua um novo nome de versão e clique em Publicar. É isso. Adicionamos a tag do Google Analytics no Gerenciador de tags do Google e deixe-nos verificá-la. Abra o site e abra o Google Analytics para que possamos verificar o relatório em tempo real e ver se a contagem de usuários está mudando ou não. Sim, posso ver a contagem de um visitante e V adicionou com sucesso o Google Analytics ao seu site usando o Gerenciador de tags do Google. Agora você pode usar o Google Analytics para analisar seus dados e tráfego no site. Sinta-se à vontade para explorar mais sobre o Google Analytics. Isso é, uh, para aprender nesta lição e vamos continuar no próximo vídeo. 46. Integração com console: Nesta aula, nós vamos aprender como integrar o Google Search Console com seu site. Então, o que é o Google Search Console? Bem, o Google Search Console é uma plataforma gratuita para qualquer pessoa com um site para monitorar como o Google visualiza seu site e otimizar a presença orgânica. Isso inclui visualizar os domínios de referência, resultados de pesquisa avançados, consultas e páginas de pesquisa de tráfego mais alto, enviar o sitemap, solicitar indexação e conhecer os cabeçalhos nas páginas. É uma excelente plataforma para analisar os dados orgânicos do site. Então, para integrar o Google Search Console, faça uma pesquisa para o Google Search Console e clique em Iniciar. Agora faça login com a mesma conta do Google que você usou para o Gerenciador de tags do Google e Google Analytics. Agora, você precisa selecionar o tipo de propriedade, digite o URL do site na opção de prefixo URL e clique em Continuar. Eles disseram que seu site será verificado automaticamente usando o Gerenciador de tags do Google porque você já integrou Gerenciador de tags do Google no site com a mesma conta do Google. Se, devido a alguns motivos, você não conseguir verificar a propriedade usando o Gerenciador de tags do Google, então você pode seguir o método secundário. Vá para as configurações no Search Console, clique na verificação de propriedade, clique na tag HTML, copie a tag e cole isso no plug-in Yoast SEO. Bem, Yoast SEO plugin é essencial para otimizar seu site para SEO na página e você definitivamente vai usá-lo. Em seguida, vá para o Yoast SEO genitais alcança, clique em Ferramentas Webmaster, cole um código de verificação aqui e clique em salvar alterações. Agora clique em Verificar e a propriedade será verificada. Então comece a usar o Search Console e analise os diferentes dados e relatórios disponíveis. Continuaremos no próximo vídeo. 47. Integração com acompanhamento no Google Ads: Então, eu soube que você está exibindo anúncios do Google e você quer arrastar a data da convergência e executar campanhas de remarketing. É isso mesmo? Tudo bem, então o que são conversões? Todas as ações valiosas que um visitante toma no site e que é valioso para o seu negócio são chamados de convergência. conversão pode ser, por exemplo, assinar um boletim informativo, baixar um aplicativo ou comprar um produto. O acompanhamento de conversões ajuda a medir essas conversões definidas e atribuí-las a fontes específicas. Desta forma, você pode descobrir se uma conversão resultou de uma campanha publicitária digital, um post de mídia social ou de algumas visitas diretas ao site. Mas rastrear a fonte é muito importante. Para arrastar as reservas, você precisa configurar a tag de acompanhamento de conversões do Google Ads no site usando o Gerenciador de tags do Google. Vamos ver como fazê-lo. Abra ambas as plataformas, Google Tag Manager e os anúncios do Google agora criam uma nova tag e o Google Tag Manager. Clique em adicionar nova tag. Agora clique em Configuração de tags aqui, selecione a tag Linkerd conversão do Google. Nessa opção de disparo, selecione todas as páginas. Dê um nome a este e clique em salvar. Por favor, note que adicionar a tag de conversão do Google Linger é um processo único. Você não será obrigado a adicioná-lo na próxima vez que adicionar um novo tanque de conversão. Agora vá para anúncios do Google e clique em ferramentas e configurações e essa medida, você encontrará a opção de convergência. Clique nele aqui, clique no ícone de adição para criar uma nova conversão. Selecione o site e preencha os detalhes da conversão selecionando a categoria apropriada. Depois disso, clique em Criar e continue. Agora, para a configuração de impostos, clique em usar o Gerenciador de tags do Google. Você obterá os valores de ID de conversão e rótulo de conversão. Copie isso. Agora, volte para o Gerenciador de tags do Google e clique em adicionar nova tag. Na configuração da tag, selecione Rastreamento de conversões do Google Ads. Aqui, cole o ID de conversão e o nível de conversão. Inserir o valor de conversão e outros detalhes é opcional. Agora clique no gatilho e clique no ícone de adição aqui no canto superior direito para adicionar um disparado personalizado. Se você quiser atribuir a exibição da página de destino como conversão, você precisa selecionar o tipo disparado de exibição de página e disparar que disparou nas exibições de página específicas. Selecione o URL base, contém, digite o domínio e folga para a página de aterrissagem. Dê um nome e clique em Salvar. Dê um nome aqui também, e clique em Salvar. Agora, para atualizar o contêiner, clique em Enviar, dê a ele um novo nome de versão e clique em Publicar. É isso. Você adicionou o acompanhamento de conversões do Google Ads e agora você pode acompanhar conversões no Google Ads relatando meu usando o Gerenciador de tags do Google, você não precisa inserir cabras novamente e novamente no site. Em vez disso, basta criar novas tags e Google Tag Manager e manter um controle dos diferentes eventos de conversão que acontecem no site. Tudo bem, então terminamos com isso e continuaremos no próximo vídeo. 48. Integração com Facebook: Facebook pixel é mais uma incorporada uma indicação de que você deve fazer no site. Então, o que é um pixel do Facebook? O pixel do Facebook é uma cabaça, peço-lhe por favor no site para coletar dados que ajudam no rastreamento de conversões. Você pode usar o pixel do Facebook para acompanhamento de conversões, redirecionar para criar público-alvo semelhante, otimizar os anúncios do Facebook para conversões, otimizar o anúncio do Facebook para valor e obter mais acesso a dados e métricas de duelos. Então vamos para o gerente de negócios do Facebook e criar um novo pixel. Aqui, selecione a opção de gerenciamento de brincos. Clique em Conectar uma nova fonte de dados, selecione Web e comece. Selecione o pixel do Facebook e clique em Conectar. Digite o nome e o URL do site e clique em Continuar. Selecione esta opção para adicionar manualmente o código de pixel ao seu site. Copie o código e você pode criar uma nova tag. E o Google Tag Manager selecionou o tipo de tag como HTML personalizado. Baseado na cabaça. Clique em Configurações avançadas sob a tag disparando Configurações selecione uma vez por página. E nessas opções de disparo, selecione todas as betas. Dê um nome a este e clique em Salvar. Agora envie o contêiner para atualizações e atribua um novo nome de versão. É isso. Agora, para verificar se o pixel do Facebook está sendo acionado ou não, precisamos de uma extensão do Google Chrome. Golda tem Facebook Pixel Helper, instalá-lo a partir da Chrome Web Store e atualizar a página. Aqui está, o pixel está rastreando dados e estamos feitos com a configuração do código de pixel do Facebook no site. Agora, você pode acompanhar os eventos padrão ou criar eventos personalizados do gerente de negócios do Facebook para arrastar dados valiosos que o setor aprende nesta lição e continuaremos no próximo vídeo. 49. Como adicionar Chatbot ao site: Eles vão chat ao vivo e bate-papo boards são uma ótima ferramenta para usar no site. É muito útil na captura de leads ou fornecer uma funcionalidade de chat ao vivo para o visitante. Embora existam tantos plugins de verificação úteis têm rotulado para WordPress e você pode usá-los de acordo com a necessidade do projeto e orçamento. Nesta aula, vamos aprender como você pode integrar Facebook Messenger no site para funcionalidade de chat ao vivo. Vá para as configurações da página do Facebook, clique em mensagens aqui, localize o mensageiro AG para a opção do site e comece. Personalize as configurações do Messenger, cores , alinhamento e insira o URL completo do site. Clique em Salvar e copie o código. Agora, cole este código no plug-in de cabeçalho e rodapé após a tag body e clique em Salvar, vogal. Facebook Messenger está pronto no site. É isso. Outro plugin que eu recomendo usar para chat ao vivo é nítido. Você pode obtê-lo a partir do dia slide plugin o instalador, e siga o processo de configuração. Isso é muito fácil. Crisp tem um aplicativo móvel, bem como para atender as consultas do visitante a qualquer hora e em qualquer lugar usando o telefone celular. E se você deseja usar algum quadro-negro para coletar leads, você pode dar uma tentativa de coletar e R-chart ou opt-in chat de acordo com os recursos e orçamento. Tenho certeza de que você não está familiarizado com a configuração de um plugin para usar no site. Vamos, vá em frente e tente. Vejo você no próximo vídeo. 50. Processo de criação de sites em um nutshell: Então agora você sabe como usar Elementor e WordPress para desenvolver o site em um site perfeito pixel sem qualquer codificação. Você também conhece os conceitos fundamentais, estrutura de uma página web, UI e UX, teoria de cores, tipografia, copywriting, design gráfico, modelos e diferenças, marca e processo de design, WordPress AG Elementor. Se eu lhe pedisse para criar um site personalizado a partir do zero, você será capaz de fazê-lo? Se eu pedir que você crie um site e apenas Verna, você será capaz de fazê-lo? E se eu pedir que você crie um site de página única, você será capaz de fazê-lo? Obviamente, sim, você fez esse feed orgulhoso de si mesmo porque agora você pode fazê-lo muito facilmente. Basta seguir o processo passo a passo de acordo com a exigência do projeto e você será capaz de concluir o projeto do site com muita facilidade. Levou-me a atualizar o seu aprendizado e recordar alguns dos passos que tínhamos aprendido para criar um site personalizado a partir do zero. Ou eles começam com a pesquisa e entendem o negócio. Pegue um bom resumo do cliente e analise os concorrentes para criar uma biblioteca de referência. Em seguida, desenvolveu um guia de branding e receber feedback do cliente. Após este projeto, o site completo, começando com wireframe e, em seguida, com visuais como imagens de logotipo e conteúdo em Figma ou qualquer ferramenta de design de site que você preferir. Certifique-se de continuar recebendo feedback do cliente em todas as diferentes etapas de design. Uma vez que o projeto está pronto, você tem que apenas fazer a configuração WordPress e usar elemento ou visitas para aplicar o projeto e desenvolver todas as páginas da web. Integre o site com todas as plataformas e ferramentas importantes e certifique-se de otimizar o site para agilidade e rapidez. É isso. Esse é o processo de criar um site a partir do zero. Esse processo também pode incluir a criação das páginas de destino ou a criação de um site de blogs. E você está pronto para lidar com ambos. Em seguida, se houver um cliente com um orçamento muito baixo ou menos tempo, você pode até criar um site para ele e apenas um braço. Para isso, você terá que usar modelos. Você pode fazer uso de modelos iniciais por força de brainstorm, que é para Astra Tema ou então a biblioteca de modelos Elementor ambos têm modelos de design impressionantes. Você também pode usar os modelos disponíveis em elementos Envato. Todos esses modelos de site são bem estruturados e organizados para que você possa importar um modelo de site completo, fazer alterações no conteúdo em termos de texto e imagens e o site está pronto para o cliente. Apenas um nosso próximo, se você deseja criar um site de página única, que embora não é recomendado do ponto de vista SEO. Mas ainda assim, se acontecer de você criá-lo, o processo é simples. Siga os mesmos passos para criar um site personalizado, mas com apenas uma única página, que é a página inicial. E para o menu, você pode usar links personalizados que se deslocam para baixo para opções específicas. Para isso, você precisa atribuir o ID SSS a cada seção que você deseja rolar acessando a opção Avançado. Não adicione nenhum espaço entre o id. Agora, no Link Personalizado, atribuiu o rótulo do menu, e no URL, insira o URL da página inicial seguido com o slug do id CSS, começando com uma hashtag, complete o menu, salve-o. E aqui está o site de página única. Quando você clica nas opções do menu, você vai rolar para as seções para baixo na própria página inicial. Tudo bem, então eu acredito que você está pronto com o processo de criação do site e vamos continuar no próximo vídeo. 51. Otimização do tempo de carga: A página da Web que você está tentando abrir como sendo carregada. Aguarde, ele ainda está carregando. Opa, desculpe pelo atraso, mas ainda está carregando. Por favor, espere. Está quase carregado. Apenas alguns segundos, minutos ou horas. E finalmente, Haidt é a página carregada completamente. Quem odeia pedir muito rápido, apenas meio minuto para carregar. O que você acha? Estou falando sério sobre isso? Não, absolutamente não. Um site ideal deve carregar menos de três segundos para proporcionar uma boa experiência ao usuário. E os motores de busca também levam muito a sério a velocidade de carregamento da página como um fator de classificação. Por isso, é muito importante para nós otimizar o site para o tempo de carregamento para que a página web é carregado de preferência sob três segundos, ou TDAH são mais menos de cinco segundos. É importante acelerar o carregamento do site para garantir uma melhor experiência do usuário. Reduzir o tempo de carregamento da página reduz a probabilidade de os usuários ficarem frustrados e aumentar a taxa de rejeição. Embora estejamos usando o Elementor para projetar as páginas da web e os códigos são gerados automaticamente no back-end. Isso é algo fora do nosso controle para otimizar os tribunais. E temos que depender do elemento ou arquitetura para aspas limpas. E deixe-me dizer-lhe, Elementor fez decente o suficiente para entregar uma boa velocidade de carregamento de página. Mas há algumas coisas que podemos controlar e otimizar para melhorar o tempo de carregamento de uma página web. By the way, como testar a velocidade de carregamento da página para uma página web, alguma idéia? Bem, você pode usar muitas ferramentas, mas as mais populares são métricas GD fixadas e Google PageSpeed Insights. Então vamos lá, vá em frente e verifique a velocidade dos sites mais famosos usando essas ferramentas. E essas ferramentas também fornecem sugestões para melhorar a velocidade de carregamento da página. Vamos aprender alguns conceitos que você pode aplicar para chegar a uma velocidade de carregamento de página decente. O primeiro fator é a localização do servidor. Se você estiver usando algum plano de hospedagem compartilhada, tente escolher o local do servidor mais próximo do público-alvo. Melhora a entrega de dados do servidor para o navegador. A seguir é usar um CDN. Uma CDN significa rede de entrega de conteúdo, e refere-se a um grupo geograficamente distribuído de servidores que trabalham juntos para fornecer entrega rápida de conteúdo da Internet. Tenha em mente que uma CDN não armazena o conteúdo do site e não é uma substituição do servidor web. Ele só armazena as virgens do caixa e entregá-lo rapidamente para melhorar a velocidade de carregamento da página. A seguir é atualizar a versão do PHP no servidor. Sempre atualize manualmente para a versão estável mais recente do PHP para melhorar a velocidade e o desempenho. A seguir é usar uma equipe leve no site como Astra. Remova também todos os plug-ins indesejados do site ou remova os plug-ins que estão fazendo com que o site carregue lentamente. seguir é dimensionar as imagens para dimensões e resolução apropriadas , já que ter a imagem extra grande não é útil para nós, e isso só vai abrandar o site. Você também pode comprimir a imagem usando PNG minúsculo ou então usar o plugin como ideal ou um otimizador tupla W para comprimir as imagens que você carrega para Wordpress. Lembre-se, reduzir o tamanho do arquivo de imagem é um fator muito importante para melhorar a velocidade de carregamento da página. próximo fator é usar algum plugin de cache. cache de página funciona criando uma versão HTML estática de sua página para atender os visitantes, em vez de forçar seu servidor a gerar a página do banco de dados e arquivos PHP para cada visita. Um plugin de cache geralmente fornece minificação, cache do navegador e compressão G zip, bem como alguns bons plug-ins de cache são cache de velocidade da luz e foguete WPA. Aqui, a velocidade da luz é um livre, mas o foguete WP é um plugin premium, mas oferece excelentes resultados em comparação com os outros plugins de cache. No entanto, tenha cuidado ao usar esses plug-ins de cache, pois às vezes eles quebram o site. E muitas vezes precisamos limpar o cache em intervalos regulares para manter o design das páginas. Bem, se todos esses fatores não são capazes de trazer uma melhoria significativa na velocidade de carregamento da página. Considere atualizar para um bom host ou um plano superior, ou simplesmente ir para a hospedagem WordPress gerenciada na nuvem. Isso definitivamente ajudará a melhorar a velocidade da página e continuar verificando os dados PageSpeed usando métricas GET sendo norma ou Google PageSpeed Insights. E não pare de otimizar sua mira a velocidade em menos de cinco segundos. É isso para aprender nesta lição e vamos continuar no próximo vídeo. 52. Lista de lançamento no site: Eles vão, eles vão então, Eu sei que você está animado para lançar o site, mas eu quero que você para ter certeza de que você não esqueceu nada ou fazer algo incorretamente. Com esta lista completa de verificação de lançamento do site, você pode ter certeza de que você marcou todas as caixas e seu site está pronto para o curto período de tempo. Há uma série de tarefas comuns que você precisa executar para que todos os sites estejam prontos para serem lançados. É basicamente as melhores práticas que cada site precisa seguir. Vamos ver a lista. número um é verificar a página inicial. Verifique se você atribuiu corretamente a página inicial como página inicial nas Configurações de leitura. Número 2 é certificar-se de que você excluiu todo o conteúdo fictício e Lorem Ipsum que veio com os modelos ou páginas de amostra. Na verdade, limpou a lista de páginas e postar e remover todos os indesejados. Em seguida, é desativar ou excluir os plug-ins indesejados. Em seguida, verifique novamente as configurações de permalink para a estrutura de URL que está definida para postar nome. seguir é verificar o endereço de e-mail do administrador, pois todos os dados importantes de comunicação e envio de formulários serão recebidos neste e-mail. Somente. A seguir é verificar o fuso horário. A seguir é verificar se a indexação do mecanismo de pesquisa não está bloqueada. O próximo é cruzar as configurações de comentários. A seguir é verificar o título e a descrição do site. A seguir é verificar o ícone fav ou ícone do site. O próximo é verificar os formulários para submissão usando algumas entradas de testes. O próximo é criar um personalizado 400 quatro páginas. Ok, então o que faz uma página 400 quatro é a página que é mostrada quando o visitante entra em algum link que não existe em seu site. Você pode facilmente criar isso usando o construtor de equipe Elementor indo para adicionar novo modelo, selecionando Error 400 quatro páginas, dando-lhe um nome , projetando-o, publicando-o adicionando condição 404 página, é isso. Em seguida, é configurar um redirecionamento de URLs antigos para novos URLs usando o plugin de redirecionamento. Este é um opcional e usá-lo somente se necessário. Em seguida, é garantir que o certificado SSL é válido e URLs têm HTTPS como protocolo. A seguir é verificar se todos os links internos estão funcionando bem e os dados não há links quebrados. Isto é muito importante do ponto de vista SEO. Para isso, você pode usar uma extensão do Chrome chamada como dinheiro SEO em. A seguir é verificar para o título SEO e Meta descrições. Bem, você pode facilmente definir o título e a descrição de cada página web usando o plug-in Yoast SEO. Em seguida, é testar os dados do visitante no Google Analytics. Em seguida, enviar o sitemap e o Google Search Console para indexar o site. Você pode copiar o comprimento do sitemap a partir das configurações gerais do Yoast SEO, seguida, selecionando recursos, clicando na questão eigen perto de sitemaps XML, clicando no link, veja o sitemap XML. Aqui, copie apenas o slug e faça login no Google Search Console. Clique em sitemaps e cole a lesma. Clique em Enviar. Esse é o processo de solicitação de rastreamento e indexação do site no Google. Em seguida, é garantir a configuração da ferramenta de marketing de e-mail e integração com formulários. A seguir é verificar a configuração de páginas legais. Embora isso dependa da exigência legal e jurisdição do país ou lugar que você está trabalhando. Mas ainda é recomendável ter pelo menos a página da política de privacidade no site e atualizado sobre as configurações de privacidade também. Em seguida, é verificar e otimizar um site para desempenho testando o tempo de carregamento em métricas GT ou Pingdom ou Google PageSpeed Insights. Caso o tempo de carregamento seja maior, você pode seguir as sugestões para reduzir o tempo de carregamento que discutimos na lição anterior. A seguir é ter um plano de backup para manter uma cópia do site no caso de algo ruim acontecer, certifique-se de que o backup deve usar está funcionando. Em seguida, é proteger o site usando plugins de segurança, se necessário. Em seguida, certifique-se de ativar a licença de plugins premium para o recurso de atualização automática para funcionar. E o ponto de verificação final é melhor testar muito em diferentes navegadores e dispositivos para garantir que tudo esteja funcionando bem. Então esta é a lista de verificação de lançamento do site e você pode usá-lo para todos os sites que você criar. Continuaremos no próximo vídeo. 53. Benefícios de usar o Elementor Pro Pro Vs livre: Elementor é, sem dúvida, o melhor plugin Page Builder de rótulo para WordPress. Elementor. É versão gratuita, oferece possibilidades de design ilimitadas. No entanto, o Elementor Pro capacita a inclinação com ferramentas mais profissionais que aceleram seu fluxo de trabalho e permitem que você obtenha mais conversões e vendas. Então você deve assar sua carteira e pagar pelo Elementor Pro, ou você vai ficar bem usando a versão gratuita do elemental? Vamos tentar entender os benefícios de usar o Elementor Pro. Elementor Pro é tecnicamente um complemento para o plug-in gratuito do Elementor. seja, se você comprar Elementor através, você terá tanto o elemento livre de plug-in o elemento ou plugin Pro ativo em seu site. primeiro benefício do Elementor Pro é que ele adiciona mais 13 visitas para construir a página web. Esses widgets ajudam você a tornar o design da página da Web mais funcional e eliminando a necessidade de usar muitos plugins de terceiros. Por exemplo, o widget de formulário permite criar formulários personalizados, diretamente da interface do Elementor. O widget de controle deslizante permite incluir controles deslizantes otimizados de desempenho. E o pós-visita permite que você exiba seu post mais recente em uma grade sem a necessidade de nenhum plugin de terceiros. Gostaria de dar especial ênfase aos formulários que visitam aqui. Formulários de contato são uma parte essencial de cada site, uma vez que são os motores de conversão e liderança. Elementor pros forma assistente é revolucionário porque todo o processo de gerenciá-los é visual. Crie seus formulários no front-end conecte-os a qualquer plataforma de marketing de automação ou CRM de sua escolha por apenas alguns cliques. Também do ponto de vista do design, você pode adicionar animações e efeitos de rolagem ao site projetado para um impacto mais forte com o Elementor Pro. Em seguida, se você estiver executando uma loja de e-commerce baseada WooCommerce, você vai adorar a adição de uma variedade de widgets específicos WooCommerce. O próximo benefício do Elementor Pro é que você tenha acesso à biblioteca de modelos completa. Todos sabemos que Elementor vem com uma biblioteca de modelos muito grande, mas a maioria dos modelos está bloqueada na versão gratuita e elementos ou análogos pro. Em seguida, com elemento ou linha, você pode usar cada modelo de página e bloco que é rotulado na biblioteca. Isso acelerará o processo de criação do site. Em seguida, você obtém o construtor de equipe com o Elementor Pro, e ele adiciona novas e poderosas funcionalidades ao site. Com o construtor de temas Elementor, você pode usar a mesma interface de arrastar e soltar para criar sua equipe inteira, incluindo os modelos de cabeçalho, rodapé e postagem, que de outra forma é muito difícil de personalizar com as configurações do tema. Além disso, você obtém o construtor de pop-up com o Elementor Pro, que é importante para capturar leads. Isso ajudará no aumento das vendas e conversões. Você pode projetar o pop-up usando a técnica de arrastar e soltar, atribuir condições e gatilhos junto com integrações avançadas. E se você é um codificador parcial, eu sei CSS. Você pode adicionar CSS personalizado que liberam o Elementor, mas o Elementor Pro permite que você adicione diretamente laços CSS a widgets ou seções individuais. Se você gosta de usar seu próprio CSS personalizado, então este é um grande aumento de produtividade. Em seguida, a visita global no Elementor Pro, os orçamentos globais economizarão muito tempo se você estiver planejando reutilizar a mesma visita em várias páginas. Então, para concluir, você pode ser feliz com três elementos ou se você quiser projetar um site básico com bom conteúdo usando uma equipe flexível como Astra, você será capaz de acessar os modelos pré-projetados usando o plugin de modelos iniciais por Força de brainstorm. Você pode planejar atualizar para Elementor Pro quando você quer criar projetos complexos e páginas de destino, estão usando WooCommerce para configurar uma loja de e-commerce. Ou se você quiser construtor de equipe e construtor Papa e acesso a todos os elementos premium ou modelos, juntamente com visitas globais e tags dinâmicas. Então, a melhor parte do Elementor é que você pode começar com grátis e atualizar passo a passo sempre que quiser atualizar. Tudo bem, então é isso nesta lição e vamos continuar no próximo vídeo. 54. Visão geral de custos: Mais uma coisa que você deve estar se perguntando que quanto quantidade total de dinheiro você terá que gastar a fim de construir um site. Bem, para entender isso, vamos dividir o custo total em duas categorias. Primeira categoria é o custo necessário, ou seja, o custo obrigatório, o que é impossível para você evitar. Ele inclui o custo para nome de domínio e plano de hospedagem. Próxima categoria é o custo opcional. Esse é o custo que você pode evitar se você estiver disposto a sacrificar em recursos e funcionalidades. Isso inclui o custo para temas e plugins. Vamos começar com a primeira categoria. E nele, a primeira coisa é o nome de domínio. Bem, um nome de domínio é muito econômico de se conseguir. O custo do nome de domínio depende de dois fatores. Número 1, onde você registra seu nome de domínio. E número dois, qual extensão de domínio você deseja usar. O custo de um nome de domínio pode começar a partir de $5 e ir até $50 de acordo com a escolha de DLD ou extensão. Mas, em geral, uma extensão de US $10 ponto com é recomendada para iniciantes e a maioria dos sites de negócios. Em seguida, é o custo para o plano de hospedagem. Você sempre terá uma oferta especial no primeiro ano de plano de hospedagem. E você também pode comprá-lo por um longo prazo para obter mais desconto. Em geral, o plano de hospedagem A2 custa cerca de US $80 para o primeiro ano, e Turbo Boost custa cerca de 180 dólares. E se você estiver usando maneiras de nuvem um servidor Digital Ocean começa com US$10 por mês. Assim, o custo obrigatório básico exigido com um bom desempenho hospedagem seria em algum lugar em torno de US $90 ou seis a 7 mil rúpias para o primeiro ano. Tenha em mente que este é o custo para o primeiro site. Você pode economizar muito dinheiro se você criar vários sites. Se você estiver usando maneiras de nuvem, o custo para hospedagem de um ano seria pouco mais do que o plano de inicialização de hospedagem A2. Mas aqui você tem que fazer o pagamento mensalmente. Você não estaria pagando a quantidade de amigo. Esta pode ser uma opção mais conveniente para alguns de vocês. By the way, você obtém opções de pagamento mensal na hospedagem A2 também. Portanto, tudo depende da sua exigência do tipo de servidor e recursos. Portanto, esta categoria um é o custo obrigatório para a criação do site. E este é o custo para criar o primeiro site. Se você deseja criar vários sites, então é uma situação mais rentável para você, porque no plano de hospedagem A2, Turbo Boost ou DR, você pode chegar a um número decente de sites e o site de PR hospedagem custo irá reduzir significativamente. A próxima categoria é o custo ideal, e é realmente opcional. Cabe a você comprar os temas e plug-ins de acordo com a exigência do projeto. Se você tomar a minha opinião e se você quiser economizar dinheiro a bordo dos temas e plug-ins, então Elementor Pro faz uma ótima opção porque ele embala tanta funcionalidade em apenas uma ferramenta, Ang, a um preço. Por exemplo, você precisará das funcionalidades especiais, como um construtor de página de destino, para criar páginas otimizadas para conversão. Se formulário plugin para contato e formulários de registro, um pop-up e e-mail opt-in plug-in para ir. A lista de e-mail é plugin slider para criar a imagem e post sliders é plugin botão de compartilhamento social para integrar mídias sociais, você estará recebendo todos estes com apenas uma assinatura Elementor Pro. Obviamente, você pode começar com o Elementor gratuito e atualizar para o Elementor Pro com base no número de sites que deseja criar. Investir cerca de US $50 ou US $100 ou US $200 no Elementor Pro é vert porque você pode obter retornos na forma de conversões, selos, e com os recursos incríveis, você será capaz de cobrar mais dos clientes. Portanto, este é um opcional, mas um altamente recomendado para investir na construção de sites profissionais. É isso nesta lição e continuaremos no próximo vídeo. 55. Como começar um negócio de desenvolvimento de sites: Há milhares de pessoas que lançaram novas empresas todos os anos, mas eles não sabem como construir sites para si mesmos. E há tantas empresas em execução e profissionais que não têm a marca adequada e sites atualizados. Alguns deles podem ter site e alguns deles podem nem ter sites. Então, novas diretrizes todas as declinam. Tantas, tantas e tantas linhas estão procurando uma solução de site. Todos os dias. Você pode ajudá-los e chegar a uma renda em tempo integral ou parcial. Mas se você quiser ter sucesso do que o habitual, concentre-se em algumas fundações para criar cuidadosamente o bart de servir clientes e ganhar dinheiro. E eu estou muito feliz em compartilhar alguns conceitos que estão relacionados ao manuseio de clientes e iniciar seu próprio negócio de desenvolvimento de sites. Se você está trabalhando como freelancer fora do negócio, você é responsável por certificar-se de que tudo funciona como ele precisa. Você tem que se certificar de obter lucro. Você tem que se tornar realmente bom em gerenciar relações com clientes e talvez relacionamentos com funcionários. Fazer. Você também tem que equilibrar esse trabalho de design, que as vendas e a tarefa de marketing, deslizamentos de lote, envio de propostas, cabaças, terminando o projeto a tempo. E é realmente uma tarefa emocionante trabalhar em novos projetos e com novas diretrizes para vê-los recebendo reservas dos esforços de marketing. E, no entanto, isso diz. Então. Vamos ver como você pode configurar o negócio de desenvolvimento de sites. O primeiro passo é escolher um nicho. Você pode, obviamente, começar servindo todas as indústrias ANC macacos cegos. Mas sabemos que um valete de todos os negócios pode ser um mestre de nenhum. Tentado enterrar especialidade é ao longo do tempo com tipo específico de persianas. Indústrias específicas são tipos específicos de sites. É um fato que se você se apresentar como um especialista de alguma indústria, você terá uma resposta maior e um pagamento mendigo para o projeto em vez de se apresentar como um desenvolvedor web geral. Afinal, sua especialidade ajudará as linhas a obter reservas melhores e mais rápidas pelo processo comprovado que você seguirá. Tão ótimo para criar uma seleção de nicho. Sempre certifique-se de que o nicho que você está selecionando deve ter uma boa pontuação e um bom número de noves ativos e eles podem pagar pelo tipo de sites que você obedeceu. Em seguida, decida quais são os serviços oferecidos à glande. O equipamento meteorológico estará fornecendo apenas desenvolvimento de site ou desenvolvimento web design ou solução de branding completa com consultoria, sem consultoria, SEO, configuração de automação de e-mail, fotografia, videografia. Faça uma lista das soluções da Wharton que você fornecerá às diretrizes. Tenha em mente que você deve entregar valor em qualquer solução que você fornecer. Assim, os judeus, os serviços que você pode fornecer de forma eficiente ou pneus bacia para fornecer uma solução one-stop para os clientes porque glândulas geralmente preferiu atribuir um projeto completamente para uma agência, como é fácil para eles seguir. O próximo é definir seus objetivos. Qual é a visão e a missão da agência, ou como indivíduo? Quais são os objetivos financeiros? Quais são os objetivos de repetição? Quantos clientes você quer servir em um mês? O que você quer alcançar nos próximos um ano ou cinco anos? Onde você quer ver a si mesmo ter um plano para tudo isso logo no início. Em seguida, é definir a taxa mesmos encargos. Isso é um pouco complicado, mas para chegar a isso, verifique os concorrentes e descubra o quanto eles estão cobrando. Além disso, dê uma olhada nas despesas como sua despesa de branding, marketing, fantasma, software, taxas de hospedagem, temas e plug-ins, rodada de escritório, salário de funcionários. Se você tem alguns e contribuinte aprende através do custo ideal de seu serviço, em seguida, cobrar para o site pode variar para projeto para projeto. Mas se você quer que seu negócio seja bem sucedido e você quer se sentir bem com o trabalho que você faz. Você tem que fazer um lucro, não importa o quão grande ou quão pequeno o projeto é, em seguida, escolher um nome para o negócio que é fácil de lembrar entregar e cativante, configurar os requisitos legais como obter licenças como corpo estão operando região, e comece a criar sua marca digital. No mínimo, você deve criar um logotipo, combinações de fontes, a cédula principal, imagem, o estilo e a aurora do conteúdo. Em seguida, é construir seu site de negócios seguindo todas as melhores práticas que você aprendeu. Não se esqueça de incluir os sites de amostra para mostrar o portfólio para a glande. Em seguida, você pode se inscrever para algumas ferramentas úteis de gerenciamento de projetos, se necessário, como Trello ou Asana, que ajudam a gerenciar o projeto e aumentar a produtividade. Em seguida, crie um documento de proposta e contratos de contrato para os serviços que você oferece dois aviões. A propósito, o que é uma proposta de site? Bem, é um documento que contém uma descrição das soluções que você fornecerá ao cliente juntamente com o custo do serviço e duração do tempo. É um passo muito poderoso e importante na resolução de linhas de desenvolvimento de sites porque todas as expectativas estão listadas e solução está comprometida a determinado custo e inserindo Dame. Portanto, se eu disser o que tudo inclui no documento da proposta, comece com a visão geral dos problemas e depois mencionei a solução proposta, o calendário e os preços. A sua solução deve parecer credível e a Verde não se recusou por investir na proposta com um CTA e certificar-se de que fornece as informações de contacto. Esta é a maneira ideal de criar uma proposta para o cliente. Em seguida, você também pode usar algumas ferramentas de rastreamento de dor, arrastar contador do tempo que você passou trabalhando no projeto. Em seguida, crie um perfil on-line para a empresa Lake ter uma conta do Google minha empresa, discurso de negócios do Facebook, perfil do LinkedIn e perfil do canal do YouTube que estou listando no Yelp. Depois disso começar a encontrar declínios e projetos. Então você sempre pode iniciar esse processo pedindo referência de sua família, amigos, colegas. Haverá pessoas ao seu redor que podem precisar uma solução e você só quer evitar que, ei, eu tenho uma solução. Esta é a maneira mais rápida de começar com o Klein. Em seguida, você pode se tornar ativo em redes sociais e grupos para espalhar a mensagem em cada um, ser rede maior e conscientizá-los sobre seus serviços. Na verdade, você pode aproveitar várias plataformas de mídia social como Facebook, Linkedin, Instagram e até mesmo Behance, Dribble para obter novos clientes e projetos. Por favor, note que o lyndon é uma plataforma poderosa para se conectar com os empresários em todo o mundo. Faça muito bom uso dele porque ele tem um enorme potencial de gerar negócios para você. A seguir é fazer uso de mercados freelance como 500 freelancer ascendente ou elemento ou especialistas, procurar os projetos relevantes, licitar neles, e tentar entregar um trabalho incrível a declina para construir credibilidade e reputação. Continue publicando conteúdo valioso no site na forma de postagem de blog e ímãs de chumbo para iniciar o funil. Esta é a maneira orgânica e muito sólida de construir uma base de clientes. Nunca se esqueça de publicar depoimentos no site. Em seguida, você também pode exibir campanhas pagas de mídia social e anúncios de pesquisa para obter tráfego na página de destino e tentar colocá-los no funil. No entanto, vai custar-lhe uma boa quantia. Mas se você consegue fazer isso, é bom ir. E, a propósito, alcançar o ouro também não é uma má idéia. Prepare um banco de dados e tente enviá-los por e-mail, mas certifique-se de pesquisar o problema e está tratando-os com uma solução melhor. Mensagem personalizada. Nunca, nunca use mensagens gerais no envelhecimento do ouro, sempre personalize os e-mails. Vai funcionar para você. Então, você pode seguir estas etapas para iniciar seu negócio de desenvolvimento de sites e começar a obter essas linhas. E deixe-me também compartilhar algumas dicas com você. A dica mais importante é que sempre tentou entregar o melhor valor para os clientes. Em seguida, seja sempre fiel ao trabalho e dê a você 100 por cento para cada projeto. Seja criativo, mas seja sempre disciplinado. Sempre segunda worksheet você e ficar com ele. Crie limites dentro do seu espaço de trabalho, bem como com os clientes. Os fins de semana de folga e passar tempo com as pessoas que você gosta. Deixar você nome obrigação pelo menos uma vez por ano, conectar-se e apoiar outros proprietários de empresas criativas que estão na mesma indústria. E, finalmente, se você quiser ter sucesso no negócio on-line, você deve continuar aprendendo e debatendo o conhecimento fazendo cursos de AP, lendo blogs e participando de webinars. Então gerencie sua vida profissional de acordo com as pessoas tendem a manter isso como opcional, mas data minhas palavras, não é opcional. Só se você continuar aprendendo, você continuará aprendendo. Assim, desta forma, você pode criar um negócio de desenvolvimento de sites e começar a ganhar dinheiro. Desejo-lhe tudo de melhor e continuaremos no próximo vídeo. 56. O Quanto cobrar para um site: Preços, o serviço de desenvolvimento de site é um pouco complicado. Há sempre um decil acontecendo em mente que se eu estou cobrando menos ou vai recusar pago tanto pelo meu trabalho. Bem, não há regras rígidas em termos de configuração de preços para um projeto, mas podemos aprender alguns métodos gerais para facilitar essa tarefa. Em primeiro lugar, tenha em mente que o orçamento geral do projeto influencia o produto final. Facilita quantos recursos e funcionalidades você será capaz de fornecer e quanto tempo você será capaz de gastar na interface do usuário e UX do projeto. Portanto, quanto mais o orçamento, mais recursos e tempo para UI e UX, é uma regra simples. É importante chegar a preços certos porque se você cobrar baixo, você não será capaz de fazer lucro. E se você cobrar mais, você pode perder o cliente para algum concorrente. Sabemos também que o custo mínimo necessário para construir um site inclui o custo para nome de domínio e plano de hospedagem. Considerando que os recursos adicionais, como temas e plugins, são opcionais. Agora, se considerarmos alguns fatores para decidir sobre o preço, o primeiro fator seria seu nível de habilidade ou experiência. Quanto valor você pode entregar ao cliente no projeto. Se você está trabalhando no desenvolvimento de sites há bastante tempo e você tem um portfólio muito sólido para mostrar o seu trabalho aos clientes. Fica mais fácil para o cliente avaliar a qualidade e o nível do seu trabalho e, consequentemente, justificar o valor que você está cobrando pelo projeto. E se você está apenas começando, então eu recomendo que você crie pelo menos alguns sites de amostra para mostrar como um portfólio de seu trabalho. Confie em mim, você será capaz de obter um preço decente para o site se você tiver um portfólio para mostrar. O próximo fator é o tempo do projeto. Com base em sua experiência de trabalho, você será capaz de descobrir quantos são subprojeto exigirá para concluir e você pode obter mais clareza sobre quanto cobrar com base no tempo que você gastará no projeto. próximo fator é o tipo de site. Isso é se é um site de informações ou um site estático, ou é uma página de destino com otimização de conversão e automação? Ou é uma loja de comércio eletrônico com pagamento deve ser coletada? preço depende da criticidade das funções no site. próximo fator é o nicho em que você está trabalhando. Você está em fazer sites para médicos e profissionais médicos, então você pode obter um bom valor para os sites que você queima. Mas se você estiver criando sites informativos básicos para alguns fornecedores locais, você pode achar difícil cobrar alto fundo do projeto. próximo fator é o tamanho do escopo do projeto. Suponha que se você estiver criando um site diretamente do zero com branding e pesquisa, o preço será maior em comparação com a atualização um site feito anteriormente com algumas pequenas alterações de conteúdo. Você também precisa considerar quantas revisões você permitirá antes de lançar o site e quais serão as taxas anuais de manutenção para updation freqüente, incontinente. Todos esses fatores importam ao finalizar o preço de um projeto de site. E se o cliente precisar desses recursos e funcionalidades extras da companhia aérea e você tiver que fazer a assinatura de alguns plug-ins dedicados para esse projeto específico, então sinta-se livre para cobrar alto. Outro ponto importante a considerar é a concorrência. Verifique como os freelancers e agências estão cobrando pelo desenvolvimento do site em sua região ou seu nicho e crie o preço ideal com base em seu nível de habilidade e recursos, funcionalidades que você está oferecendo ao cliente. Tenha em mente que os preços variam de acordo com o país e o local em que você está trabalhando. Em alguns lugares você pode obter um preço baixo, e em alguns lugares você pode obter um bom preço mesmo para um pequeno projeto, ele é baseado na condição econômica dessa razão. Então tente chegar aos preços regionais e finalizar o seu em conformidade. E o último fator a considerar é o valor do trabalho para o negócio do cliente. Deixe-me deixar claro. Significa cobrar de acordo com o valor que você entregará ao negócio do cliente. Se o site, você pode criar valine grande valor para o negócio de declinou, você pode considerar cobrar um preço mais alto. E se o ROI do cliente não for significativo, você não poderá obter o preço premium. Você só vai cobrar um preço decente. Então, uma vez que você é feito com o preço, complete a proposta e envie-a para o cliente. Não se esqueça de mencionar as cobranças anuais recorrentes de manutenção e hospedagem que o cliente tem que pagar todos os anos. E então você é bom no trabalho. Você está fornecendo valor. Não haverá negação do lado do cliente. Por isso, continue a oferecer valor aos clientes e o seu negócio continuará a crescer o melhor. 57. Recap do curso: Então foi realmente um momento maravilhoso para passar com você. E espero que tenha gostado do curso. Se eu disser pessoalmente, fico muito feliz em ajudar as pessoas a aprender esses conceitos de marketing e branding que as ajudam a construir sua carreira, crescer sua carreira e expandir seus negócios. Há uma sensação de satisfação em fornecer treinamento para pessoas como você. Por isso, quero agradecer-vos por passarem o vosso tempo neste curso e espero ter dado um bom valor à vossa carreira e crescimento. Agora deixe-me dar-lhe uma breve recapitulação dos conceitos de Waterloo que você aprendeu neste curso. Iniciamos o curso com a definição das três etapas para criar um site que descubra, desenhe e desenvolva. Então aprendemos sobre a definição de metas porque cada site é criado para algum propósito. Em seguida, discutimos os fundamentos e conceitos básicos como o que é um site responsivo, nome de domínio, servidor web, algumas ferramentas de produtividade para fazer anotações, estrutura de uma página web, cabeçalho, área de conteúdo principal e rodapé. Em seguida, aprendemos os conceitos importantes de UI e UX, a teoria de cores, paleta de cores, topografia em telefones, layout de página. Em seguida, aprendemos sobre os princípios de copywriting e as melhores práticas para escrever manchetes, conteúdo principal para a página inicial, blog e página de destino. Em seguida, discutimos os princípios de design gráfico e aprendemos a edição de imagens e vetores usando Canva e designer gráfico. Depois disso, começamos o passo número um no processo de criação de sites, que é descobrir. Aqui aprendemos a importância de entender o negócio, produtos e serviços antes de começar a criar o site, aprendemos a importância de entender os clientes e o mercado, como pegar referências e construir um biblioteca de modelos. Nosso próximo passo, leis para projetar o site e é muito importante para projetar o site completo. Antes de começar esse desenvolvimento usando o Elementor, ele criou o guia de branding e usou ferramentas de design como Figma para projetar todas as páginas da web para todos os três dispositivos, computador, tablet e telefone celular. Em seguida, começamos a etapa de desenvolvimento com a compreensão do nome de domínio. E também vimos como obter um nome de domínio gratuito para o site de prática. Então aprendemos sobre o plano de hospedagem, como obter um plano de hospedagem gratuito para o site de fatores e como usar as configurações de DNS para conectar o nome de domínio com o servidor web. Depois disso, instalamos o WordPress, fizemos algumas configurações comuns do Wordpress, instalamos temas e plug-ins e começamos com o processo de criação da página web. Então aprendemos como usar o Elementor e projetar as páginas web facilmente sem qualquer codificação. Bem, foi a parte mais importante a aprender em todo este curso de Maestria do site. Então vimos como construir o rodapé do cabeçalho, configurando o menu para o flipside, configurando um blog e página de aterrissagem. Então aprendemos como integrar nosso site com o Gerenciador de tags do Google, Google Analytics Search Console, acompanhamento de conversões do Google Ads, pixel do Facebook e um bot de bate-papo. Em seguida, o revisou as etapas para criar um site personalizado a partir do zero, para criar um site em apenas uma arte, e para criar um site de página única. Então aprendemos como otimizar o tempo de carregamento do site, criamos uma lista de verificação de lançamento do site e entendemos os benefícios do elemento ou através, juntamente com a visão geral de custos para criar um site. Então, finalmente, eu compartilhei algumas dicas sobre como iniciar um negócio de desenvolvimento de sites e como cobrar por um projeto de clientes. Então estes são todos os conceitos e técnicas que aprendemos neste curso de Maestria website sem codificação. Espero que tenha sido realmente e objetivos conhecedores e práticos para você. E eu tenho esperança de que você vai aplicar todos esses conceitos em seu trabalho e obter um enorme sucesso. E não se esqueça, você tem que completar a tarefa e compartilhar o link do site comigo que eu vou rever pessoalmente e dar-lhe feedback. Mais uma vez, agradeço-vos por aprenderem comigo e tudo de melhor. Faça bem. 58. O que vem a seguir?: Parabéns, você já está concluído com a aprendizagem do curso e agora você deve ir em frente e criar um site de prática. Você pode compartilhar o link comigo e eu pessoalmente revisarei o site. Sinta-se livre para receber feedback sobre cada etapa da fase de desenvolvimento e continuar a colocar as dúvidas assim que elas apareceram. Uma vez que você é feito com o primeiro site de prática, você pode começar a construir os outros para construir um portfólio sólido para mostrar aos clientes. E depois de concluir as etapas para iniciar o negócio de desenvolvimento de sites, você pode começar a tomar projetos. Você pode trabalhar em tempo integral ou meio período como indivíduo, como freelancer, ou você pode construir sua própria agência digital. E mesmo depois disso, se precisares de ajuda do cliente, estou sempre aqui para te ajudar. Não estou falando das próximas coisas. Há tantos conceitos relacionados com o SEO, marketing de mídia social, Google Arts, email marketing, blogs, marketing de afiliados, e muito mais coisas de marketing distante para aprender para você. Eu vou estar chegando com mais cursos sobre todos esses tópicos úteis e eu acredito que isso irá ajudá-lo a crescer ainda mais sua carreira e negócios. Então fique ligado e fique conectado. Vou atualizá-lo com os novos cursos, pois eles estão prontos para a inscrição. Tudo bem, então muito obrigado. E há um último vídeo chegando depois disso. Vejo você lá. 59. Compartilhe seus feedback e histórias de sucesso: Tudo bem, então eu terminei de falar e agora é a sua vez. Quero que me diga como foi a experiência do curso. Solicito que você dedique algum tempo e me forneça feedback sobre o conteúdo e a qualidade do discurso. Se possível, forneça um feedback detalhado para que eu possa entender o que todas as coisas estão funcionando para você e aspectos garrafa precisam ser melhorados nas pontuações do meu site. E se este curso lhe deu valor e transformou boas carreiras, compartilhe sua história na forma de um pequeno vídeo explicando nossa jornada antes do curso e depois do curso. Eu realmente apreciarei seu feedback e apoio. Mais uma vez, agradeço-vos e desejo-vos todo o melhor para o trabalho que se espera. E eu estarei aqui sempre porque você tem acesso vitalício a este curso. Então, onde você quiser revisar um tópico, basta reproduzir os vídeos de novo e de novo e de novo, tanto quanto você quiser. Tudo de melhor.