COMO CRIAR UM SITE GRÁTIS 2021 - CURSO DE BRIZY Aula 3

COMO CRIAR UM SITE GRÁTIS 2021 - CURSO DE BRIZY Aula 3

o olá pessoal tudo bem com vocês vamos aí para terceira aula do nosso curso de como criar um site grátis com grazi esse construtor de páginas aí que é muito legal muito eficiente para quem quer uma solução gratuita para ter um site certo essa é a terceira aula e olha só como ficou a minha página inicial eu tinha deixado aí para vocês como tarefa de casa alterar né os textos e fotos para deixar um site bonito beleza eu vou mostrar para vocês o resultado do meu site e também vou dar algumas dicas

e algumas alterações que eu fiz então vamos lá pessoal aqui na primeira parte ó eu simplesmente alterei a foto coloquei essa foto de curso de camba aqui o substitui aquelas fotos como eu disse você tem que colocar fotos bonitas fotos legais dá certo então aqui eu coloquei foto o jogo de cada ferramenta que eu ensino e coloquei com o efeito marca da água então coloquei aqui um longo de campo de grease e de wordpress certo o resto foi apenas alteração de texto que eu já ensinei na aula passada

aqui é o mantive a mesma foto né que já estava no template só que eu alterei todo o texto eu coloquei em português e algumas dicas aí que eu pretendo passar também aqui no canal curte sobe cursos online quer trabalhar com análise de dados as métricas do seu site como você vai fazer para ter uma presença online legal é positivo tá então aqui é mais um bloco do nosso site isso daqui eu vou explicar para vocês agora nessa aula porque é que eu mudei de ideia ao invés de deixa r a galeria com fotos

como eu já tenho aqui ó as fotos eu vou criar uma galeria né de vídeos onde eu vou colocar as primeiras aulas no curso que ofereço né e o curso ele é disponível gratuitamente no youtube mas aqui no site eu vou as três primeiras aulas para a pessoa já ver como funciona ou até mesmo ser um trailer né ao invés de uma aula beleza então a única coisa que eu fiz é ao invés de colocar foto eu vou colocar o vídeo como este daqui mas eu vou mostrar para vocês passo a p asso como é feito tá bom aqui eu não

mudei absolutamente nada quer dizer mandei uma coisa que eu vou mostrar para vocês também o restante foi apenas ter aqui falta colocar um texto em português lá depois eu faço isso e é só isso aqui ao teria apenas textos também certo então vamos lá para as dicas pessoal aqui ó eu nesse botão eu queria um efeito reverso o que que eu fiz quando eu for colocar as cores no na cor normal o botão ele é verde e a fonte branca mas não é feito rover o botão ele é branco e o texto verde então queria esse

efeito quando coloco o mouse as cores se invertem eu acho bem legal e é aqui como eu disse não teve nenhuma alteração eu apenas te bloqueei as fotos aqui também não teve então vamos lá pessoal olha só que legal né agora nós vamos trabalhar apenas com fotos vamos trabalhar com vídeos também neste caso um vídeo do youtube tem como que eu fiz ao invés dessa foto eu vou clicar na foto vou deletar a foto e agora eu vou arrastar um novo eleme nto aqui em cima a diele mente adicionar elemento você

vai vai procurar pelo widget de vídeo esse aqui clica e arrasta muito fácil e vou colocar em cima do meu título do efeito neon vai clicar aqui e a mesma coisa que imagem só que você vai ter que ter uma url de um vídeo agora clica aqui no crê e o tipo youtube ou vimeo só pode ser esses dois no meu caso é o youtube e vou colocar aqui a url do meu vídeo vou procurar aqui o meu cu e aí o nobel como que é aqui o efeito neon agora na efeito neon como criar o efeito neon no campo é esse vídeo aqui vou

copiar a url e simplesmente vou colocar aqui ó ele já puxou aqui o meu vídeo perfeito basta clicar fora e optei ti tá na aula passada eu esqueci de avisar para você nunca esquecer de aplicarem o update para atualizar as suas alterações certo então beleza que o efeito o pendente aqui pôster animado para instagram também tenho aula sobre isso eu procuro o meu vídeo esse daqui copiar o endereço ó e aqui é a mesma co isa eu posso deletar e já vou ensinar aqui algo de novo algo novo para você só vou

