Pesquisar na Comunidade

Recentemente a empresa AMPER.AG entrou em contato comigo, através da minha empresa de desenvolvimentos de sites em Wordpress - Pixel Project. A demanda era relativamente simples, mas também complexa. O cliente indicou que a validação (obrigatóriedade de preenchido) dos campos não funcionava, além disso caso algum dos campos fosse esquecido no preenchimento, todos os dados já preenchidos era perdido. Mesmo após relatarem esse problema a RD STATION, o suporte da plataforma indicou que eles deveriam contratar alguém especialista em Javascript para corrigir a situação. Originalmente eles tinham esse código abaixo, que funcionava para impedir que o formulário fosse disparo sem o preenchido do formulário. Esse era o código original deles: <script type="text/javascript"> </script> <script type="text/javascript"> function limparCampos(){ $('form').trigger('reset'); $('input').prop('checked', false); } function checkRequiredFields(){ let requiredFields = document.querySelectorAll('[required]'); let allFieldsFilled = true; requiredFields.forEach(function(field) { if (!field.value) { allFieldsFilled = false; } }); return allFieldsFilled }; $(document).ready(function(){limparCampos();}) $('form').on("submit",function(event){ if (checkRequiredFields()) { window.setTimeout(function(){limparCampos();}, 1000); }else{ event.preventDefault(); } }); </script> Porém, após uma atualização recente, esse código parou de funcionar. Para resolver a situação eu utilizei o código a seguir. <script type="text/javascript"> function checkRequiredFields() { let allFieldsFilled = true; let requiredFields = document.querySelectorAll('form [required]'); requiredFields.forEach(function (field) { if (field.type === 'checkbox' || field.type === 'radio') { let checked = document.querySelector(`input[name="${field.name}"]:checked`); if (!checked) allFieldsFilled = false; } else if (!field.value.trim()) { allFieldsFilled = false; } }); return allFieldsFilled; } document.addEventListener('DOMContentLoaded', function () { document.querySelector('form').addEventListener('submit', function (event) { if (checkRequiredFields()) { setTimeout(function () { event.target.reset(); }, 1000); } else { alert('Preencha todos os campos obrigatórios.'); event.preventDefault(); } }); }); </script> Nesse código, ele conseguiu abrager todos os campos que eu precisava. Mas onde inserir o código? É bem simples. 1. Abra a sua landing page que deseja editar. 2. Vá em EDIÇÃO AVANÇADA, em seguida aba Javascript em HEAD, cole o código acima no campo e salve. Após isso, todos os campos serão obrigatórios. Lembrando que esse ajuste deveria ser feito pela própria RD STATION. A solução foi feita através do CHATGPT, como eu não tenho conhecimento técnico na linguagem, utilizei a ferramenta e ela me ajudou.

E aí, povo. Seguinte, pra quem tá querendo começar a programar e já leu sobre por onde começar, viu python e javascript nas sugestões e decidiu seguir pelo javascript, eu to recomendando esse curso aqui que vai te ajudar muito a dar os primeiros passos tanto na linguagem e na lógica de programação(isso pra quem não for programador, claro kk) O curso é gratuito e tá todo hospedado no youtube, só não tem muita divulgação e eu não sei por quê:

Basta você colar antes da tag <“/head”> do seu site o código javascript abaixo: <script src="https://sites.google.com/site/novoefeitoneve/home/novoefeitoneve/snowstorm.js"></script> Se você utiliza WordPress, então cole este código no arquivo header.php do seu tema antes da tag body. O arquivo header.php fica localizado dentro do seu tema atual WordPress. Ex: “/wp-content/themes/nomedotema/”

