Quer vender online o seu produto, curso ou serviço único, mas não quer fazer de qualquer jeito? Neste post, eu te ensino a criar um site de uma página só para vender diretamente pela internet utilizando o PagSeguro.
Prefere o PayPal? Tem versão do tutorial com ele também, clica aqui! →
A página criada a partir deste tutorial terá:
- Layout minimalista focado no seu produto e no botão de venda;
- Design responsivo para se adequar a diferentes tamanhos de tela;
- Título, imagem de destaque e descrição para você detalhar o que vende;
- Botão de pagamento através do PagSeguro;
- Domínio e hospedagem próprios para profissionalizar o acesso à página.
O jogo será direto e prático. Com esta página pronta e publicada, você poderá compartilhá-la nas redes sociais, colocar no link da bio, mandar, por e-mail ou mandar diretamente aos interessados de maneira prática e com acabamento profissa; nada de links complicados ou vinculados a serviços gratuitos que comprometem a confiança do seu futuro cliente.
Estes são os passos necessários para criar sua página de vendas:
- Registro de domínio próprio e hospedagem para a página;
- Cadastro no PagSeguro e criação do botão de pagamento;
- Preenchimento das informações da página e preparação dos arquivos;
- Publicação da página!
Vamos começar!
Parte #1: Registro de domínio próprio e hospedagem para a página
O pontapé inicial precisa ser a compra do domínio e do plano de hospedagem que colocará sua página na Internet. Sem estes dois serviços, seu site não existe!
Os passos são praticamente padrão para a maioria dos serviços de hospedagem. Este tutorial é baseado na Hostgator, que utilizo e recomendo, mas você pode replicá-lo na empresa de sua escolha. Além da Hostgator, eu recomendo também (por já ter utilizado) a Hostinger e a Bluehost.
Passo #1
Comece clicando aqui para abrir a página da Hostgator. O plano P é suficiente para começar (e vem com domínio grátis em planos de 1 ano ou mais). Clique em Adicione ao Carrinho.
Passo #2
Escolha a frequência do pagamento conforme sua necessidade e clique em Continuar.
Passo #3
Escolha “Vou registrar um novo domínio” e preencha no campo o endereço que quer para sua página de vendas. Escolha a terminação (a mais comum é .com.br) e preencha seus dados pessoais. Revise as informações de cobrança conforme o plano escolhido e clique em Finalizar Compra.
Feito!
O provedor de serviços (Hostgator, no nosso caso específico) vai ativar seu plano e o endereço do site. Note que a ativação do plano pode ser automática de acordo com a forma de pagamento escolhida, mas os endereços de sites registrados podem levar até 24 horas para entrar no ar.
Parte #2: cadastro no PagSeguro e criação do botão de pagamento
Agora vamos fazer sua conta no PagSeguro (pule se já tiver) e gerar o botão de pagamento para sua venda. Vale ressaltar que o PagSeguro cobra tarifas para vendas online, consulte aqui os valores no site da ferramenta →
Passo #4
Para criar sua conta no PagSeguro, acesse o site, escolha Acessar Minha Conta e depois, Criar Conta. Se já tiver uma conta, escolha Entrar e pule o passo seguinte.
Passo #5
Escolha entre Conta Pessoal ou Para o Meu Negócio, preencha seu celular e clique em Continuar. Preencha seus dados e finalize o cadastro.
Passo #6
Para criar o botão de pagamento, acesse o painel de sua conta do PagSeguro e deslize na página para encontrar a opção Link de pagamento. Na página seguinte, clique em Criar novo link de pagamento.
Passo #7
Preencha os campos da página com as informações do que vai vender: Produto ou serviço e Valor. Clique em Continuar.
Na sequência, você pode informações de Frete e envio, Quantidade (caso seja limitada) e Data de expiração (caso sua venda seja temporária). Depois de preencher o que aplica ao seu uso, clique em Criar Link de Pagamento.
Passo #8
Você precisa agora copiar o código do botão que acabou de criar para usar na sua futura página.
Localize o código do botão na caixa Botão de Pagamento (destacada abaixo) e clique em Copiar. Cole em um arquivo de texto ou mande o código para você mesmo por e-mail, nós vamos utilizá-lo mais à frente.
Parte #3: escolha do layout da página e preparação dos arquivos;
Este é o trecho do tutorial onde eu lhe entrego um presente… ou melhor, três! Criei três opções de layouts de página de vendas prontas para você usar!
Todas seguem o mesmo modelo com…
- Título: nome do produto ou chamada para fisgar as atenções;
- Foto: imagem do que você oferece;
- Descrição: detalhes da oferta;
- Código do botão: aqui vamos utilizar o código do PagSeguro que você copiou no passo anterior;
- Informações de contato: pode ser seu e-mail de trabalho, o número de seu celular com WhatsApp, telefone fixo ou qualquer outra informação que preferir;
- Botões de compartilhamento: ícones para ajudar os seus visitantes a compartilhar sua página; já estão configurados para funcionar automaticamente.
Passo #9
Escolha o layout que preferir e clique em Baixar para fazer download dos arquivos!
BAIXAR LAYOUT 1
BAIXAR LAYOUT 2
BAIXAR LAYOUT 3
Passo #10
Agora, você vai personalizar a página que você escolheu com as suas próprias informações.
Descomprima o arquivo .zip que você baixou e entre na pasta gerada, você verá a lista de arquivos que precisa deixar pronta para publicar online.
Passo #11
Para inserir a foto que quer usar, selecione o arquivo de qualquer outra pasta e cole dentro da pasta dos arquivos da página. Depois, apague o arquivo foto.jpg original e renomeie a sua foto escolhida para foto.jpg.
Passo #12
Para preencher as informações, abra o arquivo index.php (selecione Bloco de Notas no Windows ou Notas no MAC para abri-lo).
Localize no código o conteúdo de cada seção e substitua por suas informações. Na primeira parte, edite o título, a descrição e mais info (caso necessário; caso não, é só apagar o texto original).
Depois, cole o código que você salvou lá da configuração do botão do PagSeguro no local indicado e edite suas informações de contato. Terminou? É só salvar o arquivo e fechar o Bloco de Notas/Notes!
Parte #4: Colocando sua página no ar (yay!)
EU ACHO QUE VOCÊ NÃO ESTÁ PREPARADO(A) PRA ISSO!
Hora de colocar sua página pra funcionar no endereço do site que você mesmo escolheu, comprou e agora vai configurar! Lembrando que esta parte do tutorial é baseada no serviço de hospedagem de sites profissionais da Hostgator (que recomendo), mas se você escolheu outro plano de hospedagem, é só adequar estes passos finais de acordo com o seu serviço.
Passo #13
Acesse o site da Hostgator, clique em Portal do Cliente e faça login com seus dados cadastrados.
Passo #14
Na tela seguinte, clique na opção cPanel. Ao carregar, escolha a primeira opção, Gerenciador de Arquivos.
Passo #15
Aqui, você vai enviar os arquivos da pasta que você baixou e editou para sua hospedagem. No Gerenciados de Arquivos, localize a pasta public_html (seja na área da esquerda ou da direita) e clique para abri-la.
Passo #16
Ao abrir a pasta, você poderá ver alguns arquivos ali. O importante é, antes de continuar, apagar qualquer arquivo cujo nome comece com index para evitar conflitos com o que vamos adicionar.
Basta selecioná-lo e clicar em Excluir na barra de ferramentas acima. Se não tiver nenhum arquivo assim, é só seguir adiante.
Passo #17
Na barra de ferramentas principal, clique em Carregar. Na página seguinte, clique em Selecionar arquivo e selecione cada arquivo que veio na pasta .zip que você baixou e editou (você também pode arrastá-los de uma vez só do seu computador para a área exibida na tela).
Assim que você indicar os arquivos, o navegador já os enviará automaticamente.
Enviou? ESTÁ PRONTO!
Para confirmar, o seu Gerenciador de Arquivo deve ficar assim como na imagem abaixo, com todos os arquivos da pasta .zip do layout que você escolheu.
Para ver sua página em ação, é só digitar o endereço de seu domínio no navegador e checar COM SEUS PRÓPRIOS OLHOS (rs).
A jornada foi longa, mas espero que este tutorial e sua linguagem (tentei deixar o mais fácil e prático possível) tenham ajudado. Fez até o final? Compartilhe nos comentários o endereço da sua página para que eu conheça, adoro conferir os projetos de quem passou por aqui! 🙂
Lembrando que se você não encarou o tutorial, mas precisa de uma página de vendas online como esta, eu posso fazê-la diretamente para você (com precinho bem amigo!), clique aqui para saber mais →
Caso conheça alguém que possa aproveitar este tutorial, compartilhe o link e me ajude a divulgá-lo também. Qualquer dúvida, é só me escrever em guga@traum.com.br ou comentar abaixo que respondo para te ajudar.
Até a próxima! <3
Veja também…