Enviar dados de formulário do Elementor Pro para função PhP e responder

A tempos venho trabalhando com Elementor Pro e tem ajudado muito nas entregas que temos feito aqui na agência em termos de agilidade no desenvolvimento. Nos últimos anos entregamos alguns sistemas de gestão e utilizamos Elementor Pro para construir as interfaces gráficas desses sistemas e o ponto alto desse processo se deu essa semana, quando conseguimos pela primeira vez receber os dados de um formulário em uma função PhP e retornar para o Java Script a resposta da nossa função, e não apenas “success”.

Nosso grande dilema até então era o fato de não termos controle sobre o que acontecia no back-end, apenas sabíamos que os dados haviam sido enviados com sucesso, se a função havia armazenado ou se algum dado estava com problemas era sempre uma incógnita.

Vamos a prática!

<?php
    add_action( 'elementor_pro/forms/new_record', function( $record, $handler ) { } );
?>

Essa é a action que trata os dados enviados por todos os formulários do site, ou seja, dentro da função pode-se identificar qual formulário enviou os dados e executar um script ou até mesmo funções com os dados enviados pelo formulário. Até aqui tudo certo, já era uma prática nossa, sua não? Então vou mostrar um pouco mais dessa action.

<?php
    add_action( 'elementor_pro/forms/new_record', function( $record, $handler ) {
        $form_name = $record->get_form_settings( 'form_name' );
        $raw_fields = $record->get( 'fields' );
        if( 'nome-do-formulario' == $form_name ) {
            $return = function_trata_dados( $raw_fields );
	    $handler->data['customer_mail'] = $return;
        }
    }, 10, 2 );
?>

A função executada na action usa dois parâmetros, o $record trás os dados do dormulário, então nele consigo identificar o nome do formulário (linha 2) e um array com os campos dele (linha 3), faça o que quiser com essas informações, acima estou mostrando um exemplo de uso.

O segundo parâmetro “$handler” foi o grande sucesso da semana, ele devolve ao front-end resposta sobre o envio, na posição “customer_mail” pode-se passar uma String que será tratada no JS a seguir:

<script>
    $(document).on('submit_success', '#id-formulario', function( event, response ) {
        if ( response.data.customer_mail ) {
            console.log( response.data.customer_mail );
        }
    });
</script>

E esse é o JS que trata a resposta da action “’elementor_pro/forms/new_record’”. Simples assim! (Depois de sabermos da existência disso hehehe).

Dúvidas, fica a vontade para comentar…

READ MORE
wordpress

Como adicionar campo para classe no widget do WordPress

Pra que você otimize seu tempo e seu projeto, segue uma dica super importante sobre o wordpress.
Estava desenvolvendo um projeto e precisava de um campo para colocar uma classe personalizada que pudesse diferenciar um widget do outro. Então achei essa função:

function field_in_widget_form($t,$return,$instance){
 $instance = wp_parse_args( (array) $instance, array( 'widget_class' => '') );
 if($instance['widget_class'] != ''){
 $value = $instance['widget_class'];
 }else{
 $value = '';
 }
 ?>

(Essa parte você pode personalizar o campo, usando outas tags, tipo de input etc…)

 <p> <input id="<?php echo $t->get_field_id('widget_class'); ?>" name="<?php echo $t->get_field_name('widget_class'); ?>" type="text" value="<?php echo $value; ?>" />
 <label for="<?php echo $t->get_field_id('widget_class'); ?>"><?php _e('Adicionar Classe'); ?></label>   </p>
 <?php
 $return = null;
 return array($t,$return,$instance);
 }
 add_action('in_widget_form', ' field _in_widget_form',5,3);

Onde está ‘widget_class’ vai o nome  que você quiser colocar para seu campo.
E para salvar o valor no seu novo campo usamos essa outra função:

function field_in_widget_form_update($instance, $new_instance, $old_instance){        $instance['widget_class'] = $new_instance['widget_class'];
 return $instance;
 }
 add_filter('widget_update_callback', ' field _in_widget_form_update',5,3);

E prontinho, agora você tem um campo para pôr classes no seu widget.
exemplo

READ MORE
abri-um-negocio-de-assinaturas-e-agora

Thumbnail não aparece quando vou cadastrar um post – e agora?

