ATUALIZADO: Como receber relatórios do Google Analytics por e-mail

Google Analytics atualizou e incrementou a ferramenta de envio de relatórios por e-mail. Veja neste tutorial como você pode configurar e receber seu relatório Analytics.

Há um tempo atrás, já tinha publicado aqui um tutorial sobre como configurar o enviar o relatório do Google Analytics para o seu e-mail. De um tempo para cá, aumentaram a quantidade de recursos e a segmentação dos relatórios. Sendo assim, você irá configurar quais métricas irão chegar no seu relatórios. Veja como fazer:

1. Faça login na sua conta Analytics e escolha qual diretório você quer configurar (se tiver mais de um site cadastrado).

IMPORTANTE: você será direcionado para a página "Relatórios", mas não se deixe enganar pelo link "E-mail" no meu abaixo, pois essa ferramenta é limitada e só envia 1 métrica de vez. E você não vai querer sua caixa de e-mail lotada de mensagens do Google Analytics. Siga com o tutorial para configurar várias métricas em uma só mensagem.

2. No menu do topo, clique em "Personalização" (ao lado de "Relatórios"), depois clique em "Novo relatório personalizado".

3. Você será direcionado para um painel. É nele que você irá nomear e configurar seu relatório. Defina as métricas que deseja receber, depois clique em "Salvar", no fim da página.

4. Repare que você ainda está na aba "Personalização", visualizando os dados escolhidos no passo anterior. Agora clique no botão "E-mail" do menu para abrir a caixa onde você irá indicar para qual e-mail o relatório será enviado. Repare que o relatório personalizado no passo anterior já está selecionado. Lembre-se de escolher o formato no qual deseja receber o relatório (PDF, Excel e etc.), depois clique em "Enviar" para finalizar.

Os relatório do Google Analytics são essenciais para você aprimorar seu site ou blog. Aproveite!

Como retirar a sombra das imagens no Blogger

Com um simples código em CSS, retire a sombra que é padrão em alguns templates do Blogger.

Reformulando um pouco o visual aqui do Blogfólio, uma das primeiras coisas a alterar foi a configuração da exibição de imagens. Por padrão, meu template coloca, automaticamente, uma borda branca e uma sombra em volta de qualquer imagem publicada. Como não gostei do resultado disso, retirei tudo, com um simples código. O passo a passo é simples:

1. No seu painel do Blogger, acesse Configurações > Modelo, depois clique no botão "Personalizar". Depois que o painel se abrir em outra página, clique na opção "Avançado". Role a barra até o final e selecione "Adicionar CSS"

A caixa branca acima deve ser o seu destino final do painel.

2. Agora é só copiar o código abaixo e colar na caixa branca. .post-body img, .post-body .tr-caption-container, .ss, .Profile img, .Image img, .BlogList .item-thumbnail img { padding: none !important; border: none !important; background: none !important; -moz-box-shadow: 0px 0px 0px transparent !important; -webkit-box-shadow: 0px 0px 0px transparent !important; box-shadow: 0px 0px 0px transparent !important; }
Clique em "Aplicar ao blog" e pronto! Isso deve retirar a sombra das imagens. O resultado você pode comprar na imagem abaixo.

Imagem com borda e sombra x borda e sombra removidas.

Receba os dados do Analytics em seu e-mail

Configurando o perfil cadastrado é possível poupar algum tempo recebendo relatórios periódicos por e-mail.

Há algum tempo, ter um website e participar ativamente na internet se tornou imprescindível. Com o avanço das pessoas e empresas na internet, houve, naturalmente, um avanço dos serviços disponíveis para incrementar as ferramentas online. Dentre vários essenciais, temos o Google Analytics. Com ele é possível acompanhar dados de tráfego do seu site, gerar análises, estudar seu público e antecipar ações.

Todavia, nem tudo é tão simples quanto parece. Analisar os dados requer tempo e cautela, principalmente quando não se tem profissionais aos quais recorrer. Se você não tem uma conta Analytics, faça uma. Vale muito! Se você tem, siga os passos abaixo para configurar o recebimento de relatórios periódicos em seu e-mail. Veja como fazer:

1. Faça o login em sua conta Analytics e selecione o perfil;
2. Escolha o relatório que deseja receber (geral, origens de tráfego e etc);
3. Clique em "E-mail" no menu abaixo do nome do relatório;
4. Indique o e-mail que deseja receber o relatório e com qual frequência, além do formato de arquivo para baixar ou visualizar e a mensagem personalizada ao enviar.

Provavelmente você recebeu essa dica por e-mail, se for usuário assíduo do Analytics. Mesmo assim, fica aí a dica. Com certeza você não vai deixar de acompanhar seu tráfego por falta de tempo, ou preguiça de acessar o Analytics.

Como mudar a cor do texto selecionado no meu site ou blog via CSS

Com atributo CSS de simples aplicação é possível determinar a cor do texto selecionado pelo mouse em seu site ou blog. Aprenda como fazer.

Pode parecer pouca coisa, mas é exatamente o cuidado com pequenos detalhes que podem gerar surpresas agradáveis para seu público. É assim para marcas, produtos e também para seu site ou blog. O recurso em questão se trata de uma aplicação em CSS com a qual você pode indicar como serão as cores do texto selecionado pelo mouse.

Tanto o código quanto sua aplicação são bem simples, mas é bom ter algum conhecimento em CSS para garantir que não exista erro. Basta copiar:

