How to use Livewire’s ‘wire:navigate’ with Fathom Analytics – Laravel

The ‘wire:navigate’ makes navigation much faster by preventing browser page reloading in Laravel. However, this avoids analytics to track clicks on the page. Let’s go through this code example to check the use of Livewire’s ‘wire:navigate’ with Fathom Analytics.

Fathom Analytics helps here to force track clicks. 

In such cases, you can use Laravel events as shown below along with Fathom Analytics. 

document.addEventListener('livewire:navigated', function() {

 if (window.fathom) {

window.fathom.trackPageview()

}

})

Add a JavaScript event listener to the navigated event by livewire. It reads if the ‘wire:navigate’ event took place. In that case, it tracks a page view using Fathom analytics.