Antes de tudo, preciso dizer que será um prazer ajudar você nesta implementação. É só me mandar uma mensagem.

Caso prefira seguir sozinho, abaixo temos um passo a passo. É importante ressaltar que essa implementação funciona apenas para o GA4. Se seu Google Analytics é antigo, provavelmente você tem o GA3. Se for esse o caso, confira o artigo Core Web Vitals no GA3.

Etapa 1 - Verificar se seu site possui GTM implementado

O primeiro passo é garantir que você já tem o Google Tag Manager (GTM) implementado no seu site. Se você não tiver o GTM, essa é a única etapa que irá precisar de um desenvolvedor. Certamente sua agência ou desenvolvedor vão saber dar uma resposta direta. Se você gosta de meter a mão na massa, pode baixar a Extensão Tag Assistant Legacy (by Google) para o Google Chrome. Depois de instalar a extensão, você deve ir ao seu site, habilitar o Tag Assistant e recarregar a página. Se a extensão mostrar que o site carregou o Google Tag Manager, significa que ele já está implementado no seu site.

Google Tag Assistant
Google Tag Manager

Além disso, você precisa verificar quem criou essa conta no Google Tag Manager. Alguém vai precisar lhe dar permissão para Edição e Publicação.

Se você não achou o GTM no seu site, seu desenvolvedor vai saber implementar isso bem rápido. Primeiro você precisa criar uma conta do Google Tag Manager. Depois é só enviar esse link para o seu desenvolver, que ele saberá o que fazer: https://developers.google.com/tag-manager/quickstart .

Etapa 2 - Baixar container

Aqui é importante ressaltar que, mesmo sem o GTM implementado no seu site, você já pode fazer as configurações necessárias. Assim, quando seu desenvolvedor fizer a implementação, tudo já estará funcionando.

Baixar arquivo do container aqui.

Neste arquivo, já criei todos os elementos necessários para capturar os dados. Você só precisa importar para sua conta do Google Tag Manager.

Etapa 3 - Importar container

Primeiro você terá que acessar sua conta do GTM. Na tela principal, na parte superior esquerda, existirá uma aba chamada Administrador.

Na tela seguinte, teremos que procurar a opção Importar Container.

Agora precisamos escolher o arquivo que baixamos na etapa 1. Aqui devemos ter atenção em dois pontos para evitar problemas. Na opção Escolher uma opção de importação, é preciso selecionar Combinar. Caso contrário, tudo que existe no seu GTM poderá ser excluído. 

Além disso, precisamos verificar se no resumo da importação nada foi modificado ou excluído. Caso contrário, você poderá perder as configurações antigas do seu GTM.

etapa4_1 - cwv e ga

Etapa 4 - Configurar disparo dos dados para o GA

Essa etapa é bem simples. Depois que você confirmar a importação, deverá voltar para o espaço de trabalho. Lá você vai ver, na lateral esquerda, uma opção chamada Variáveis.

Na página Variáveis, é preciso procurar pelo Identificador – GA4 . Nele você deverá colocar seu código do GA, aquele com a estrutura G-xxxxxxxxxx.

gtm ga4

Etapa 5 - Enviar modificações para produção

Agora você deve enviar para o seu site todas as alterações feitas. 

etapa7 - cwv e ga

Etapa 6 - Validar Dados

Nesta etapa, você deve confirmar se os dados estão sendo enviados para o Google Analytics. Ao acessar os dados em tempo real, você consegue confirmar se está tudo chegando como deveria. Antes, garanta que tem gente navegando no seu site. Caso contrário, esses dados não irão aparecer.

GTM GA4 CWV

Etapa 7 - Configurar o BigQuery no GA4

Melhor que explicar, é mostrar o passo a passo do próprio Google.

https://support.google.com/analytics/answer/9823238

Etapa 8 - Montar query para Extrair dados do CoreWebVitals

Você deve acessar seu projeto no BigQuery e criar uma nova consulta nos dados. Antes de executar, devemos colocar a query abaixo. Ela irá organizar os dados em colunas, para que possamos usar os dados no Google Data Studio.

 https://console.cloud.google.com/bigquery

bigquery-config2
				
					SELECT 
(SELECT value.string_value FROM UNNEST(event_params) AS param WHERE param.key='webvitals_id') AS id,
(SELECT value.string_value FROM UNNEST(event_params) AS param WHERE param.key='page_location') AS page_location,
device.category,
event_name,
(SELECT value.double_value FROM UNNEST(event_params) AS param WHERE param.key='webvitals_value') AS webvitals_value,
(SELECT value.double_value FROM UNNEST(event_params) AS param WHERE param.key='value') AS webvitals_delta,
event_date, 
event_timestamp, 
FROM `corewebvitals-312723.analytics_271381142.events_*`
WHERE event_name IN ('LCP', 'FID', 'CLS') AND
      _TABLE_SUFFIX BETWEEN FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 28 DAY)) AND FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 1 DAY)
)
				
			

Em seguida, temos que clicar em Explorar Dados. Com isso, seremos enviados para o Google Data Studio.

Etapa 9 - Salvar Explorador de Dados do Data Studio

Sugiro editar o nome gerado pela BigQuery e salvar o Explorador.

explorador datastudio

Etapa 10 - Editar Origem de dados

Ao clicar no logo do Data Studio, você será enviado para a página principal da ferramenta. Lá você terá acesso a todas as Origens de Dados. Como primeiro passo, sugiro editar o nome, para que fique mais fácil encontrá-la futuramente.

dataStudio editar nome

O Google Data Studio permite que façamos um tratamento nos dados. Precisamos incluir alguns campos novos, a fim de que fique mais fácil criar um Dashboard.

DataStudio Nome e Novo Campo

Devemos selecionar a opção Adicionar um Campo. Vamos precisar incluir quatro novos campos. Abaixo, seguem as configurações de cada novo campo.

Nome do Campo: CLS

				
					CASE
  WHEN webvitals_value > 250 THEN "Poor"
  WHEN webvitals_value > 100 THEN "Needs Improvement"
  ELSE "Good"
END
				
			

Nome do Campo: FID

				
					CASE
  WHEN webvitals_value > 300 THEN "Poor"
  WHEN webvitals_value >= 100 THEN "Needs Improvement"
  ELSE "Good"
END
				
			

Nome do Campo: LCP

				
					CASE
  WHEN webvitals_value > 4000 THEN "Poor"
  WHEN webvitals_value > 2500 THEN "Needs Improvement"
  ELSE "Good"
END
				
			

Nome do Campo: p75

				
					PERCENTILE(
CAST(
webvitals_value AS NUMBER),75
)
				
			

Etapa 11 - Montar dashboard no Google Data Studio

Agora que todos os dados estão organizados, você pode criar seu dashboard. Se quiser partir de um modelo já criado, mande uma mensagem pra mim que compartilharei o meu com você.