A resposta é bem simples e prática, está faltando o suporte ao tema para ativar o recurso das thumbnails.
Vá no arquivo functions.php do seu tema, e adicione a seguinte função:
add_action( ‘after_setup_theme’, ‘my_theme_setup’ );
function my_theme_setup(){
add_theme_support( ‘post-thumbnails’ );
}
Prontinho, agora você já pode cadastrar as thumbnails no seu post.

READ MORE

Saiba como preencher e limitar a quantidade mínima dos produtos no WooCommerce

Depois de muito quebrar a cabeça, a solução apareceu e era mais fácil do que o esperado.
No arquivo functions.php do seu tema adicione as funções:
Produto comum:
Add_filter(‘woocommerce_quantity_input_args’,’ex_woocommerce_quantity_input_args’,10,2);
function ex_woocommerce_quantity_input_args($args,$product){
if(is_singular(‘product’)){
$args[‘input_value’] = 25; (value do input)
}
$args[‘min_value’]=25; (valor mínimo)
return $args;
}
Produto Variável:
Add_filter(‘woocommerce_available_variation’,’ex_woocommerce_available_variation’);
function ex_woocommerce_available_variation($args){
$args[‘min_qty’]=25;
return $args;
}
Você pode pegar a quantidade mínima definida no cadastro do produto e por no lugar do número 25 da seguinte forma:
global $product;
$id = $product->get_id();
$min = get_post_meta($id,’min_qty’,true);
$args[‘min_qty’]= $min;

READ MORE

Problemas com Produto Variável com preços iguais – WooCommerce

Recentemente em um projeto de loja virtual enfrentamos um problema que em um primeiro momento parecia incoerente. Ao criar um Produto Variável, onde as variações tinham o mesmo preço, sua página deixava de mostrar o preço do produto.
Depois de alguns teste e buscas no nosso amigo Google, encontramos uma solução e uma explicação:
“Na realidade, este se destina a ser uma função de melhoria da performance / memória para evitar a renderização e processamento de dados duplicados variação no atributo de dados HTML. Mas ele acaba causando problemas, pois resulta na saída HTML de variações não sendo consistente de produto para produto. Realmente toda esta questão é devido a más práticas sendo usado por WooCommerce para tornar o conteúdo dinâmico para as variações, mas o que você pode fazer.”
Para resolver, basta incluir o código abaixo no arquivo functions.php do seu tema.
add_filter('woocommerce_available_variation', function($available_variations, WC_Product_Variable $variable, WC_Product_Variation $variation) {
if (empty($available_variations['price_html'])) {
$available_variations['price_html'] = '<span>' . $variation->get_price_html() . '</span>';
}return $available_variations;
}, 10, 3);

Espero ter ajudado mais colegas!
Fonte: http://stackoverflow.com/

READ MORE

Gerar Mapa do Site no WordPress

Uma das ações para melhorar a indexação do seu site pelos buscadores é disponibilizar um sitemap (Mapa do Site). Com ele os buscadores conhecerão o conteúdo completo do seu site, com link para as páginas.
Tenho utilizado para isso um Plugin que faz esse trabalho de forma automática e dinâmica, com pouca configuração e confiável.

Google XML Sitemap

READ MORE

Inserindo imagens em posts/páginas no WordPress

Escolhendo…

Posicione o cursor do mouse no ponto do texto onde você deseja inserir a imagem depois clique em “Adicionar Mídia”.
Abrirá uma janela mostrando as imagens constantes na sua biblioteca, imagens que já foram utilizadas em outros posts ou páginas, se desejar usar uma delas, clique sobre a imagem desejada, caso contrário clique em “Fazer upload dos arquivos” que fica logo abaixo do título Inserir Mídia.

Configurando…

Detalhes do anexo
Após ter feito upload ou ter selecionado uma das imagens constantes em sua biblioteca, você precisará configurar esta imagem usando os campos a seguir:

  • Título: aparece quando o usuário passa o mouse sobre a imagem;
  • Legenda: fica abaixo da imagem;
  • Texto alternativo: aparece no lugar da imagem quando, por algum motivo, ela não é carregada;
  • Descrição: descreve com mais detalhes a imagem e aparece quando o usuário clica sobre ela;
  • Alinhamento: posiciona a imagem perante o texto;
  • Link para: indica o que acontece quando usuário clicar sobre a imagem;
  • Tamanho: defini o tamanho da imagem no post, sendo que ao clicar irá mostrar o tamanho original da imagem.