clicar aqui nesse meu vídeo vou duplicar e agora eu clico no vídeo e e arrasto o elemento para cá e pronto já facilitei aí um pouco tá clicou aqui no player e e aqui na nova url agora eu dou instagram e esse outro é poxa animado para instagram também mas que que eu vou fazer eu vou excluir esse último excluirá a coluna inteira então clica aqui no azul delete porque assim vai ficar maior o vídeo né eu acho que fica mais legal e aqui eu vou alinhar para direita e pronto então é assim que ficou

o pessoal assista agora e aí eu coloquei três aulas aqui para pessoa conhecer as aulas né antes de ir para o canal do youtube ou caso você queira vender um curso você pode colocar aqui um conteúdo de demonstração legal então é isso daqui eu quero ensinar para vocês também essa alteração que eu fiz ó aqui eram as tabelas de preços é mas o meu curso ele é grátis não tem preço então eu só sim plesmente coloquei aqui que os cursos são oferecidos no youtube e a que eu vou colocar um link para pessoa

ir para o canal e aqui eu coloquei site o que que eu quero passar para vocês eu queria colocar é em dois tamanhos tá o site a palavra site grande e o endereço pequeno cor sobe.com aqui já tinha duas colunas tão única coisa que eu fiz foi manter a primeira palavra site aí na segunda coluna e onde está o site você vem aqui em texto e muda somente o tamanho de ah tá então aqui foi muito fácil mas porque já estava pronto mas caso não esteja pronto basta você clicar aqui ou na no seu primo na sua

primeira coluna tá e nesse nessa borda rosa você duplica duplicar agora eu tenho duas palavras youtube a primeira eu vou ter que diminuir um pouco né porque a palavra é maior diminua ou aqui youtube e posso configurar o tamanho da segunda também clico na palavra texto e aí aqui eu posso deixar menor tá por exemplo youtube o ponto com o ponto com oi e o quê que eu fi z também eu centralizei só que aqui eu dupliquei também essa a linha de baixo não é para duplicar de baixo é só de cima então

vou clicar aqui certinha delete a e agora acabei do clicando dois lá é porque esse está em cima do youtube então aqui eu vou fazer o seguinte eu vou clicar nessa lista e vou deletar aqui no no na flash a cinza eu de leche ok agora sumiu um clico na de baixo e duplicou essa pronto é porque tinha ficado um bloco dentro do outro né uma lista essa bloco delí cia tinha ficado dentro do bloco youtube tá então assim você pode deletar e duplicar coluna então vamos lá esse texto ele está muito acima na eu

preciso deixar ele centralizado igual eu fiz aqui concurso sobe.com então eu vou clicar aqui no youtube não texto não vou clicar aqui na minha certinho rosa settings e aqui vai ser ao conteúdo centralizado e agora eu centralizei beleza então isso é caso você queira trabalhar com textos na mesma linha só que de fontes diferentes você dubl o el emento que aí você pode formatar tá o primeiro bloco e o segundo bloco certo mas eu vou deletar aqui e não se preocupem que vai ter uma aula que nós vamos

criar uma página do zero e aí nós vamos utilizar bastante todas essas configurações legal mas vamos lá alguma coisa ficou diferente sim eu tenho que voltar ao tamanho que estava antes no youtube que é o tamanho 44 e depois que vocês aprendem todos esses que minhas aqui fica muito fácil construir a sua página ou construir o seu sit e grátis com grazi beleza então essa essa era umas dicas pessoal que eu queria passar nas alterações que eu fiz tá assim a última dica aqui da nossa página é nesse

vídeo eu coloquei uma borda porque olha como fica o acabamento fica melhor né com essa borda do que sem como que faz a borda clica no seu ele vai clicar aqui ó emcolors e já está na borda né você vai alterar a cor da borda quando for vídeo e aqui eu coloquei a cor branca a branca não coloquei um pouco mais suave eu ach o que foi só essa configuração só isso só uma borda branca ligou aqui colors branco é um pouco mais suave aqui ah tá eu isso é uma preferência minha tá aí você faz se você quiser

