Acompanhamento de conversões WhatsApp

Para criar o acompanhamento de conversão dos botões de whatsapp dentro do google analytics siga os seguintes passos:

  1. Cadastre o site que irá realizar a conversão no google analytics;
  2. Acesse o site que você deseja criar a conversão;
  3. Crie o botão de whatsapp caso ainda não tenha;
  4. Com o botão de whatsapp criado, clique nele e aguarde carregar o chat com o numero aberto e funcionando certinho;
  5. Depois de ver que está tudo certo, abra o google analytcis;
  6. Quando acessar o google analytics, selecione a conta ou a propriedade do cliente;
  7. Depois  de acessar, no canto direito da tela clique em “tempo real” > “eventos”, conforme imagem abaixo:
  8. Depois de seguir os passos acima, irá carregar uma tela e mais abaixo terá o filtro do clique no botão de whatsapp, conforme mostra imagem abaixo:
  9. Agora, antes de seguir para o próximo passo, copie o nome da categoria do evento que nesse caso conforme mostra a imagem acima é “outbound-link” e copie também a ação de evento que é o link de acesso que está no botão do whatsapp ( dica: cole essas duas informações em um bloco de notas)
  10. Depois de copiar a categoria do evento e a ação do evento, clique na opção “administrador” na lateral esquerda da tela, conforme mostra imagem abaixo:
  11. Depois de carregar a página clique na ultima opção escrito “METAS”, conforme imagem abaixo:
  12. Em seguida clique na opção “+ nova meta”;
  13. E agora vamos criar a meta para a conversão:
  • Na primeira opção escolha “personalizado” e depois clique em continuar:
  • Logo após de um nome para a meta ex: (clique botão whasapp flutuante), no Código da posição da meta não precisa mexer e em tipo coloque a opção “evento” e depois clique no botão “continuar”:
  • Nessa ultima etapa em categoria, cole o nome da categoria que foi copiado no passo a passo acima e na opção ação também cole o link/texto de ação que foi copiado e depois clique em salvar :
  • Pronto, conversão de botão do whatsapp no google analytics criada.
    O numero de conversão aparece zerado pois ele contabiliza a partir do momento em que a meta foi criada.
    Caso queira fazer para mais de um botão de whatsapp basta seguir o mesmo passo a passo acima.

Tutorial completo também no youtube para ajuda:
https://www.youtube.com/watch?v=MTspnGosHuY

Resetar senha de admin do WordPress

Para resetar a senha do Adminstrador do WordPress você vai precisar:

  1. Acessar o diretório do tema do WordPress do website via FTP;
  2. Fazer o download do arquivo functions.php do tema utilizado pelo website;
  3. Abrir o arquivo functions.php e adicionar o seguinte código em qualquer lugar nas primeiras linhas do arquivo: wp_set_password(‘password’,1), onde ‘password’ deverá ser substituída pela senha desejada. EX:  wp_set_password(‘ud843nfdasj’,1)
  4. Suba o arquivo functions.php novamente na pasta do tema, substituindo o arquivo anterior;
  5. Acesse o /wp-login.php ou /wp-admin do site via navegador;
  6. Tente fazer o login com a nova senha, você irá ser redirecionado novamente para a tela de login;
  7. Volte ao editor do arquivo e retire a linha wp_set_password(‘password’,1) adicionada anteriormente, salve o arquivo e faça o upload novamente;
  8. Pronto! Você já pode acessar o site com o nova senha setada.

Código do botão de Whatsapp padrão

Segue abaixo o código utilizado para o botão de whatsapp fixo no site.

Trocar o link dentro do href  deve ser trocado para o link gerado através deste site com o número que o cliente informar.

<a target="_blank" href="https://api.whatsapp.com/send?phone=5551983326420" style="background: #00c565 url(https://impactamedia.com/whatsapp.png) center center no-repeat; background-size: 32px; width: 60px; height: 60px; position: fixed; right: 24px; bottom: 24px; text-indent: -9999px; border-radius: 80px; text-align: center; box-shadow: 0 0 20px rgba(0, 0, 0, 0.26); z-index: 999999999;" class="btn-whatsapp">Whatsapp</a>

O caminho do logo do whatsapp também deve ser ajustado.

Código para deixar o botão do whatsapp piscando

Segue o código abaixo. É recomendável colocar o código sempre no rodapé.

<a target="_blank" href="https://api.whatsapp.com/send?phone=5511958121370&text=Solicite%20seu%20Or%C3%A7amento" target="_blank" class="blinking" style="background: #00c565 url(/site/wp-content/themes/impactamidia/images/whatsapp-logo.png) center center no-repeat; width: 60px; height: 60px; position: fixed; right: 24px; bottom: 24px; text-indent: -9999px; border-radius: 80px; text-align: center; box-shadow: 0 0 20px rgba(0, 0, 0, 0.26); z-index: 999999999;" class="btn-whatsapp">Whatsapp</a>
<style>
.blinking {
 animation: blinker 1s linear infinite;
}
@keyframes blinker { 
 50% { opacity: 0; }
}
</style>

Mudanças do Bootstrap 3 para o Bootstrap 4

Principais diferenças do Bootstrap 3 para o Bootstrap 4 :

O Bootstrap 3 possui 4 sistemas de colunas  (col-xs-3, col-sm-3, col-md-3, col-lg-3).
O Bootstrap 4 possui 5 sistemas de colunas (.col-, .col-sm-3, .col-md-3, .col-lg-3, .col-xl-3). O Bootstrap 4 removeu o xs do break point mais baixo. Agora, o (col-) cobre todos os dispositivos.

A classe offset do Bootstrap 3 se coloca da seguinte forma (col-md-offset-4).
No Bootstrap 4 o offset foi alterado para (offset-md-4).

No Bootstrap 3 nós usamos a classe (.img-responsive) para imagens responsivas.
O Bootstrap 4 mudou a classe de imagem responsiva para (.img-fluid).

No Bootstrap 3 nós usamos (.input-lg) e (.input-sm) para aumentar e diminuir o tamanho do input.
O Bootstrap 4 alterou para (.form-control-lg) e (.form-control-sm) para aumentar e diminuir o tamanho do input.

Fonte: https://www.oodlestechnologies.com/blogs/What-is-the-difference-between-Bootstrap-3-and-Bootstrap-4/

Adicionar suporte ao formato SVG no WordPress

Primeiramente, temos que instalar e ativar o plugin SVG Support. Após isso, vamos acessar a guia Configurações > SVG Support.

Aqui vamos ter uma opção Enable Advanced Mode?, ela deve ser ativada caso queira fazer animações com o SVG.

O próximo passo agora é adicionar o seguinte bloco de código no final do arquivo functions.php do nosso tema.

function add_file_types_to_uploads($file_types){ $new_filetypes = array(); $new_filetypes['svg'] = 'image/svg+xml'; $file_types = array_merge($file_types, $new_filetypes ); return $file_types; } add_filter('upload_mimes', 'add_file_types_to_uploads');

Com isso o suporte para SVG já estará ativo no nosso tema e será possível enviar arquivos neste formato para a biblioteca de mídia do wordpress.

OBS.: Todo arquivo SVG, antes de ser aberto no editor de código (Sublime) e adicionado a seguinte linha no topo do arquivo:

<?xml version="1.0" encoding="utf-8"?>

Caso ele já possua essa linha, você não precisa mexer em nada.