Clique em “Inserir no post” no canto inferior direito da janela.

READ MORE

Adicionar/Editar Post no WordPress

Para facilitar o gerenciamento do seu novo site em WordPress, vou postar toques de como utilizar esta maravilhosa ferramenta. Começo mostrando como adicionar ou editar posts no WordPress, que podem estar sendo utilizados para diversas funções, vou explicar:
Esta ferramenta originalmente foi desenvolvida para gerenciar Blog’s e com o tempo foi se aprimorando até que hoje podemos utiliza-la para diferentes tipos de publicações na internet (blog, site, loja virtual, hotsite, portal, etc). Para cada tipo de publicação usa-se a estrutura do WordPress de forma diferente. Então quando entrego um site costumo orientar meus clientes como devem proceder para atualizar seus sites.

Painel administrativo WordPress

Então vamos aos posts: acesse seu Painel Administrativo, para os sites mais recentes use o endereço abaixo, insira seu usuário e senha.

www.seusite.com.br/prd/wp-admin

Detalhe PostsPara adicionar ou editar um post basta passar o mouse sobre o menu Posts na lateral esquerda do Painel Administrativo e escolher a opção desejada.
Neste mesmo item você poderá ainda gerenciar suas categorias e tags, que assim como os posts tem funções diferentes de acordo com o site. Em geral categorias separam os posts por assunto enquanto tags são as palavras-chave de cada post.
Adicionar posts
Na página de adição/edição temos alguns campos principais que vou explicar agora, são eles:
item01Para blogs o nome do campo já diz tudo, mas para uma empresa que usa posts para mostrar seus projetos esse é o campo onde se coloca o nome do projeto por exemplo;
item02Neste local é inserido o conteúdo do post (textos, imagens, formulários, tabelas, etc). Vou criar um post especificamente para falar sobre essa área que tem muitos recursos;
item03O resumo serve para apresentar uma prévia do post quando este aparecer em uma lista na página inicial ou página de categorias;
item04Discussão é onde você define se o post irá ter comentários ou não, se não deseja que o usuário comente sobre este conteúdo clique para tirar a seleção deste item;
item05Publicar já diz tudo, onde você irá publicar o post e ele passará a aparecer no site. Durante a edição do post o WordPress salva automaticamente seu post por motivo de segurança, mas se você quiser escrever um pouco em cada dia, pode clicar em “Salvar como rascunho” e voltar outra hora para continuar de onde parou, ele ficará salvo na sua lista de posts no painel administrativo mas não aparecerá no site.
Clicando em “Visualizar” abrirá outra janela mostrando como ficará o post quando publicado. Ali pode-se ainda mudar o status, de publicado para rascunho por exemplo para tirar um post do ar, alterar a visibilidade para que todos vejam ou somente pessoas autorizadas, mudar a data de publicação e até programar uma publicação e mandar o post para a lixeira, que funciona como a lixeira  do seu computador;
item06Escolha a categoria(s) a qual o post pertence e selecione. Quando selecionado uma categoria filha não é obrigatório selecionar a mãe, essa necessidade vai depender de como foi desenvolvido seu site, eu sempre informo essa necessidade se houver. Você pode adicionar categorias nesta página e decidir se ela será filha ou mãe, mas detalhes sobre ela (descrição, slug) somente serão editados no menu Posts > Categorias;
item07Digite as palavras-chave do post, separadas por vírgula, ou escolha entre as mais usadas no seu site.
item08Aqui será selecionada a imagem-chave do post, ela geralmente é usada junto com o resumo.
 
Faça suas postagens, publique e pronto! Simples assim, agora se ficou alguma dúvida, fique a vontade para me questionar aqui embaixo, em “Deixe seu comentário”.

READ MORE
wordpress_capa

Porque uso WordPress

Para aqueles que nunca ouviram falar em WordPress, primeiramente vou explicar o que é, melhor vou passar a explicação para quem o conhece melhor do que ninguém, os integrantes do Fórum WordPress Brasil:

WordPress é uma plataforma semântica de vanguarda para publicação pessoal, com foco na estética, nos Padrões Web e na usabilidade. O WordPress é ao mesmo tempo um software livre e gratuito. Em outras palavras, o WordPress é o que você usa quando você quer trabalhar e não lutar com seu software de publicação de blogs.