Atribuição por Desestruturação é uma adição do ES6 que permite extrair dados a partir de arrays ou objetos e atribuir a variáveis. Essa técnica é bastante usada ao se trabalhar com props no React.js, também podemos ver a sintaxe de desestruturação implementada em outras linguagens, inclusive o C# a partir da versão 7 possui a sua implementação, chamada de Desconstrutor como pode ser conferido aqui. O conceito do destructuring é basicamente a divisão de uma estrutura complexa em partes mais simples. Em JavaScript pode ser utilizado em Arrays e Objetos. Desestruturando Arrays Ante do ES6 para fazer a atribuição de diversos valores de um array em variáveis distintas era preciso fazer diversas declarações: var skills = ['CSS','HTML','Node']; var css = skills[0]; var html = skills[1]; var node = skills[2]; Precisávamos de uma declaração para cada atribuição. Com a sintaxe de desestruturação podemos fazer o mesmo de uma forma mais sucinta: const skills = ['CSS','HTML','Node']; let [css, html, node] = skills; Também é possível fazer a desestruturação atribuindo vários elementos do array para um outro array. Vamos acrescentar mais alguns itens ao nosso array skills: const skills = ['CSS','HTML','Node', 'C#']; Agora a ideia é atribuir os valores ‘Node’ e ‘C#’ para um novo array chamado backend: let [css, html, ...backend] = skills; Ao executar o exempo podemos ver que as variáveis css e html permaneceram com seus respectivos valores, já a variável backend recebeu os valores consecutivos. Isso foi possível ao se utilizar o operador spread(os três pontos antes da variável): Desestruturando o retorno de uma função É possível desestruturar um array retornado por uma função. Vamos criar uma função que irá retornar alguns horários de um suposto agendamento: function horariosAgendamento(){ return ['08:00', '09:00', '10:00']; } E para fazer a desestruturação basta declarar as variáveis recebendo o retorno da função: let [primeiraHora, segundaHora, terceiraHora] = horariosAgendamento(); Objetos O mesmo pode ser feito com objetos, ao desestruturar um objeto pegamos suas propriedades e atribuimos a variáveis. Vamos criar um objeto pessoa: let pessoa = { 'nome' : 'Thiago', 'sobrenome' : 'Reis', 'skills' : [ 'css', 'javascript', 'html', 'react', '.net', ] }; O objeto criado é composto por três atributos, nome, sobrenome e skills. Em seguida vamos atribuir o valor de cada atributo do objeto a uma variável específica: let { nome, sobrenome, skills } = pessoa; Diferente da desestruturação de arrays, em objetos utilizamos chaves em vez de colchetes. Vale lembrar que o nome das variáveis deve ser o mesmo nome do atributo no objeto, caso contrário o valor das variáveis será undefined. Post originalmente postado no meu site pessoal: thiagoreis.dev

Nesse tutorial vou explicar como manter seus direitos autoriais sempre atualizados. Eu gosto desse simples código, pois ele garante que meus sites sempre se demonstrem atualizados. <script>document.write(new Date().getFullYear());</script> Ele funciona perfeitamente em arquivos HTML e PHP. Um exemplo de código de HTML usado e seu resultado. © Copyright 2010 - <script>document.write(new Date().getFullYear());</script> | Todos os Direitos Reservados <a href='https://laboratorioranieri.com.br' target='_blank'>Laboratório Ranieri</a> | Desenvolvido por <a href='https://pixelproject.com.br' target='_blank'>Pixel Project</a> Resultado:

Se você quer fazer nevar em seu website, é simples, basta copiar e colocar esse código abaixo e coloca-lo dentro da tag <head>. <script src="https://edu-de-lucas1.webnode.com/_files/200000134-b6879b8327/CodigoNeve.js"></script>

Gostou do nosso botão flutuante? hehehe, pois é, agora vou ensinar para você como fazer para ter em seu site, são passos bem simples que te ajudarão a por no seu site sem erros. então vamos lá 1º Passo 2. Passo 3º Passo 4º Passo 5º Passo Em caso de dúvidas, só postar aqui Gostou do tutorial e quer me motivar para trazer mais? Então não se esqueça de curtir