eu não mas eu acho que como a bordo acabamento fica melhor beleza fiz as alterações o pendente eu vou lá no meu site o curso sob ponto brise ponto site né nem é tão feia url comparado com outros construtores de sites esse é bem tranquilo na seu nome ponto brisa quanto site e o atualizando a página pronto já tem o meu site ó criado completo posso divulgar daqui produtos caso você seja afiliado alguma coisa pode até integrar com e-mail marketing não se vocês quiserem podemos fazer isso aí no

decorrer do curso para isso eu preciso de um feedback de vocês pessoal preciso que vocês comente o quê que vocês estão achando dessa ferramenta se vocês querem né que o módulo aqui continue o curso continue porque se ninguém estiver interessado aí não tenho porque fazer um curso muito extenso ma s vocês dão feedback nós vamos avançando cada vez mais aqui no nosso site tá legal então vamos lá pessoal mas não é só isso que eu queria passar nessa aula nessa aula eu quero explicar para vocês o

conceito de blocos pô o que vai fazer com que vocês consigam criar páginas completas e sites completa legal esse é o site que nós temos já criamos todo o conteúdo da página inicial já está pronto mas agora falta a parte de customização né falta o estilo do site então vamos lá quando você está aqui ó editando o seu site você pode perceber que as vezes aparece esse botãozinho aqui esse daqui são as configurações do bloco tá toda a nossa página ela é feita por blocos por exemplo vamos pegar aqui o

nosso primeiro bloco vou clicar aqui e aqui eu tenho algumas opções ao vamos para cores ele tem uma cor verde se eu colocar a roxa o que acontece eu mudei a cor de fundo do meu bloco tá é isso que vocês precisam entender que é para vocês entenderem como funciona com soluç ão da página nada mais é do que uma sequência de blocos então eu tenho meu primeiro bloco q a roxa pode o segundo bloco vou colocar aqui preto o terceiro bloco já tem essa cor aqui mas só para ficar mais claro ainda vamos

colocar esse laranja tá o quarto bloco eu vou colocar aqui no seu cinza bom e mais um bloco vamos deixar de ser bloco aqui na cor verde claro que eu não vou deixar o pó você tem que ir tem que pegar aqui o o bloco correto não pegar esse bloco cor roxo tá claro que eu não vou deixar essas cores né está ficando bem feio assim é apenas para ficar claro a onde começa e termina a cada bloco tá e se eu quiser adicionar o outro bloco venho aqui blocos coloco esse e aí vai ter toda essa formatação que

você já aprenderam inclusive a cor de fundo posso mudar também beleza mas isso daqui não vamos colocar bom então vamos lá pessoal já entenderam né cada parte do site é um bloco aí agora ficou muito claro porque dá para perceber pela cor de fundo be leza então vamos ver que configuração tem para os blocos aqui no meu primeiro ó vou clicar aqui eu em bloco e aqui isso daqui é se é global né não não vamos utilizar isso ainda quando ele segunda opção vai ser no tipo de fundo você pode colocar uma

imagem como fundo né ao invés da cor mas eles são é um pouco mais complicado porque aí você vai trabalhar cover lê isso nós podemos fazer quando criarmos nosso site do zero então por enquanto vamos manter a que o layout que nós estamos utilizando tá então nosso background não é de não é foto e também não é vídeo vamos para cores porque eu é a cor verde como vocês já sabem cor roxa na como vocês já sabem vocês podem escolher qualquer cor para colocar aqui como cor de fundo do bloco é legal eu vou

deixar aqui estava antes que é esta daqui certo bom então vamos ao borda também se você quiser colocar aqui alguma borda mas eu acho que fica bem feio né não fica não acho legal não mas eu vou deixar aqui apenas como exemplo oi aqui é se você quer salvar elas configurações seu bloco né eu não vou salvar depois eu vou resetar toda essa configuração e 79 vamos ver daqui a pouco e aqui assim você quer simplesmente o duplicar o seu bloco tá então por se por algum motivo você vai ter um bloco padrão

