Como Criar um Site Fantástico com o Criador de Sites da HostGator

Nesse vídeo eu vou te mostrar do zero, o passo a passo de como você pode criar um site com uma   qualidade profissional, através do criador
de sites da HostGator. Uma ferramenta   extremamente simples, por onde é possível criar um site com uma simplicidade incrível mesmo, em   apenas alguns minutos. E o melhor de tudo, sem você precisar saber nada de programação ou códigos. Se   interessou? Então vem comigo. Fala galera, beleza? Eu sou o Darlan Evandro e seja bem-vindo para mais um   vídeo. Sem enrolação, no vídeo de hoje eu vou te mostrar o passo a passo para você criar um site   com qualidade profissional através do criador de sites da HostGator. Antes de começar você precisa   saber duas coisas bem importantes antes de criar o seu site. O criador de sites da HostGator é uma   ferramenta que está inclusa dentro de qualquer plano de hospedagem da HostGator. Ou seja, você   pode ativá-la a qualquer momento dentro do seu painel de hospedagem. Inclusive, em todos os planos, o   criador de sites já possui loja online integrada. Uma opção bem interessante para você que busca   vender através da internet. E se você ainda não utiliza a HostGator, vou deixar aqui na descrição   desse vídeo o link, com desconto especial, para você que é inscrito aqui no canal. É só acessar o   primeiro link da descrição. Agora nós vamos aqui para a tela do computador para começar a criação   do nosso site, do absoluto zero. A primeira coisa que você precisa fazer é ativar o criador de sites   dentro do seu plano de hospedagem. Assim que você faz a contratação de qualquer plano da HostGator   você tem acesso à área do cliente que é essa área que nós estamos vendo aqui na tela. Você tem   opções de gerenciar o seu site, seus e-mails, seus domínios, seus produtos, entre várias outras coisas   dentro do seu painel de hospedagem, aqui no caso da HostGator. Se você tiver alguma dificuldade vou   deixar aqui na descrição alguns links complementares, caso você tenha alguma dúvida até chegar aqui.    Acessando seu painel de hospedagem, seu painel de cliente, você só vai precisar encontrar o seu   domínio, no caso o domínio que você tenha realizado contratação, aqui dentro do plano de hospedagem,   e você vai selecionar a opção “ativar criador de sites”. Vou clicar aqui para a gente começar a nossa   configuração. Agora é tudo muito tranquilo. A primeira coisa que você precisa inserir aqui   dentro é a categoria que o seu site se enquadra. Você está criando um site para que? É um site de   um comércio? O que é o seu site? Você vai
colocar aqui, vai digitar a categoria. Existem   algumas categorias salvas aqui, por exemplo, padaria. Você vai buscar aqui a categoria. No caso,   eu vou digitar aqui “Marketing Digital”, que seria um site pessoal. Então já temos aqui o Marketing   Digital e vou clicar na opção “continuar”. Depois de escolhida a categoria nós precisamos colocar   um nome para o seu site. Pode ser o seu próprio nome, o nome da sua empresa. Aí você vai decidir conforme    você vai desenvolvendo o seu projeto. Depois nós conseguimos alterar isso. Então não tem problema   se você quiser modificar posteriormente. Eu vou colocar aqui o nome do site de “Darlan Evandro”   mesmo. E vou clicar em “continuar”. O próximo passo é escolher uma capa para o nosso   site, um visual, um banner para gente utilizar aqui, como o início, como a primeira página do nosso site.   A própria ferramenta do criador de sites busca algumas imagens dentro do Unsplash, que é   um banco de imagens bem bacana. Então nós temos aqui algumas opções de acordo com a categoria   de site que você escolheu. Mas você também pode fazer o upload. Clicando no botão “fazer upload”,   vai ser aberta a janelinha para você procurar a imagem que você deseja colocar aqui na capa do   seu site. Eu vou utilizar como exemplo da
própria ferramenta, vou selecionar essa lâmpada   que está bem bacana. Vou clicar em “continuar”. E você precisa também enviar uma logo, uma logomarca   para ilustrar o seu site. Para fazer isso é só você clicar aqui novamente e fazer o upload dessa logo. Caso   você não tenha logo você pode continuar sem enviar a logo. Não tem problema nenhum. E se você não tem uma   logo e quer aprender a fazer, já tem um vídeo aqui no canal, que é “Como criar uma logomarca”. Eu vou deixar   esse vídeo aparecendo aqui no card, vou deixar aqui na descrição também. Eu vou pular essa etapa, vou   clicar em “continuar” e nessa etapa aqui nós vamos trabalhar um pouco o visual do site. Você vai poder   escolher as fontes que você deseja usar no seu site. Então nós temos aqui algumas opções, que daí   clicando, automaticamente vai ser alterado no layout do site. Então você pode ir visualizando   de acordo com a identidade visual da sua marca, da sua empresa. Você pode clicar, navegar nas fontes,   o que ficar mais bacana você avança. Eu acho bem legal essa “Catamaran”. É uma fonte   bem bacana, mas você pode escolher aquilo que fique mais bacana de acordo com a sua empresa. Escolhi   a fonte, vou clicar em “continuar”. Você também pode escolher algumas cores do seu site, vai fazer   algumas alterações aqui nos botões, então você pode colocar aqui um branco com azul escuro, por exemplo.   Temos aqui verde, amarelo. Então você vai escolher uma paleta de cores de acordo com a identidade   visual da sua marca. Você pode manter aqui também o tema claro ou o tema escuro, ele vai fazer essa   alteração. Gosto de manter o tema claro, mas isso vai ser uma particularidade sua. Você vai escolher   o visual do seu site. Escolheu as cores é só
clicar em “continuar” que nós vamos escolher   o estilo de navegação. Nós temos aqui alguns estilos, por exemplo, esse primeiro ele muda   o formato do menu, nós temos um segundo estilo, terceiro estilo. Então você vai escolher qual    estilo fica mais bacana. Isso é só uma questão de gosto, de visual. Eu vou manter esse primeiro aqui   que eu acho que ele fica bem legal. Vou clicar em “continuar”. Nessa etapa você vai inserir os detalhes   de contato, nome da sua empresa, endereço, telefone, cidade. Você vai preencher essas informações para   que ela seja exibida no rodapé do seu site. Essas informações de contato para o seu cliente poder   entrar em contato com você. Depois de preencher é só clicar em “Enviar”, e praticamente a estrutura   funcional do nosso site já está pronta. Agora a gente só precisa fazer os ajustes finos. Você   vai trabalhar os textos do seu site, você pode alterar os menus, você vai poder trabalhar o   visual dos blocos, você pode acrescentar páginas, excluir páginas, adicionar novos blocos dentro no seu site. Então é isso que eu vou te mostrar como fazer agora em detalhes. Antes de começar a   editar, tenho dois recados bem importantes. Aqui na parte superior, nessa barra superior, nós temos   alguns botões bem importantes. Temos o botão “preview”, clicando no “preview” você vai ver como seu   site está ficando. Então você vai poder navegar no seu site, clicar nos menus. Vamos clicar    na página “contate-nos”. Então você vai visualizar completamente como seu site está ficando. Clicando   em “voltar”, você volta para a edição. Aí você vai alterando, vai editando as informações e você   vai utilizar o botão “salvar”. Aqui ele está como “salvo” porque eu ainda não fiz nenhuma edição.   Mas é muito importante que, conforme você vai acrescentando informações, editando, você vá   clicando em “salvar”, para você não perder
o progresso de atualização do seu site. Editou um    texto, editou um banner, clica em “salvar”. Ele vai salvando automaticamente também, mas para garantir,   por precaução, vai clicando no botão “salvar”. Terminou de fazer todas as edições, mexeu em tudo que   você queria no seu site, é só clicar no botão “publicar” que o seu site vai para o ar. Então vamos lá,   vamos aprender como editar o seu site. Aqui nessa parte do meio, praticamente você tem acesso, você consegue   modificar tudo que você quer do seu site. O site é dividido em blocos, então nós temos aqui   o bloco superior, que é o bloco de navegação, temos o banner que seria a capa do seu site,   temos um segundo bloco que é de imagens e textos. Então você vai fazendo as edições   em blocos. Selecionei esse bloco aqui do meio, por exemplo, esse bloco do Banner. Como você pode   ver nós temos setinhas laterais. Se você clicar no “avançar” ele vai colocar um novo layout. Então você   pode ver como fica esse layout, esse segundo layout, uma nova versão desse bloco.   Inclusive, se você selecionar o bloco aqui na parte da direita, nós temos o layout 2 de 10. Ou seja,   você tem 10 versões visuais desse bloco do Banner. Então você pode colocar o segundo, o terceiro, o quarto,   o que você desejar, o que você achar mais interessante, de acordo com o site que você esteja criando. E em cada   bloco, assim que você seleciona o bloco, por exemplo, vamos manter aqui no banner. Você pode manter aqui   o título, aqui você desativa ou acrescenta o
título, subtítulo, a mesma coisa. A descrição também,   e os botões também. É bem simples de acrescentar ou remover conteúdos dentro do seu bloco. Temos também   uma outra configuração que é o tamanho da sessão. Se você quer que esse bloco seja um bloco tamanho   G, M ou P. Vai trabalhando esse tamanho aqui e para editar o texto é só você clicar aqui dentro   do texto e você vai e editar esse texto inicial. Então eu coloquei “Seja bem-vindo ao meu site”. Daí   você vai começar a colocar suas informações aqui, editando todo seu site. É só você clicar e fazer as   edições textuais. De imagem também é bem simples de fazer, você vai clicar na imagem que você deseja alterar.   Nós temos aqui o “editar imagem” para você editar essa própria imagem. Temos o “selecione a imagem”   que daí, aqui no caso, você pode usar imagens do banco de imagens conforme eu já falei aqui para   você. Você pode usar o campo de busca também para encontrar uma imagem que você deseja ou você   pode usar suas próprias imagens, se você tiver um produto, serviço e tiver imagem disso, você   vai clicar em “minhas imagens”. Aqui no caso eu ainda não tenho imagens porque eu não adicionei   nada. E você vai clicar em “adicionar imagem”, vai clicar em “procurar arquivos”, daí você vai   conseguir enviar imagens do seu próprio computador para o seu site. Basicamente é isso a edição    principal do seu site. Aqui do lado esquerdo nós temos alguns botões muito importantes que   vão fazer diferença na criação, na edição do nosso site. Um último detalhe aqui do bloco, se você quiser   editar o botão do seu site, você vai clicar no botão, automaticamente nós vamos ter algumas opções desse botão.  Se você quer que ele seja tamanho pequeno, médio ou grande. Vou continuar no pequeno. Aqui   você vai trabalhar “preenchimento do botão”. Se você quer só a linha do botão ou quer ele preenchido.   Estilo do botão, você vai escolher a cor desse botão, uma cor personalizada por exemplo. Você vai   também conseguir editar o link. Clicando em “link do botão”, você pode colocar o link para   uma página interna do seu próprio site, que daí você vai escolher qual página que você deseja   linkar, pode ser o endereço da web, que daí você vai colocar uma URL aqui, o endereço de e-mail,    um telefone, um documento ou então deixar esse botão sem link. Você tem algumas opções, beleza?   Bem tranquilo de fazer. Aqui do lado esquerdo nós temos botões muito importantes. Clicando em   “seções”, por exemplo, você vai ter todas as seções disponíveis para você acrescentar aqui no seu site.   Então temos aqui o blog, por exemplo. Temos várias opções de Blog que você pode acrescentar dentro do   seu layout. Temos a opção “loja”, essa sessão loja eu já falei detalhadamente sobre ela no vídeo   no canal do CollabPlay. Nós criamos um site, uma loja do zero, utilizando o criador de sites   da HostGator. Vou deixar esse vídeo aparecendo aqui no card e na descrição do vídeo também, caso você deseje vender produtos online. Aqui em categorias temos aplicativos, temos assinar,   temos avaliações. Então, você vai selecionar qual categoria, qual seção você deseja    acrescentar no seu site e do lado direito nós temos as opções que você pode inserir. Então, por   exemplo, vamos imaginar que eu queira adicionar uma sessão de avaliações dentro do meu site.   Clique em “avaliações”, vou selecionar o layout que fica mais bacana, vou clicar nesse layout para ele ser   transferido para meu site, para minha página. E o que aconteceu? Ele veio para a   parte superior do meu site, mas eu quero essas avaliações mais para baixo. Eu vou clicar aqui nessa setinha,   ele já vai mandar essas avaliações para baixo do Banner, eu posso descer mais um pouco, descer mais.   Pronto, aqui está legal. E daí você pode editar os textos aqui, editar a   imagem, colocar a imagem do seu cliente, colocar depoimento do seu cliente, quantidade de   estrelas que ele deu para o seu produto. Então, bem tranquilo de fazer. Terminou de editar, lembre-se   de clicar no botão “salvar” que está aqui na parte superior. E daí você dá uma navegada aqui nas   sessões e ver o que você precisa adicionar no seu site, uma capa, um cardápio, uma contagem regressiva,   que é legal para fazer lançamento, informações de contato, dados, depoimentos, enfim, tem muita coisa   que você pode colocar aqui no seu site. Depois de sessões nós temos o menu “páginas”. O que   é o menu páginas? Você vai ter acesso a todas as páginas que você já criou. Essas quatro já vem e  assim você ativa o criador de sites, essas quatro páginas já vem pré-configuradas. Se você quiser   selecionar, visualizar alguma dessas páginas, é só você clicar na página correspondente, clicou   aqui na página “contate-nos”, então nós já estamos visualizando essa página. Aí você pode editar   da forma que você quiser editar o formulário de contato, editar a imagem, enfim. Voltando em   “páginas”, a mesma coisa as outras páginas. Se você quiser criar uma nova página clica no menu “páginas”,   “nova página” e daí você vai colocar “qual é o nome dessa página”? É a página “produtos”, por exemplo.   A URL da página é preenchida de forma automática. Aqui na parte superior nós temos uma opção de SEO    também, que você vai colocar o título da página. Isso aqui é bem interessante para otimizar sua   página para os motores de busca. Você coloca o título da página, a descrição da sua página e   aqui ele vai trazer uma pré-visualização do site nos resultados do Google. Preencheu, é só clicar   em “aplicar”. Daí nós já criamos a nossa página “produtos”. Ela vem sem nada aqui porque você vai   precisar inserir as seções na sua página. Você pode colocar aqui uma capa, você vai clicar aqui   em “capa”, selecione a opção, ele já é transferido para sua página “produtos”. Daí você vai editar, vai   trabalhar sua página “produtos” e automaticamente essa página é acrescentada nos menus, que daí   facilita muito a navegação no seu site. Depois de páginas nós temos o menu “tema” que você pode fazer   algumas modificações, tipo aquele que a gente fez lá no início. Temos aqui as cores, fontes, efeitos   que você pode colocar, ativar as animações no seu site, conforme ele carrega ele faz algumas   animações. Então você pode dar uma navegada aqui também. Eu não vou mostrar em detalhes porque isso   aqui é bem simples. Se você quiser trabalhar o visual do seu site é só vir aqui em tema. Depois   do tema nós temos o menu “ajustes”. O que é o ajuste? Aqui em “meu site” você pode editar as   informações principais do seu site, como é o caso do nome, logo, esse “fav icon” que é esse ícone que é mostrado  aqui do lado do título na aba do navegador. Temos a opção de SEO para você   otimizar o seu site para os motores de busca. Temos a questão de acessibilidade para você escolher o   idioma que seu site está escrito, foi criado. Então é bem legal que você preencha isso daqui.   Em “informações gerais”, são suas informações de contato, o nome da sua empresa, endereço.   Em “contato” você vai colocar seu endereço de e-mail, telefone e horário de funcionamento você   pode colocar também. Redes sociais, você vai colocar o link das suas redes sociais, Facebook, Twitter e   Instagram, o que você tiver você pode acrescentar aqui que daí vai aparecer um ícone lá no   rodapé do site. Aqui em “Google Analytics” você vai inserir o “ID”, o ID do seu Google Analytics, para   você rastrear tudo o que acontece no seu site. Quais são as páginas mais acessadas, de onde vêm   os acessos, entre diversas outras informações. Se você tiver alguma dúvida sobre como criar   o Google Analytics vou deixar um link complementar aqui na descrição do vídeo. Aqui em “jurídico” nós   temos o termo de serviço. Se você tiver algum termo de serviço do seu site, pode colocar aqui.   Essa “Política de Privacidade e GDPR”, isso daqui é o regulamento geral sobre a proteção de dados.   Se você quiser saber mais sobre isso eu vou deixar um link aqui na descrição também, porque é   algo relacionado a privacidade de dados. É muito importante que você olhe isso aqui também. Para   finalizar os ajustes nós temos “inserir código HTML”. O que é isso? É para você inserir um código   específico no seu site, um botão personalizado, uma ferramenta de chat, um pixel do Facebook, é para   isso que serve esse “inserir código HTML”. Se você precisar inserir algum código personalizado aqui   dentro é por aqui que você vai fazer isso. Depois dos ajustes nós temos o menu “loja”. Esse menu eu já   falei detalhadamente no vídeo lá no canal do CollabPlay, como criar uma loja pelo criador de sites, agora eu   não vou ativar isso. Se você quiser ver em detalhes como criar, como ativar, como fazer toda a configuração da   sua loja é só visualizar esse vídeo. Beleza? O menu “Blog” funciona basicamente da mesma forma que   a loja. Você precisa ativar. Eu vou clicar aqui em “ativar” só para você ver como que é simples.   Vou clicar em “vai em frente”, a ferramenta já está adicionando um Blog. Pronto, um Blog,    adicionamos um Blog ao seu site. Vou clicar aqui em “criar post” e daí você vai escrever um arquivo   de Blog que vai ser exibido dentro do seu site. Eu vou colocar um artigo de teste, você tem a    opção “título da publicação, introdução e o texto do seu artigo”. Temos também a configuração de SEO,    para você trabalhar título, descrição e URL
do seu artigo. E você também consegue adicionar   categorias e uma capa para o seu arquivo no Blog. Terminou de colocar todas as informações e só    vir em “publicar post”, “publicar agora”, e essa publicação vai estar ativa dentro do seu Blog. Aqui   é por onde você faz todo o gerenciamento do seu Blog, dos seus artigos. Eu vou clicar em “voltar” para você visualizar que esse artigo já está dentro da nossa página. Clicando aqui   em “Preview” nós já conseguimos visualizar esse artigo. Beleza? Vou clicar em “voltar”, vou   clicar no botão “salvar”. É muito importante que você vá salvando. E para finalizar, o último menu é o   menu “dados”, que por aqui você tem acesso a todas as informações do seu site, quantidade de visitantes,   taxa de rejeição, tempo de sessão, relacionado a visitantes únicos, quantas visitas você   recebeu, mapa de visitantes, de onde estão vindo os acessos, estatísticas de página, tem bastante coisa   interessante aqui dos dados. É basicamente igual ao Google Analytics. Só que aqui é a ferramenta   da própria HostGator. Voltando aqui, as observações muito importantes, sempre salve as alterações que   você faz no seu site. Se você quiser pré-visualizar como está ficando é só clicar no botão “preview” que você   vai conseguir ver como ele está ficando. Ficou legal, está bacana, se você quiser publicar o seu site é só   clicar em “publicar” e todas as alterações,
todos os ajustes que você fez serão publicados   no seu site. Bom pessoal, nesse vídeo você viu o passo a passo completinho de como criar o seu   site do zero, utilizando o criador de sites da HostGator. Essa é uma ferramenta muito legal,   muito útil, principalmente para você que não tem conhecimento em programação, conhecimento   em criação de sites. Como você viu é possível criar um site completo sem grandes dificuldades.   Na verdade é bem fácil usar esse criador. Eu espero muito que você tenha gostado desse vídeo.   Se você gostou não se esquece de deixar o seu like no vídeo, se inscrever no canal, porque isso é muito   importante para mim. Eu vou ficando por aqui. Um grande abraço e até o próximo vídeo.