Criando um site do zero com WordPress - #22 Cadastro de Clientes I
22/03/2018Nessa vídeo-aula vamos iniciar o aprendizado de cadastro de usuários no banco de dados. Iremos demonstrar como realizar o cadastro completo através da codificação e sem uso de plugins.
Entendendo nossas tabelas
Para inserirmos usuários no banco de dados, vamos ter que utilizar três tabelas do banco de dados:
1 - wp-users: responsável pela ID primária e pelos dados do login
2 - wp-usermeta: responsável pelas características do nosso usuário
3 - wp-post e wp-postmeta: responsáveis por abrigar o caminho da imagem do perfil do usuário.
Criando arquivos
Vamos precisar criar 02 arquivos, sendo eles o page_cadastro.php e o controllercadastro.php. Lembrando que todo arquivo que criamos, para que ele exista no sistema é necessário que o adicionemos na aba páginas do painel de controle. Posteriormente iremos aplicar o código aos arquivos:
#page_cadastro.php
<?php /* Template Name: Cadastro */ ?>
<?php get_header(); ?>
<form name="FormCadastro" id="FormCadastro" action="<?php echo site_url().'/controllercadastro' ?>" method="post" enctype="multipart/form-data">
<div class="CadastroFormulario">
<input type="text" name="Nome" id="Nome" placeholder="Nome:" required>
</div>
<div class="CadastroFormulario">
<input type="text" name="Sobrenome" id="Sobrenome" placeholder="Sobrenome:" required>
</div>
<div class="CadastroFormulario">
<input type="email" name="Email" id="Email" placeholder="Email:" required>
</div>
<div class="CadastroFormulario">
<input type="text" name="Site" id="Site" placeholder="Site:">
</div>
<div class="CadastroFormulario">
<input type="text" name="Usuario" id="Usuario" placeholder="Usuário:" required>
</div>
<div class="CadastroFormulario">
<input type="text" name="Senha" id="Senha" placeholder="Senha:" required>
</div>
<div class="CadastroFormulario">
<input type="text" name="ConfSenha" id="ConfSenha" placeholder="Confirmar a Senha:" required>
</div>
<div class="CadastroFormulario">
Foto do perfil: <input type="file" name="Imagem[]" id="Imagem">
</div>
<div class="CadastroFormulario">
<input type="submit" value="Cadastrar">
</div>
</form>
<?php get_footer(); ?>
#page controllercadastro
<?php /* Template Name: Controller Cadastro */ ?>
<?php
$Id=0;
$Nome=filter_input(INPUT_POST,'Nome',FILTER_SANITIZE_SPECIAL_CHARS);
$Sobrenome=filter_input(INPUT_POST,'Sobrenome',FILTER_SANITIZE_SPECIAL_CHARS);
$Email=filter_input(INPUT_POST,'Email',FILTER_SANITIZE_SPECIAL_CHARS);
$Site=filter_input(INPUT_POST,'Site',FILTER_SANITIZE_SPECIAL_CHARS);
$Usuario=filter_input(INPUT_POST,'Usuario',FILTER_SANITIZE_SPECIAL_CHARS);
$Senha=filter_input(INPUT_POST,'Senha',FILTER_SANITIZE_SPECIAL_CHARS);
$ConfSenha=filter_input(INPUT_POST,'ConfSenha',FILTER_SANITIZE_SPECIAL_CHARS);
$Imagem=$_FILES['Imagem']['tmp_name'];
$Imagem2=$_FILES['Imagem']['name'];
$TesteUsuario=$wpdb->get_results("select * from wp_users where user_login='$Usuario' or user_email='$Email'");
$NomeCompleto=$Nome.' '.$Sobrenome;
$Data=date('Y-m-d g:i:s');
$hash = wp_hash_password($Senha);
$rand=rand(0,1000000);
if($Senha != $ConfSenha){
echo "Senha diferente de confirmação de senha";
}elseif(count($TesteUsuario) > 0){
echo "Usuário já existe";
}else {
$wpdb->get_results("insert into wp_users values(
'$Id',
'$Usuario',
'$hash',
'$Usuario',
'$Email',
'$Site',
'$Data',
'',
'0',
'$Usuario'
)"
);
}
?>
Nos códigos acima, a página cadastro será responsável pelo formulário HTML5 e a página controllercadastro será responsável pelo recebimento de variáveis e inserção no banco de dados.
Por fim vamos estilizar nosso formulário:
.CadastroFormulario{float:left; width: 60%; margin: 30px 20% 15px 20%;}
.CadastroFormulario input[type='text'] , .CadastroFormulario input[type='email']{float: left; width: 100%; height: 40px;}
.CadastroFormulario input[type='submit']{display:inline-block; width: 20%; height: 40px; font-size: 17px; color:#FFF; font-weight: bold; text-align: center; border:0; cursor:pointer; background: #83AA4B;}