e quer copiar toda a formatação você copia e se você quiser excluir um bloco você de lé beleza bem fácil né se vocês ficarem com dúvidas deixe nos comentários ok que aí eu vou respondendo nos vídeos seguir bom en tão vamos lá agora vamos para 7:00 aqui a largura eu recomendo que vocês não mexa tá vamos deixar assim até porque esse site é responsivo assim vai aparecer no computador e assim vai aparecer no tablet e assim vai aparecer no celular tá para que seu site fique responsivo ele tem que ser

construído é com um determinada configuração então se você ficar mexendo na largura da sua página pode ser que prejudique a visualização quando alguém for acessar com celular tá legal vou clicar aqui novamente a desktop então vamos lá então essa largura ó boxer e fu nós não vamos mexer vamos deixar assim certo já depois nós até podemos trabalhar com isso futuramente mas por enquanto vamos manter nosso template e aqui altura eu também recomendo que você deixe alto porque a altura vai se ajustar

a automaticamente ao conteúdo ou seja se eu por exemplo o cara essa foto é duplicar a largura aqui ele vai duplicar no na coluna na então vamos lá de leche eu vou adicionar aqui um element o eu vou adicionar uma imagem aqui embaixo por exemplo então a o como vocês podem ver o meu bloco né que é esse acordo de fundo verde e ele acompanha tá então a altura é automática ok em settings é a altura alto recomendo que vocês deixem assim vamos ao maior sete aqui pessoal como eu disse você vai trabalhar

com uma série de espaçamento tá antes de eu eu recomendo que vocês vão aos poucos beleza não fique mexendo muito nisso esse caso vocês não tenham conhecimento sobre pede sobre margem sobre distanciamento de cada elemento tá só puxar como exemplo esse primeiro é o pede que é o espaçamento superior então se você está 15 pixels e você aumenta você vai criar um espaçamento aqui em cima tá eu recomendo que vocês deixem assim porque o template ele já foi muito bem desenvolvido construído por designers

profissionais então o caso você não seja um bom designer eu recomendo que você mantém aqui o nosso template beleza então pede aí nós não vamos mexer margem também n ão única coisa aqui que eu acho que vale a pena a trabalharem por enquanto é esse divisor vocês estão vendo aqui ó divisor essa esse primeiro bloco ele tem essas ondas aqui no final isso é o divisor a tem alguns blocos que não tem igual esse laranja não tem você pode escolher se você quer colocar ou não vamos retirar o divisor do

nosso bloco venho aqui settings your settings e aqui o divisor e tipo vou colocar nome tão pronto agora ficou igual os outros blocos eu não tem mais div isor esse último tem continua tendo tá então você escolhe se você quer ter ou não o divisor eu vou tirar essa borda vermelha porque está até atrapalhando a a nossa visualização é o que eu quero deixar se assim aqui é o nome tá então eu vou deixar sim que olha agora o meu bloco ele não tem divisor então vamos lá certinho see more settings divisor

aí você pode escolher e tem essas opções e você rolando aqui ó rolagem lá tem outras opções aqui estava eram de ondas na vamos ver aqui esta va era essa daqui ó de ondas mas você pode escolher qualquer uma até a mesma até mesmo umas bem feiona só bem horríveis na aí vai seu critério você quer ter um site feio você coloca aqui depende né do assunto mas você quer ter um site mais feio e coloca esses esses daqui beleza mas agora falando sério você pode escolher aqui ó qual você quiser tá tem alguns

efeitos aqui você vai controlar a intensidade tá dessa borda e você vai controlar a se ela está por baixo ou por cima dos elemen tos se eu colocar por cima vai cobrir o botão uma parte da imagem beleza então aqui você tem que dedicar um tempo recomendo que vocês pratique bastante com todos os divisores só porque às vezes você até consegue criar um efeito legal por exemplo eu vou pegar aqui só isso vamos supor que não tivesse o botão tivesse só essa imagem aí eu colocava por cima ó dá para criar