Então se você deseja ter um site, ou já possui um mas sua atualização é complicada, essa é a ferramenta que você está precisando!
Agora que você já sabe o que vou elogiar, vamos as vantagens:

Melhor Custo × Benefício

Claro, a maior de todas as vantagens, pensando como empresa, já que estamos falando de um sistema grátis! Sim, ao contrário de muitas aplicações o WordPress é grátis, então você não precisará desembolsar nenhum tostão para usá-lo ou ainda, não vai precisar ficar se “culpando” por estar utilizando um sistema de forma ilegal!

Lembrando que estamos falando apenas do sistema que irá gerenciar seu site, não quer dizer que você não terá custos com ele, não podemos esquecer que você precisa ter um domínio, que no Brasil custa R$ 40,00 / ano, um servidor para hospedar seu site, que você pode encontrar boas empresas de hospedagens por preços a partir de R$ 14,00 / mês, e um desenvolverdor que você pode entrar em contato por aqui para conversarmos sobre seu projeto 😉

Praticidade

O WordPress oferece um suporte ao desenvolvedor muito importante, fazendo com que este não precise escrever alguns processos, e usar o tempo para se preocupar com a estética do seu site e aprimorar a experiência dos usuários ao visitá-lo.

O seu colaborador por sua vez, é o maior beneficiado pela praticidade do WordPress, pois é ele que irá usá-lo como sua ferramenta de trabalho, incluindo e atualizando conteúdo a qualquer hora de onde estiver, quer seja de um computador, de um tablet ou até mesmo do seu celular. Com telas que facilitam o trabalho e destacam os recursos disponíveis o colaborador  faz seu trabalho com muito mais eficiência.

Usabilidade

Com sua base de dados inteligente, o usuário navega em seu site de forma simples, encontrando o que procura com naturalidade, já que o WordPress auxilia na indexação e distribuição do conteúdo em seu site.

Dinamismo

Atualmente as notícias caem na internet como uma rede de pesca solta seus peixes no barco “uns em cima dos outros”, então seu site precisa acompanhar este rítmo. Pra isso o WordPress conta com Plugins que ajudam na interação do usuário com as novidades do seu site, mostrando  a todo o momento novos conteúdos publicados, integrando seu site com redes sociais e muito mais, fazendo todo esse trabalho sozinho, sem precisar que você clique ou arraste nenhum botão na área administrativa.

Flexibilidade

Este é um ponto importante, pois é uma das qualidades de qualquer CMS (Content Management System). Contudo o WordPress em especial faz o que muitos, e estou falando de aplicações pagas, não fazem, ele deixa as portas abertas para você entrar, sem chaves nem maçanetas, simples assim é só empurrar e as portas se abrem.

O que eu quero dizer com isso? Se seu site precisa de uma funcionalidade muito específica, e nem o WordPress, nem o Plugin dão jeito de resolver, uma simples abertura de arquivo de configuração e alteração de duas ou mais linhas resolvem, simples assim! Sem precisar contactar o suporte, esperar dias até o consultor te atender e blá blá blá.

Fique calmo, esta flexibilidade toda é apenas para administradores do site, isso tudo não quer dizer que qualquer pessoa podem entrar nos arquivos de configuração do site e sair fazendo modificações. Podemos dizer que as portas internas não possuem chaves, mas a porta externa, a principal, essa sim, possui chave e tranca de ferro, e uma barra de ferro atravessada, e….

Confiança

Sim, pode deixar suas informações nas mãos deste poderoso CMS que ele não vai sair espalhando para quem quiser saber. O fato de ser grátis não faz com que o WordPress deixe de ser seguro. Possui uma poderosa ferramenta administrativa que classifica os usuários cadastrados em níveis de segurança para que cada tenha acesso apenas as funções que lhe competem. E como disse antes, fecha bem a porta de entrada para quem não pode entrar.

Estabilidade

Bem, para o quesito estabilidade, podemos dizer que é influenciado por uma série de fatores, externos e internos, mas no que  tange a responsabilidade do WordPress, pode confiar pois ele é muito confiável, não lhe deixará na mão.

Gostou do que leu? Está pensando em fazer um site ou atualizar o seu?
Entre em contato, tenho certeza que podemos resolver isso rápido e barato!
Está em dúvidas? Conheça alguns projetos feitos com o WordPress.

READ MORE