::selection { background: #COR DA SELEÇÃO; color: #COR DA FONTE; } ::-moz-selection { background: #COR DA SELEÇÃO; color: #COR DA FONTE; }

Lembre-se de determinar os campos "COR DA SELEÇÃO" e "COR DA FONTE" pelos valores das cores que você quer aplicar.

Este recurso é visível nos navegadores Chrome, Firefox (por causa da tag -moz-), Safari, Opera e IE9. Você pode também demarcar a cor da seleção em áreas específicas da página, como no exemplo abaixo, onde o "p" indica a tag <p>, de parágrafo.

p::selection { background: #0066ff; } p::-moz-selection { background: #0066ff; }

Aplicação no Blogger

Para aplicar no Blogger você pode ir em seu painel e acessar Modelo > Personalizar > Avançado > Adicionar CSS, inserir o código e salvar a alteração. Outra opção é ir em Modelo > Editar HTML, clicar na tag <b:skin> para abrir o CSS, inserir o atributo e salvar as alterações.

Aplicação no Wordpress

No Wordpress você pode usar o campo de inserção de CSS (cujo local depende do seu tema escolhido) e adicionar o atributo, parecido com a primeira opção de configuração para Blogger. Outra opção é acessar seu painel, clicar em Aparência > Editor > Folha de Estilo (style.css) na barra lateral, inserir o código e salvar as alterações.

Para ver como funciona, basta selecionar o texto aqui no blog para ver que adicionei uma seleção meio laranja com a fonte branca. Divirta-se escolhendo a melhor cor para o seu.

Publique no LinkedIn, Twitter e Facebook ao mesmo tempo

Alinhando algumas configurações no seu painel é possível publicar nas 3 redes sociais ao mesmo tempo. Veja como fazer.

As redes sociais estão cada vez mais presentes em nossas vidas e tem sempre uma nova a cada momento, ideal para interagir e expor cada momento do cotidiano. Fazer o bom uso das redes sociais nos proporciona inúmeros prazeres e facilidades durante as atividades corriqueiras, como passatempos, manutenção de contato com amigos e parentes, informação e etc. Sem mencionar ainda os benefícios para empresas. Para alguns, por outro lado, pode ser que essa gama de recursos seja exagerada, tornando a interatividade via redes sociais um fardo, gerando ainda mais compromissos para manter tudo atualizado.
Se você se encaixa neste quadro, a dica desta publicação pode ser de grande valia. Com o tutorial a seguir será possível atualizar 3 das grandes mídias sociais disponíveis na atualidade: o LinkedIn, Twitter e Facebook.
É tudo muito simples e não precisa baixar ou instalar nada. Apenas encontrar algumas configurações um pouco mais escondidas nos painéis de controle. Vamos ao tutorial.

1 - Partindo do LinkedIn, a conexão de conta com o Twitter acontece quando você está nos primeiros passos de configuração do seu perfil. Se você não lembra se conectou sua conta ou deseja checar se o link das contas está ativo, vá ao seu painel de configurações.

Talvez seja necessário entrar novamente com e-mail e senha, devido a uma medida de segurança do LinkedIn. Feito isso, você será redirecionado às opções. Procure por "Gerenciar suas configurações do Twitter" nas opções de perfil. Clique e cadastre seu Twitter (@seunome).

2 - Agora no Twitter, abra o menu de configurações na barra do topo e clique em "Settings (Configurações)". Você será direcionado à seção de configurações, que começa na opção "Account (Conta)". Na barra lateral, troque para a opção "Profile (Perfil)". Role a página até o final e você verá a opção de conectar conta com o Facebook.

 

Marque a primeira opção para permitir que seus retweets sejam publicados, a segunda opção para que apenas suas publicações sejam redirecionadas, ou ambas para que todos seus tweets apareçam no Facebook.

3 - As configurações estão ajustadas. Agora volte ao LinkedIn e escolha a opção "LinkedIn + Twitter (@seunome)", como no exemplo abaixo. Importante: repare que, ao selecionar a opção de compartilhar com o Twitter, seu texto passa a ser limitado aos 140 caracteres. Agora é só fazer sua publicação.

Pronto! Sua postagem será compartilhada de uma rede para outra, automaticamente. Todavia, é importante lembrar que cada rede social tem sua particularidade e, por causa disso, é melhor se certificar que sua publicação tenha definições claras de escrita, público e objetivo para garantir que a ação de publicar o mesmo texto não interfira em suas metas de mídia.

Como listar posts relacionados no final das suas publicações

Fácil de instalar, use este widget no seu Blogger. Mantenha seu leitor navegando por mais tempo e ganhe mais acessos em suas postagens.

Já temos aqui no site alguns tutoriais para Wordpress e Facebook. Já estava na hora de colocar também uma dica muito boa para usuários do Blogger.
A dica da vez é sobre como instalar o widget para exibição de posts relacionados no final das suas publicações do blog. Assim você dá mais espaço para postagens anteriores, aumentando sua quantidade de acessos e mantendo o leitor por mais tempo no seu site ou blog.

Vamos ao tutorial (primeiramente, lembre-se de estar logado na sua conta do Blogger):
1 - Acesse o LinkWithin, site que fornece o widget.  Preencha os campos descritos abaixo:

 

• a: seu e-mail;
• b: endereço do seu site;
• c: plataforma (Blogger, Wordpress ou similar);
• d: quantos posts relacionados você desejar exibir;
• e:  marque a opção se seu blog tiver fundo escuro para obter uma outra opção de design.

Clique em "Get Widget" quando terminar.

2 - Já na página seguinte, clique no link "Install Widget". Os passos exibidos (em inglês) na página do LinkWithin correspondem ao que deve ser feito no próprio ambiente direcionado pelo link e o novo passo será exibido em outra aba.

Essa nova aba já funcionará dentro do ambiente do Blogger. É só preencher os dados:

• a: seu blog;
• b: nome da caixa (para o menu do Blogger);
• c: nesta parte você pode personalizar alguns detalhes, mas só é indicado para quem tem noções de HTML.

Concluindo as configurações, clique em "Adicionar widget".

3 - Está feito! Você será direcionado ao seu painel do Blogger, nas opções de layout. Repare que a caixa do gadget estará nomeada conforme sua configuração do passo anterior e, por padrão, posicionada na sua barra lateral. Sugiro arrastar a barra para baixo da caixa "postagens no blog", para disfarçar a caixa do novo widget, que aparece em branco.

É isso. Com 3 simples passos você terá esse recurso super importante para a navegação do seu blog. O resultado você pode conferir aqui mesmo, porque a seção "Também poderá gostar de:" abaixo deste post foi instalada com o mesmo serviço do tutorial. Ou então clique no botão "Visualizar" no seu painel.
Espero que ajude. Em breve novos tutoriais.

Como permitir o recurso "responder comentário" no Facebook

O Facebook tem agora o recurso de responder comentários dentro do conteúdo das fanpages, mas para isso você precisa autorizar seu funcionamento. Saiba como.

O recurso foi lançado como novidade no fim de março e ajuda os usuários a desenvolver conversas dentro das publicações, transformando outros comentários em novos tópicos (ou assuntos paralelos, de acordo com a vontade de quem comenta) no tema proposto pela postagem da página.
Saiba que é necessário habilitar este recurso no painel da sua página para que ele comece a funcionar. Se você perdeu o tour do Facebook sobre a ferramenta, confira este pequeno tutorial para ativá-la:

1. Na parte administrativa da sua página, clique em "editar página" e na opção "gerenciar permissões", que abrirá em seguida.
   
   
   2. Role a página para baixo. Você encontrará, desmarcada, a opção "permitir respostas a comentários na minha página". Marque (v) essa opção e confirme abaixo no botão "salvar alterações".
   
    

Feito! Todos os novos comentários, a partir de agora, terão a opção "responder" ao lado da opção de curtir, conforme a figura abaixo.

Como usar o Google Web Fonts

Mais uma ferramenta gratuita e super funcional do Google é o Web Fonts, um diretório de fontes de texto para uso online. Com ele você pode personalizar a tipografia do seu site, deixando-o mais bonito.
Para usar é muito simples: acesse o Google Web Fonts e siga os seguintes passos:

1- Escola a sua fonte pelo nome. Quando encontrar sua(s) favorita(s), clique em "add to collection".

2 - Repare que fonte foi adicionada à sua coleção. Sendo assim, clique no botão "use" para ser direcionado ao gerador dos códigos.

3 - Escolha os tipos de estilo que irão compor sua fonte (imagem 1). Repare na dica à direita e lembre que quando mais sua fonte comportar, mais tempo eu site levará para carregar. Por isso, escolha com cuidado e use o medidor de velocidade ao lado para ter uma idea de quanto tempo sua página leva com os estilos selecionados. Escolha agora as linguagens suportadas pela fonte (imagem 2), também lembrando que quanto mais você selecionar, mais tempo seu site levará para carregar. Entretanto, pense também que certos caracteres podem não ser identificados em alguns sistemas, caso a linguagem não seja compatível.

Imagem 1.

Imagem 2.

4 - Escolha entre as aplicações em HTML ou CSS. Por HTML, cole o código do quadro azul dentro da tag <head> do seu site. Se preferir a aplicação em CSS insira o nome da fonte ou cole toda a função font family em seu estilo CSS.

 

É simples assim! Para fazer este processo é aconselhado algum conhecimento de HTML/CSS. Se tiverem mais dúvidas deixem comentários.

Importando seus vídeos do Youtube na sua fan page

Não tem complicação. O Youtube For Pages é uma ferramenta de simples instalação/configuração e, com alguns passos simples, pega as configurações do seu canal do Youtube e aciona à fan page. Basta seguir os seguintes passos:

1-Busque o aplicativo (figura 1). Você será guiado até a página de início da instalação. Para começar, clique no botão para instalar (figura 2).

Figura 1.

Figura 2.

2 - Dê sequencia à instalação, clicando em "Adicionar Youtube for Pages". O aplicativo irá solicitar permissões. Basta ir clicando "OK" até chegar ao próximo passo.

3 - Adicione suas informações, curta o aplicativo, confirme os termos de uso e clique em "Save Changes".

 4 - Insira seus dados e configurações do Youtube, clique em "Save Changes" e pronto! Está tudo configurado. É só checar o menu da sua página.

Você pode configurar um vídeo como destaque, montar listas e fazer com que os uploads apareçam automaticamente no Facebook. Você pode ainda configurar a imagem do botão no menu da fan page clicando em "Editar Configurações", no próprio botão.

Botão inicial à esquerda e botão personalizado à direita.

Aplicativo de Facebook para página de bandas

Dentre as diversas possibilidades de se personalizar as páginas de Facebook, com intuito de melhorar a identificação com os fãs e aproveitar o máximo de recursos, vou focar esta dica num ramo específico: as bandas.
Atualmente muitas bandas e artistas independentes extraem o melhor da rede social para promover seu trabalho e aproximar o contato com os fãs de forma gratuita e ilimitada. Uma parte importante para a organização do artista é esclarecer sua agenda de shows para seu público. Por isso, vamos usar o Bandsintown para organizar os eventos da banda.

Para instalar e usar o aplicativo é simples:
1 - Busque o Bandsintown na Central de Aplicativos.

Busca.

 2 - Aceite que o aplicativo faça interações em sua página.

3 - Configurando: clique no botão manage. Você será direcionado para dentro do aplicativo na sua página. Lá será possível configurar opções como o visual da seção. O mais importante, porém, está na opção Create Event, onde será configurada a nova data da lista.

 

Configure uma imagem em Add Image e adicione uma data em Creat Event.

 4 -  Adicione a data, horário e local, que são informações básicas. Se você já dispõe de ingressos online para venda, insira o link do serviço na seção tickets. Clique em add details para informações adicionais. Quando finalizar, clique em Creat event.

Opções de configuração para novas datas.

 Feito! A data estará listada em sua página e o aplicativo irá, automaticante, criar e publicar um novo evento de Facebook no mural da sua página. Você ainda pode personalizar a imagem do botão no seu menu de aplicativos da página.

Novo evento publicado no mural.

Nova data listada no aplicativo da página.

Opção de configuração da imagem do botão.

Aproveite o aplicativo e bons shows!

Plugin de Wordpress para função mouseover

Função que ajuda a dar mais dinamismo ao conteúdo, a mouseover pode encontrar algumas complicações em alguns sites Wordpress. Veja esta dica de plugin para contornar o problema de forma fácil.

Desenvolvendo o conteúdo de uma página em Wordpress me deparei com uma grande complicação para uma coisa simples: a função mouseover. Também chamada de "rollover", a função consiste, simplesmente, em um botão ou imagem "animada", que reage e muda a aparência quando se passa o ponteiro do mouse em cima. Pois bem, o problema se deu que os formatos de diagramação em Wordpress não aceitavam códigos em JavaScript e HTML para a função. Tentei vários deles até buscar um plugin para Wordpress que realizasse a tarefa. Posso até dizer que tentei por último o que deveria ser a primeira opção, mas vamos ao que interessa.

O nome do plugin é Image Mouseover e para usar é muito simples. Basta acessar o link oficial para baixar e aprender a instalar.

Feito isso, monte as imagens que você deseja usar como botão. A imagem inicial (ON) e a outra (OVER), que irá aparecer ao passar o mouse, conforme o exemplo abaixo.

Depois é só usar o comando HTML tradicional para inserção de imagens: <img src="link da imagem ON" />. Agora é a hora da mágica. Adiocione as tags class="mouseover" e data-oversrc="link da imagem OVER" ao comando e a mágica acontece. Seu código deverá ficar assim:

<img class="mouseover" src="link da imagem ON" data-oversrc="link da imagem OVER" />

O resultado final será este:

 

Observação 1: suas imagens devem estar hospedadas em um servidor ou na própria galeria de mídia do seu Wordpress.

Observação 2: como este site não é em Wordpress, usei um comando de JavaScript no corpo da postagem com o seguinte código:

<img src="Link da imagem ON" onMouseOver="this.src='Link da imagem OVER'" onMouseOut="this.src='Link da imagem ON'" />

Façam bom proveito!

E a concorrência?

Em uma das várias visitas diárias ao Youtube, me deparei com um parceiro de Adsense um tanto inusitado: o Ask.com.

Anúncios do Ask.com no Youtube.

Se você não conhece, o Ask.com também é um buscador. Não dispõe de tantos serviços dinâmicos quanto o Google, tampouco tem a mesma fama. Seriam muitas coisas para dizer entre um e outro, mas o que vejo como principal característica é muito simples: são concorrentes! Se você, leitor, concorda comigo, escolha uma das opções sobre o Google Adsense aprovar o Ask.com como anunciante:

1. O Google realmente é dinâmico e democrático;
2. O Google foi descuidado;
3. O Google não tem medo da concorrência.

Todas essas hipóteses nos remetem a um pensamento que muitos internautas e profissionais da área reviram em suas mentes, que é: será que, algum dia, o Google perderá seu lugar? Na minha opinião, nunca se sabe. Sabe-se que atualmente o Google está na frente não só como buscador, mas como todo um conglomerado de serviços inovadores para diversos ramos de atividades digitais. Enquanto isso, seus concorrentes se reviram para buscar soluções. Ask, Yahoo!, Bing... a meu ver, nenhum ainda dispõe de um serviço diferenciado além das buscas para que, com o tempo, possam se tornar mais influentes.
O lugar do Google no topo pode depender, quem sabe, dessa capacidade de se manter inovador. Mas o futuro quem realmente sabe?