eu vou até sair daqui e olha para criar umas efeitos a até interessante é claro que aqui está pegando o botão não fi cou bom mas se não tivesse o botão ia ficar até legalzinho né mas enfim aí vai da preferência de cada um também beleza eu vou manter o que estava então vou colocar aqui na amazonas e por baixo dos elementos e se vocês não tem noção de design pessoal mantenham o padrão do template tá não fica inventando muita coisa que vocês vão estragar o template que era bom certo então é isso aí

pessoal aqui nós trabalhamos com configurações de bloco e aí todas essas configurações serão mantidas pa ra os outros blocos na igual aqui nós colocamos essa cor de fundo que não tem nada a ver vamos voltar para o que era descascada branco né então voltou a ficar bonito aqui a parte superior esse laranja posso até deixar né porque dá um contraste eu tava bem claro bem claro de repente cor laranja legal só que esse cinza não tem nada a ver não posso vou pode voltar a ficar assim ou ficar branco

mas acho que estava nessa cor né e eu qualquer forma eu vou resetar toda a configuração esse rosto aqui eu acho que não ficou legal eu vou voltar e vou colocar cinza tá estava cinza ou acho que era esse lá e aí você vai mexer lá quero colocar um divisor aqui no laranja fashion is more settings é divisor taiff quero colocar esse divisor aqui ó só que ficou preto né eu quero branco para combinar com a parte de cima então ao invés de preto vou colocar branco como que ficou ficou bem legal né acho

que é claro que aqui ficou é mais arredondado e aqui fica o reto então talvez nã o seja a forma mais interessante mas as cores eu acho que ficou legal o formato desse divisor e ficou legal tá então você vai trabalhando só que aqui ó eu acho que ficou muito hente do texto então eu clico aqui settings more settings divisor e vou suavizar um pouco a quero um pouco mais para cima tá bom ou ainda é isso daqui eu quero ensinar depois mas só para vocês terem uma ideia como o texto está próximo do

divisor que que eu vou fazer eu vou criar um espaçamento nesse bloco para distanciar o meu texto é a minha foto então eu clico aqui vou em 7 more settings e aqui no espaçamento superior eu vou colocar mais espaço tá e aqui foi para 100 pixels vamos ver o esse é o máximo aqui sem vamos ver e nas pode colocar mais até vou deixar 200 pixels de espaço amém então ó deixei uma área de respiro aqui na os arc-200 ficou muito volta aqui no ar settings e aqui no pad a 150 o e espaçamento tá então assim

você vai ajustando pede mas isso eu explico para vocês q uando você estiver um pouco mais familiarizados com a ferramenta beleza então é isso aí pessoal água vamos ver aqui é esse tá essa cor laranja eu gostei acho que eu vou manter então aqui eu vou manter do jeito que está aqui também e esse lado eu achei que combinou com o nosso layout esse divisor aqui também aqui eu vou manter e aqui tá então eu posso até salvar do jeito que está aqui né como eu coloquei as cores novamente ficou legal a

então o fio date a e agora visualizando o me u site que já está online vocês mesmo sair podem visitar o curso sob controle cê ponto o site e pronto já tenho o meu site completo é bonito profissional posso utilizar esse site para divulgar os meus cursos no youtube caso eu vendo algum curso posso divulgar isso daqui para vender os cursos né como uma página de vendas divulgar as minhas redes sociais mas aqui falta colocar link que acho que vamos fazer na próxima aula tá bom então pronto criamos um

site profissional grátis de form a fácil rápida e um site muito bonito mas ainda tem muitas coisas que eu quero ensinar como por exemplo criar as páginas internas e principalmente colocar os links nos botões bom e algumas estratégias de link aí por exemplo link âncora acho que vocês vão achar bem legal mas aí fica para próxima aula beleza pessoal espero que vocês tenham gostado dessa aula e nesse curso de como criar o site querer as com base e deixe nos comentários o feedback de vocês para eu

saber se vocês estão

Aprenda de uma vez por toda montar seu negocio online em casa.

Clique no botão a baixo para acessar varios cursos gratis.