Formulário feito para fins de estudos de phpMailer e sass.
Nesse projeto estudo, foi levado em consideração assuntos já abordado em cursos, e também fazendo estudo de UI/UX, aplicando em um simples formulário de contato.
Na simplicidade das cores, das formas, dá para ver como o usuário se portará diante a um componente desses em seu site, não fazendo-o ter que se desdobrar para conseguir entrar em contato com o servidor do serviço requerido.
Foi levado em consideração vários fatores para a conclusão deste estudo, cmo:
- Simplicidade
- Cores impactantes
- Clean
- Moderno
- Elegância
Dentre todos os fatores abordados, foi conseguido chegar em todos eles, simplicidade está nas linhas de cada campo do formulário. Cores impactantes, estão nas bordas dos campos e puxando o outor fator clean, que está nas cores dos textos, deixando leve o visual, tornando-o leve e minimalista. O moderno está na composição em sí, simples e objetivo como ficou. A legância se atingiu bem por ser moderno e clean, deixando com ar elegante.
Aqui estarei deixando o manual de uso para quem precisar usar esse mesmo design de formulário para seu websites, sistemas, e afins.
Foi feito um mini-framework para realizar a estilização deste formulário, fazendo assim um boot. Para que possa mudar como queira, segue as seguintes explicações:
Reset: Foi feito o reset de margin, padding, box-sizing foi utilizado border-box; e a fonte que foi utilizada foi a ROBOTO. E também no reste foi feito do outline utilizando o focus, e tirando essa borda do navegador ao clica no campo.
HTML,BODY: foi feita a setagem de height: 100% , para que pudesse utilizar porcentagem se precisasse.
Foi utlizado classes para setagem de width, para deixar o código mais limpo.
.w33: width: 33.3% .w50: width: 48 % para deixar um espaçamento entre os campos. .w100: width: 100%
Foi utilizado classe outras classes como:
.clear: foi setado em clear:both para fazer a limpeza cause usasse o float .container: foi estipulado uma setagem para que ficasse com max-width de 700px, com padding 0 e margin: 0 auto, para ficar centralizado. .left: foi utilizado para float: left .right: foi utilizado para float: right;
Aqui será explicado como utilizar o formulário para o envio dos e-mail e como fazer a configuração dele.
O arquivo para a configuração de host, senha, email e porta, está localizado dentro da pasta Classes, com o nome Mail.php Dentor desse arquivo, já no início tem as variáveis publicas com os comentários.
$email: será para colocar o webmail $senha: será para colocar a senha do seu webmail $host: aqui será destinado para colocar o host de acesso $port: aqui vai a port de SMTP.
O projeto de estudo chegou ao fim com a conclusão de entender o processo de um formulário feito com php, entendendo assim variáveis, e entendo os métodos do phpMailer.
espero que gostem e que possam usar esse estudo em seus projetos. Qualquer dúvida só entrar em contato, estarei deixando meu contato logo abaixo.
E-mail: [email protected]